Название в значительной степени объясняет это.
Теперь, когда у нас есть специальный <nav>
тег,
Это:
<nav>
<ul>
<li><a href="#foo">foo</a></li>
<li><a href="#bar">bar</a></li>
<li><a href="#baz">baz</a></li>
</ul>
</nav>
лучше, чем следующее?
<nav>
<a href="#foo">foo</a>
<a href="#bar">bar</a>
<a href="#baz">baz</a>
</nav>
Я имею в виду, если предположить, что мне не нужен дополнительный уровень DOM для некоторого позиционирования / заполнения CSS, какой способ предпочтительнее и почему?
html
html-lists
nav
kikito
источник
источник
Ответы:
элемент nav и список предоставляют различную семантическую информацию:
Элемент nav сообщает, что мы имеем дело с основным блоком навигации.
Список сообщает, что ссылки внутри этого блока навигации образуют список элементов.
На http://w3c.github.io/html/sections.html#the-nav-element вы можете увидеть, что элемент nav также может содержать прозу.
Так что да, наличие списка внутри элемента навигации добавляет смысла.
источник
<nav>
без<ul><li>
него детское меню будет более динамичным. Что делать, если у вас есть несколько списков меню, которые имеют разный тип и расположение в<nav>
? Я бы сгруппировал эти списки меню, как<ul><li>
в<nav>
. Так что, если в вашем меню есть обычные, я бы согласился<ul><li>
.На этом этапе я бы оставил
<ul><li>
элементы, потому что еще не все браузеры поддерживают теги HTML5.Например, я столкнулся с проблемой при использовании
<header>
тега - Chrome и FF работали как шарм, но Opera не справилась.Пока все браузеры полностью не поддерживают HTML, я бы придерживался их, но полагался на старые для обеспечения обратной совместимости.
источник
:)
Это действительно ваше дело. Если вы обычно использовали неупорядоченный список для разметки меню навигации, я бы сказал, продолжайте делать это в элементе <nav>. Смысл элемента <nav> состоит в том, чтобы идентифицировать навигацию по сайту, например, для компьютерного читателя, поэтому неважно, используете ли вы список или просто ссылки.
источник
nav
с экрана s иa
s теперь так же хороши, как и списки.Для меня неупорядоченные списки - это дополнительная разметка, которая на самом деле не требуется. Когда я смотрю HTML-документ, я хочу, чтобы он был максимально чистым и удобным для чтения. Для зрителя уже ясно, что список представлен, если используется правильный отступ. Таким образом, добавление UL к этим тегам a не требуется и затрудняет чтение документа.
Хотя вы можете получить некоторую гибкость, я считаю, что лучше не раздувать разметку несемантическими классами ul и стилизовать элементы a одним махом. И у вас нет оправдания: используйте псевдоселекторы: before и: after.
Изменить : мне известно, что некоторые программы чтения с экрана ARIA обрабатывают списки иначе, чем простые теги привязки. Если ваш веб-сайт ориентирован на людей с ограниченными возможностями, я мог бы рассмотреть возможность использования подхода на основе списков.
источник
Нет, они равноценны. Помните, что HTML 5 обратно совместим со списками HTML 4, поэтому вы можете свободно использовать их в том же отношении. Компромисс - меньше кода для второй версии.
Если вас беспокоит обратная совместимость с браузерами, обязательно включите эту прокладку, чтобы обеспечить функциональность тегов, таких как
<nav>
и<article>
.источник
Если мы говорим «по книге», то нет; вам не нужно использовать списки для разметки навигации. Единственное реальное преимущество, которое они предлагают, - это обеспечение большей гибкости при укладке.
источник
Я бы держать
<ul><li>
тег, потому что новые теги (<nav>
,<section>
,<article>
и так далее) являются только более семантическими версиями<div>
с.По той же причине у вас не было бы просто загрузки ссылок в a
<div>
, они также должны быть структурированы внутри<nav>
тега.источник
По этому вопросу есть действительно подробный пост на CSS Tricks. Очевидно, это горячо обсуждаемый вопрос; у поста более 200 комментариев.
Навигация в списках: быть или не быть (CSS Tricks, январь 2013 г.)
источник