nav

Элемент nav представляет раздел страницы, который ссылается на другие страницы или части данной страницы: по существу является разделом с навигационными ссылками, или попросту меню.

Не все группы ссылок на странице необходимо помещать в элемент nav — только разделы, которые состоят из блоков основной навигации подходят для использования тега nav. В частности, это относится к нижней части страницы (футер), в котором часто содержится короткий список ссылок на различные страницы сайта, такие как на главную страницу, условия использования, авторские права. Элемент footer достаточен в этом случае, и нет необходимости использовать тег nav.

Агенты пользователя (такие как скринридеры), которые нацелены на предоставление пользователю быстрого доступа к меню или наоборот его пропуска или игнорирования, могут использовать этот тег для определения, какое содержимое страницы следует пропустить при загрузке или наоборот предоставить по запросу.

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

<body>
<header>
<h1>Wake up sheeple!</h1>
<p><a href="news.html">News</a> -
<a href="blog.html">Blog</a> -
<a href="forums.html">Forums</a></p>
<p>Last Modified: <time>2009-04-01</time></p>
<nav>
<h1>Navigation</h1>
<ul>
<li><a href="articles.html">Index of all articles</a></li>
<li><a href="today.html">Things sheeple need to wake up for today</a></li>
<li><a href="successes.html">Sheeple we have managed to wake</a></li>
</ul>
</nav>
</header>
<div>
<article>
<header>
<h1>My Day at the Beach</h1>
</header>
<div>
<p>Today I went to the beach and had a lot of fun.</p>
...more content...
</div>
<footer>
<p>Posted <time pubdate datetime="2009-10-10T14:36-08:00">Thursday</time>.</p>
</footer>
</article>
...more blog posts...
</div>
<footer>
<p>Copyright © 2006 The Example Company</p>
<p><a href="about.html">About</a> -
<a href="policy.html">Privacy Policy</a> -
<a href="contact.html">Contact Us</a></p>
</footer>
</body>

В следующем примере существует два элемента nav: один для основной навигации, другой для дополнительной, зависящей от содержимого текущей страницы.

<body>
<h1>The Wiki Center Of Exampland</h1>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/events">Current Events</a></li>
...more...
</ul>
</nav>
<article>
<header>
<h1>Demos in Exampland</h1>
<p>Written by A. N. Other.</p>
</header>
<nav>
<ul>
<li><a href="#public">Public demonstrations</a></li>
<li><a href="#destroy">Demolitions</a></li>
...more...
</ul>
</nav>
<div>
<section id="public">
<h1>Public demonstrations</h1>
<p>...more...</p>
</section>
<section id="destroy">
<h1>Demolitions</h1>
<p>...more...</p>
</section>
...more...
</div>
<footer>
<p><a href="?edit">Edit</a> | <a href="?delete">Delete</a> | <a href="?Rename">Rename</a></p>
</footer>
</article>
<footer>
<p><small>© copyright 1998 Exampland Emperor</small></p>
</footer>
</body>

На правах рекламы: Антиплагиат АГЗ МЧС