HTML 5 Страница без основного <header>?
Разве это плохо? <header>
?
У меня есть эта базовая структура, но я думаю об обертывании заголовка вокруг всего между началом тела и содержимым, потому что к заголовку также прикреплена эта хорошая разметка shema.org. Отличная идея?
Просто потому, что иногда заголовка нет, но навигационные панели на самом деле содержат название бренда и являются своего рода заголовками.
если я делаю это, как я должен разметки <header>
прямо сейчас? Раздел внутри заголовка не действителен, верно? Просто нормальный <div>
Похоже.
<body>
<div class="nav1"><h1>brandname</h1><nav>...</nav></div>
<header><h1>brandname</h1><p>slogan</p></header> <!-- sometimes this is not there -->
<div class="nav2"><h1>brandname</h1><nav>...</nav></div>
<div>content ...
К этому
<body>
<header itemtype="http://schema.org/WPHeader" ...>
<div class="nav1"><h1>brandname</h1><nav>...</nav></div>
<div><h1>brandname</h1><p>slogan</p></div> <!-- sometimes this is not there -->
<div class="nav2"><h1>brandname</h1><nav>...</nav></div>
</header>
<div>content ...
Несколько заголовков также недействительны или? Я думаю об этом, как использование <header>
без каких-либо стилей CSS только для семантической разметки. Я мог бы подумать о стилях барьеров, созданных с этим, поэтому не на 100% удовлетворен этим.
Или это действительно.
<body>
<header class="nav1"><h1>brandname</h1><nav>...</nav></header>
<header><h1>brandname</h1><p>slogan</p></header> <!-- sometimes this is not there -->
<header class="nav2"><h1>brandname</h1><nav>...</nav></header>
<div>content ...
// просто читаем html5: используя заголовок или тег нижнего колонтитула дважды? это выглядит так, как будто я придерживаюсь второго решения, поскольку мне не очень нравится идея вообще не иметь заголовка
Не бойтесь отвечать;)
1 ответ
Определите для каждого корневого элемента секционирования (например, body
) и каждый элемент содержимого секционирования (например, article
) если он содержит контент, который подходит для header
, Спецификация определяет, что это "вводный контент", и приводит следующие примеры:
- вводные или навигационные пособия
- заголовок
h1
-h6
элемент) (не требуется) - оглавление, форма поиска или любые соответствующие логотипы
Если есть такой контент, используйте header
элемент. Если содержимое этого корневого элемента / элемента содержимого разбросано, используйте несколько header
элементы.
Имейте в виду, что header
всегда применяется для "своего ближайшего предка, секционирующего контент или секционирующего корневого элемента":
<body>
<header> <!-- this header is for the whole page --> </header>
<article>
<header> <!-- this header is for the whole article element --> </header>
<div>
<header> <!-- this header is also for the whole article element (and not only for the div element!) --></header>
</div>
<section>
<header> <!-- this header is for this article’s section element only --> </header>
</section>
</article>
<figure>
<header> <!-- this header is for the figure element only --> </header>
</figure>
<strong>
<header> <!-- but this header is also for the whole page (and not for the strong element only!) --> </header>
</strong>
</body>