Вход/Регистрация
HTML5 для веб-дизайнеров
вернуться

Джереми Кит

Шрифт:

Рис. 5.01. Текст «об авторе» в этом скриншоте должен быть размечен с помощью footer, а не aside

В девяноста процентах случаев шапки будут расположены сверху от вашего содержимого, подвалы – внизу, а боковые колонки – по одной из сторон. Но не расслабляйтесь. Держите ухо востро и не пропустите оставшиеся десять процентов.

nav

Элемент

nav
выполняет ту самую функцию, которую, как вы предполагаете, он и должен выполнять. Он содержит навигационную информацию, обычно – список ссылок.

На самом деле давайте я лучше объясню. Элемент

nav
предназначен для очень важной информации по навигации. Одно то, что группа ссылок сгруппирована вместе в список, недостаточная причина для того, чтобы использовать элемент
nav
. С другой стороны, сквозная навигация по сайту почти наверняка должна содержаться в элементе
nav
.

Довольно часто элемент

nav
появляется внутри элемента
header
. Это вполне осмысленно, если вы вспомните, что элемент
header
может использоваться для «вспомогательной навигационной информации».

article

Для лучшего понимания можно представить, что элементы

header
,
footer
,
nav
и
aside
– это специализированные формы элемента section. Секция – это общий блок связанного содержимого, а шапки, подвалы, навигационные блоки и боковые колонки – блоки особого связанного содержимого.

Элемент

article
– еще один особый вид
section
. Его следует использовать для самостоятельного связанного содержимого. Теперь сложная часть – это решить, что значит «самостоятельный».

Задайте себе вопрос, стали бы вы передавать это содержимое в RSS или Atom-ленте. Если в таком конктексте это содержимое имеет смысл, тогда, скорее всего,

article
– нужный вам элемент. На самом деле элемент article спроектирован специально для агрегирования.

Если внутри

article
вы используете элемент time, можете добавить к нему необязательный булев атрибут
pubdate
, чтобы указать, что он содержит дату публикации:

<article>

<header>

<h1>Отзыв на книгу Скрипты для DOM</h1>

</header>

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

<footer>

Опубликовано в

<time datetime=?2005-10-08T15:13? ачастую темную дорогу в мире JavaScript.

<footer>

Опубликовано в

<time datetime="2005-10-08T15:13" pubdate>

15:13 8 октября 2005 года.

</time>

автор: Гленн Джонс

</footer>

</article>

Если внутри статьи у вас есть несколько элементов

time
, то атрибут
pubdate
может быть только у одного из них.

Элемент

article
особенно хорошо применим для записей в блогах, новостных репортажей, комментариев, оценок, записей на форумах. Он покрывает ровно те же сценарии, что и микроформат
hAtom
.

Но спецификация HTML5 идет дальше. Она также объявляет, что элемент

article
должен использоваться для самостоятельных виджетов: графиков акций, калькуляторов, часов, виджетов погоды и тому подобного. В этом случае элемент
article
пытается закрыть те же сценарии, что Web Slices компании Microsoft [13] .

Мне кажется совершенно непонятным интуитивно, что элемент с названием «статья» должен применяться к концепту, известному как «виджет». Но, опять же, и статьи, и виджеты – самостоятельные, агрегируемые типы содержимого.

13

http://www.ieaddons.com/en/webslices/

Что более проблематично – это то, что

article
и
section
очень во многом похожи. Все, что их разделяет, – слово «самостоятельный». Решить, какой элемент к чему относится, было бы просто при четких и быстрых правилах. В данном же случае все зависит от интерпретации. У вас может быть много статей внутри секции, много секций внутри статьи, можно создавать вложенные секции в секциях и статьи в статьях. Вы решаете, какой элемент больше подходит семантически в той или иной конкретной ситуации.

  • Читать дальше
  • 1
  • ...
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28

Ебукер (ebooker) – онлайн-библиотека на русском языке. Книги доступны онлайн, без утомительной регистрации. Огромный выбор и удобный дизайн, позволяющий читать без проблем. Добавляйте сайт в закладки! Все произведения загружаются пользователями: если считаете, что ваши авторские права нарушены – используйте форму обратной связи.

Полезные ссылки

  • Моя полка

Контакты

  • chitat.ebooker@gmail.com

Подпишитесь на рассылку: