Какие отличия nav от menu в HTML5?

Question

[Анна Бакурова]

Читала много статей уже, но так и не нашла вразумительного ответа. На столе книга за 2012-2013 год по html5 и объяснения что nav используется единожды на страницы, а про menu ни слова. В интернете статьи говорящие что из стандарта убрали уже тот факт что nav можно использовать только один раз, да и разработчики ругаются мол "Бывают ситуации что нет одной главной навигации, они все(или не одна) важные!". Также есть сторонники использования nav и для Previous/next buttons (or pagination). Тут то Я и начала теряться. А как же чёткая семантика, или просто все эти статьи устарели. Есть ли уже чёткий взгляд на эту ситуацию и объяснения когда следует использовать nav а когда menu

Answer 1

[Юрий Лобанов]

В спецификации написано, что nav может быть использован не один раз на странице. Например, навигация по сайту и навигация по странице.
Меню в html5 имеет совершенно другой смысл, никаким образом не связанный с навигацией. Он служит для контейнера команд, т.е. используется также, как в контекстном меню, меню команд.
Для навигации, если хотите использовать один из двух вариантов, следует использовать nav. Для списка команд в каком-нибудь приложении: menu.

Answer 2

[Сергей Протько]

Атрибута role как по мне достаточно для соблюдение семантики. Вроде как поисковики уже умеют его воспринимать и учитывать при разборе документа.

p.s. считаю все эти замуты с nav и menu (его же вроде как нету в HTML5, он был только в XHTML1.1?) глупостью и пустой тратой времени. Как по мне достаточно делать так:

<ul  role="menubar">
    <li><a href="">Link1</a></li>
    <li><a href="">Link2</a></li>
    <li><a href="">Link3</a></li>
</ul>

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

Comments

[Lisonok]

menu убрали, потом решили вернуть в html5

[Юрий Лобанов]

@Lisonok вернули меню в совершенно другом смысле.
@Fesor может я и безнадежно устарел, но я не понимаю этих плясок вокруг новых тегов. nav, footer, header и так далее. Это как с детьми - дай ребенку палку, он будет использовать ее как автомат, как посох, как ружье - как угодно. Дай ребенку игрушечный автомат Калашникова, сначала будет восторг, а потом он поймет, что для игр в волшебников автомат не подходит. И вместо того, чтобы придумывать палки, т.е. универсальные вещи, стараются придумать 10 автоматов, 5 посохов, 7 ружей.

[Сергей Протько]

@iiil ну как, семантика важна, и до появления спеки по атрибуту role + WAI-ARIA только тегами можно было явно задавать смысл.

[Юрий Лобанов]

@Fesor может я не так выражаюсь или чего-то не понимаю. На примере footer, скажем. В чем смысл существования такого контейнера? Кирсанов в своей хоть и старой книге, но до сих пор принципиально актуальной приводит пример с программами для слепых. На самом деле, если представить как воспринимает информацию такая программа, легче разобраться, насколько страница хороша с точки зрения семантики. Вернемся к футеру, что такая информация может дать слушателю? Что это некий подвал элемента или всего сайта. Ок, но что в ней должно быть? Нужно ее исключать из прослушиваемого каждый день или нет? если это футер сайта - то скорее всего да, а если это футер элемента, например, статьи - то там может быть важная информация об авторе и дате, например.
То есть я повторюсь, я не понимаю принципиального значения изобретения таких вот контейнеров.
Возможно я сильно заблуждаюсь.

[Сергей Протько]

@iiil суть в том что можно понять что содержится в элементе из контекста. Скажем если у нас footer внутри article, то понятно что это футер в статье. Ну и да, обычно там содержится какая-то второстепенная информация, типа дата написания, рейтинг, количество просмотров... которые по большому счету не особо нужны слушателю.

Answer 3

[Dima4jin]

советую эту статью css-live.ru/articles/semanticheskaya-navigaciya-pr...

Answer 4

[Lisonok]

menu - используется один раз для основного меню, nav - это дополнительные менюшки
По крайней мере я так привык) А вообще разницы особой нет

Comments

[Анна Бакурова]

main - не существует вроде)

[Lisonok]

Это был menu :) А вообще main еще как существует, вместо div role="main" подойдет