HTML5 - <p>и <h1> считаются допустимыми для <nav>? - PullRequest
4 голосов
/ 22 июня 2011

У меня есть боковая панель с последними новостями и случайными постами в блогах и т. Д.

<nav id="sidebar">
  <section id="latest_news">
    <h1>
      Latest News 
    </h1>
    <h2>
      <a href="/path/to/article">News Item 1</a>
    </h2> 
    <p>
      Truncated text from the news item in question
    </p>
    <a href="/news" title="View all news items" class="index">View all news items</a>
  </section>

  <section id="random_blog_post">
    <h1>
      Random Blog Post 
    </h1>
    <h2>
      <a href="/path/to/blog/post">Blog Post 1</a>
    </h2>
    <p>
      Truncated text from the random blog post in question
    </p>
    <a href="/blog" title="View all blog posts" class="index">View all blog posts</a>
  </section>
</nav>

Как вы можете видеть, у меня есть разделы, h1 и абзацы внутри моей навигации.

Мне просто интересно, допускается ли это или считается хорошей практикой.Есть ли лучший, более семантический (или менее) подход к разметке и структурированию такого содержимого боковой панели?

Ответы [ 3 ]

4 голосов
/ 22 июня 2011

Да, похоже, это действительно правильный html5.w3org имеет пример навигации с тегами h1.

3 голосов
/ 22 июня 2011

Да, вы можете сделать это, что также указано в спецификации

Цитаты, конкретно относящиеся к вашему вопросу:

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

и

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

 <nav>
 <h1>Navigation</h1>
 <p>You are on my home page. To the north lies <a href="/blog">my
 blog</a>, from whence the sounds of battle can be heard. To the east
 you can see a large mountain, upon which many <a
 href="/school">school papers</a> are littered. Far up thus mountain
 you can spy a little figure who appears to be me, desperately
 scribbling a <a href="/school/thesis">thesis</a>.</p>
 <p>To the west are several exits. One fun-looking exit is labeled <a
 href="http://games.example.com/">"games"</a>. Another more
 boring-looking exit is labeled <a
 href="http://isp.example.net/">ISP™</a>.</p>
 <p>To the south lies a dark and dank <a href="/about">contacts
 page</a>. Cobwebs cover its disused entrance, and at one point you
 see a rat run quickly out of the page.</p>
</nav>
1 голос
/ 23 июня 2011

На самом деле, вы могли бы даже написать элемент h1 как прямой дочерний элемент элемента nav, чтобы элемент nav был назван в схеме документа.

Я предлагаю это прочтение о важности заголовков и документаконтур: http://dev.w3.org/html5/spec-author-view/headings-and-sections.html#outline

Вы можете проверить схему документа с помощью этого онлайн-инструмента: http://gsnedders.html5.org/outliner/

С уважением.

...