Должен ли я использовать nav или ul
я делаю меню навигации, должен ли я использовать <nav>
или <ul>
элемент для этого?
если я использую nav
мне, вероятно, нужно использовать заточку, чтобы она работала в браузерах.
если это так, то в чем преимущество использования nav
на ul
?
EDIT:
Я знаю, что вы можете поставить ul
на nav
мой вопрос в том, почему использовать nav
на всех?
8 ответов
Не путайте с <nav>
и <ul>
. Их можно использовать вместе для навигационного меню.
Nav
- это тег HTML5. Если вы создаете что-то в HTML5 вы можете использовать <nav>
поскольку ограничений нет, но не все браузеры будут отображать это правильно.
<nav>
<ul>
<li><a href="default.asp">Home</a></li>
<li><a href="news.asp">News</a></li>
<li><a href="contact.asp">Contact</a></li>
<li><a href="about.asp">About</a></li>
</ul>
</nav>
Ul
создает неупорядоченный список. Неупорядоченный означает, что элементы в списке не будет в любом конкретный заказ. Вы можете вложить ul
элемент внутри nav
чтобы разместить свои ссылки.
подробнее о тегах HTML и как они работают здесь.
<ul>
<li><a href="default.asp">Home</a></li>
<li><a href="news.asp">News</a></li>
<li><a href="contact.asp">Contact</a></li>
<li><a href="about.asp">About</a></li>
</ul>
это создаст панель навигации, которую вы должны поместить некоторые стили CSS, чтобы выглядеть лучше.
вышеуказанный код будет давать тот же результат. Разница только в том, что nav
сообщает браузеру, что этот элемент предназначен для навигации s.
на nav
элемент семантически более конкретно, поэтому, как правило, лучший выбор. Поисковая система, например, поймет, что ссылки внутри нее представляют собой навигацию, а не простой список ссылок (которые могут быть рекомендованы постами или связанными элементами и т. д.).
зависит от случая, но большую часть времени вы будете использовать оба.
<nav>
<ul>
<li><a href="#">item1</a></li>
<li><a href="#">item2</a></li>
<li><a href="#">item3</a></li>
<li><a href="#">item4</a></li>
<li><a href="#">item5</a></li>
</ul>
</nav>
<!-- Or just links -->
<nav>
<a href="#">Item</a>
<a href="#">Item</a>
<a href="#">Item</a>
</nav>
Как семантически правильно.
nav
является семантическим html5-элементом, который был введен, чтобы указать, что этот код является навигацией вашей страницы. Для "нормальных nonsemantic" поисковых систем нет никакой разницы, если вы используете ul
или nav
. Они без проблем поймут и то и другое. На данный момент использование этих семантических элементов не создает для вас реального преимущества.
будьте осторожны, используя эти html5-элементы ломает IE, поэтому вам нужно "зарегистрировать" их, поэтому IE распознает их как стилизованные элемент HTML.
обычно вы должны использовать список внутри <nav>
во всяком случае, так:
<nav>
<ul>
<li>...</li>
</ul>
</nav>
просто мое мнение, я бы использовал ul
просто по той причине, что IE 6 и 7 все еще имеют значительную долю рынка, и я знаю, что мне не придется прыгать через обручи, чтобы получить ul
на работу. Во всяком случае, сейчас все проще.
Если вы хотите использовать nav
но избегайте любых проблем с браузерами, которые его не поддерживают, самое простое-не применять к нему стиль и обернуть его вокруг div
и стиль, который вместо.
<nav>
<div class="nav">
<ul>
<li><a href="?">List Item Link</a></li>
<li><a href="?">List Item Link</a></li>
<li><a href="?">List Item Link</a></li>
</ul>
</div>
</nav>
для создания меню в html5 можно использовать элементы nav и ul,
- элемент nav сообщает, что мы имеем дело с основным навигационным блоком
- список сообщает, что ссылки внутри этого навигационного блока образуют список элементов
однако вы можете использовать nav и ul в создании меню,
<nav>
<ul>
<li>item 1</li>
<li>item 2</li>
</ul>
</nav>
Это зависит от вас, следует ли выбрать nav или ul