Задать вопрос

Как правильнее верстать навигацию с точки зрения семантики?

Издревле навигационное меню версталось приблизительно так
<ul class="menu">
	<li><a href="#">Пункт меню</a></li>
	<li><a href="#">Еще пункт</a></li>
</ul>

С приходом html5 заметил, что такую конструкцию просто оборачивают в тег nav, например, вот так:
<nav class="menu">
	<ul>
		<li><a href="#">Пункт меню</a></li>
		<li><a href="#">Еще пункт</a></li>
	</ul>
</nav>

Интересует, правильным ли будет (с вашей точки зрения) избежать избыточности и использовать следующий подход:
<nav>
	<a href="#">Пункт меню</a>
	<a href="#">Еще пункт</a>
</nav>
  • Вопрос задан
  • 4904 просмотра
Подписаться 12 Оценить 1 комментарий
Решение пользователя xfenix К ответам на вопрос (4)
@xfenix
Оба варианта легитимны.
Вариант с простыми ссылками можно использовать если вам не понадобится делать вложенность или у вас нет сложных декораций, требующих оборачивающих элементов. И браузеру будет легче, всё таки каждый уровень вложенности DOM - лишний напряг.
Да если и ещё css писать в духе "nav ul li a" то любой лишний элемент с такими селекторами будет убивать вам производительность отрисовки.
Ответ написан
Комментировать