Jump to content
  • 0

Помогите советом


dimacat
 Share

Question

Приветствую ! Хотелось бы попросить более опытных верстальщиков посоветовать: на картинке ниже то, как мне нужно сделать. Посоветуйте, как бы вы делали это ? Хочу просто понять, как делать такие надписи семантически правильно.

53c36add5081.jpg

Link to comment
Share on other sites

10 answers to this question

Recommended Posts

  • 0

Я бы сделал так:

<p>Моска: 8 /917/ <span>123-45-67</span></p>

<p>Уфа: 8 /927/ <span>123-45-67</span></p>

<p>Регионы РФ: 8 /917/ <span>123-45-67</span></p>

<p>Центраьный офис: г. Уфа, ул. Комсомольская, 156/1</p>

<p align="right" ><img src="Enter" />как доехать</p>

Осталось только настроить....

Вместо span можно font поставить...

Edited by Mr.Black
Link to comment
Share on other sites

  • 0

Я бы так сделал. Все таки это не абзацы, а некая информация. Вместо B можно использовать STRONG, но сколько бы я статей не читал, так до конца и не понял, где лучше употреблять B, а где STRONG

<span>Моска: 8 /917/ <b>123-45-67</b></span>
<span>Уфа: 8 /927/ <b>123-45-67</b></span>
<span>Регионы РФ: 8 /917/ <b>123-45-67</b></span>
<span>Центраьный офис: г. Уфа, ул. Комсомольская, 156/1</span>
<span class="right"><img src="Enter" alt=""/>как доехать</span>

css не писал, так как там ничего сложного. Только название классу надо дать не .right, а что-то типа .location - это для крутости.

P.S. А тег FONT использовать не надо. Он устарел.

Edited by Serlutin
Link to comment
Share on other sites

  • 0

Если реч идёт именно о семантически правильной разметке, тогда я бы рекомендовал обернуть так:

<address>
Мозква: 8 /917/ <em>123-45-67</em><br />
Уфа: 8 /927/ <em>123-45-67</em><br />
Регионы РФ: 8 /917/ <em>123-45-67</em><br />
Центральный офис: г. Уфа, ул. Комсомольская, 156/1<br />
<span class="right" ><img src="Enter" alt="" />как доехать</span>
</address>

Навеяно http://webstandards.org.ru/blog/layout/semantic-markup.html

Edited by deadrash
Link to comment
Share on other sites

  • 0

А вот не согласен я с EM, тогда уже больше STRONG подходит, так как он обозначает высокую важность. То есть номер телефона является более важной частью, чем код и префикс.

Link to comment
Share on other sites

  • 0

Да, элемент <strong> делает часть текста более важным чем <em>, но и <em> в свою очередь делает элемент текста более важным остального. Тут просто нет смысла использовать стронг, ЕМ уже показвает что номер - это важный, отдельный элемент текста. А стронг нужен когда на часть текста нужно обратить ОСОБОЕ внимание.

Edited by deadrash
Link to comment
Share on other sites

  • 0

А типа код города не важен? Если уж на то пошло то так:

<em>Москва: 8 /917/ <b>123-45-67</b></em>

Параграф не нужен, т.к. все это наверняка будет в блоке, а уж самому <em> можно сказать display: block;

P.S. И, как бы, код города для Москвы 495, и, как бы, привычнее, когда он в скобках, а не в слешах, и если уж это мобила, то лучше бы написать +7 вместо 8...

Link to comment
Share on other sites

  • 0

Не согласен с элементом <b> так как он предназначен для визуального оформления как и:

<b>, <basefont>, <center>, <font>, <i>, <s>, <strike>, <tt>, <u>

А если придерживаться правила w3с "разделение структуры от оформления", то лучше их не использовать, для них уже есть замена.

Для того же <b> есть <em> и <stront> на выбор.

Link to comment
Share on other sites

  • 0

Стоп не надо равнять теги <b> и <center>.

Теги <b> и <i> некуда не делись. Их можно и даже нужно использовать в разметке. Теперь они обозначают дополнительное выделение. Тег <i>, например, рекомендуется использовать для иностранных слов и терминов.

Вот статья интересная: http://web-standards.ru/articles/i-b-em-strong-elements/

А типа код города не важен?

Ну если судить по представленной картинке, то название города и его код являются менее значимыми, чем сам номер.

Тут еще стоит заметить для кого предназначается информация. Если это магазин в каком-то небольшом городе, то горожанам код города не так значим, как сам номер.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy