Можете ли вы иметь столько <nav>, сколько вы хотите в документе HTML 5?

Question

Мне нравятся новые теги из стандарта HTML 5.Могу ли я использовать их более одного раза?

Как теги 3 <nav> или два тега <sidebar>, и могу ли я придумать новые теги, такие как <fuu>?

В xhtml у меня было:

<div class="nav-wrap">
 <div class="nav">
   ...
 </div>
</div>

, чтобы я мог сделать что-то вроде:

<nav class="wrap">
  <nav>  <!-- can <nav> have <li>'s ? -->
  ...
  </nav>
</nav>

?

Answer 1

Элемент <nav> определен в спецификации html5 , а элемент <sidebar> - нет. Вы можете использовать столько элементов <nav>, сколько захотите (при условии, что они не являются вложенными), но остальные вам нужно будет предоставить DTD и надеяться, что браузер, который используют ваши пользователи, достаточно гибок, чтобы принять его. новые элементы.

Я бы рекомендовал не определять новые элементы, а просто использовать существующие семантические элементы для создания желаемых эффектов.

<div class="sidebar"></div> достаточно хорош и будет рассматриваться как вторичный контент, если вы оборачиваете свой основной контент в <main>, что эффективно подсказывает браузеру, что регион не является верхним, нижним или нижним содержимым, который на большинстве сайтов соответствует боковой панели.

Однако в большинстве случаев элемент <aside> подходит для использования в качестве боковой панели.

Согласно спецификации:

Элемент aside представляет собой раздел страницы, состоящий из контента, который тангенциально связан с контентом вокруг элемента aside и который можно рассматривать отдельно от этого контента. Такие разделы часто представлены в виде боковых панелей в печатной типографии .

_{Акцент на шахте}

Answer 2

Элемент 'nav' следует использовать везде, где происходит "основная" навигация, обычно это находится в заголовке вашего сайта, но он также может быть в тех местах, где вы позволяете пользователю перемещаться по текущей странице.

Обычно не нужно помещать его в нижний колонтитул (так как обычно это не считается вашей основной навигацией), хотя это не может повредить.

Ответ zzzzBov не совсем корректен, поэтому позвольте мне привести более точный пример.

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

<div class="sidebar"></div>

Это не семантически боковая панель, далеко от нее. Элемент div используется как ловушка для стилизации или JavaScript и не имеет семантического значения, поэтому был введен элемент 'aside', используйте это!

Если вам нужен только обертка для стиля, тогда div отлично подходит (даже предпочтительнее).

Как правило, ваш HTML должен содержать элементы, которые описывают ваш контент. Обычно вы можете прочитать это вслух, и это будет иметь смысл.

Например: «У меня есть список элементов навигации на стороне моей страницы», будет означать:

<aside>
  <nav>
    <h1>Navigation</h1>
    <ul>
      <li><a href="/someplace">Link to someplace</li>
      <li><a href="/someplace-else">Link to someplace else</li>
    </ul>
  </nav>
</aside>

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

Разделы страницы, которые не являются вашим основным содержимым (но могут быть связаны), обычно помещаются в элемент «aside».

Надеюсь, это поможет!

Answer 3

Чаще встречается неупорядоченный список ссылок в вашем nav:

<nav class="wrap">
  <ul>
    <li>...
  </ul>
</nav>

На вашей странице может быть столько элементов nav, сколько вам нужно, но вам не нужно переносить каждую ссылку или набор ссылок в nav - в * 1007 должна быть указана только «основная навигация». * элемент. В этом посте доктора HTML5 .

есть хорошее введение в nav.

Для боковых панелей нет необходимости изобретать свой собственный элемент, используйте для них элемент

aside .

Вы можете изобретать свои собственные элементы и при этом работать с разметкой в ​​браузере, совместимом с HTML5, алгоритм токенизации HTML5 не заботится о том, какие имена тегов вы используете, если они следуют правилам, но тогда вы бы не писали HTML5, так что это бессмысленно. Я рекомендую прочитать в начале спецификации раздел "Требования к соответствию для авторов" , в частности, бит "Случаи, которые могут быть опечатками":

Когда пользователь делает простую опечатку, это полезно, если ошибка может быть обнаружена рано, так как это может спасти автора много времени отладки. это спецификация поэтому обычно считает ошибкой использовать элемент имена, имена атрибутов и т. д., которые не соответствуют именам, определенным в эта спецификация.