Назначение семантических тегов HTML5

Рейтинг: 2Ответов: 1Опубликовано: 04.10.2014

Здравствуйте.

Подскажите, как будет правильнее:

У меня и в "header" есть основная навигация по сайту, ок, я её в "nav" обверну, как и рекомендуют.

Возьмем типичный магазин.

  1. Вот сайдбар на сайте, например, как у ozon.ru, у меня там ссылки на категории товаров, их будет верно тоже в nav обвернуть (ведь почти главная навигация)? Или нет, как лучше поступить?

  2. Внутри "aside" может быть несколько "section" и могут ли они там быть (могут == правильно)? Например, секция выбора параметров товара, секция рекламы популярных товаров, секция поиска в сайдбаре?

  3. И еще вопрос: как же использовать "section", в него помещать "article" или наоборот?

  4. Например, тот же магазин: есть "section", а внутри его куча "article", которые за один товар отвечают, все верно?

  5. Сколько "section" на странице допускается и как на них делить? Все, что нельзя по смыслу запихнуть в "header", "nav", "footer", по смыслу делить на "section", а внутри каждой "section" еще на "article", и все это в один единственный "main". Или как-то по-другому будет более компетентно?

Заранее благодарен за ответ!

html html5 вёрстка
Источник: Stack Overflow на русском

Ответы

▲ 2

Официально

section — «документ или раздел приложения». Обычно содержит верхний (header) и нижний (footer) колонтитулы. Это несколько схожих по смыслу статей, подраздел одной большой статьи, главная часть страницы (например, раздел новостей) или страница интерфейса с закладками.

article — «независимая часть документа или сайта». Эта часть должна иметь смысл вне зависимости от остального содержания. Например, это может быть статья в блоге или форуме, комментарий. Так же как и section внутри этого тега могут размещать верхний и нижний колонтитулы.

nav - используется для идентификации блока ссылок. Например, screen reader'ы (программы для слабовидящих и т.д.) используют данный тэг для идентификации списка линков.

Не формально

Про меню: как Вам удобнее, можете и в div обернуть меню, плохо не будет. Главное, чтобы отображалось правильно на всех браузерах. Часто вижу меню из маркированного списка.

Про section: лучше один section, как и говорится в мануалах, и каждый элемент можно упаковать в article. Правда, если речь о товарах, то тут спорный вопрос, можно и в div или вообще модифицированный css'ом маркированный список, повлияет только на читаемость html кода Вами.

Я как понял, Вы беспокоитесь о индексации: здесь важнее, чтобы все страницы были перелинкованы и стояли все alt, title и правильные заголовки и т.д. (про это вы отдельно задайте вопрос).