Учитывая ваш пример разметки, вы, похоже, спрашиваете о ссылке в элементе nav
. Если это так, вы не должны использовать элемент заголовка для него, потому что элемент заголовка будет отмечать раздел nav
(это, вероятно, не то, что вы хотите передать, если у вас есть заголовок в nav
, он должен, вероятно, что-то вроде «Навигация»).
В этом случае вам вообще не нужен специальный элемент, просто перечислите ссылки в nav
(в идеале в ul
):
<header>
<nav>
<ul>
<li><a id="logo" href="." rel="home">Company Name</a></li>
<li><a id="linkOne" href="#thingOne"><img src="…" alt="…"></a></li>
<li><a id="linkTwo" href="#thingTwo"><img src="…" alt="…"></a></li>
<li><a id="linkThree" href="#thingThree"><img src="…" alt="…"></a></li>
</ul>
</nav>
</header>
Однако, если вы говорите о имени сайта, которое получает (обычно), отображаемое на баннере / заголовке на каждом сайте на каждой странице, использование h1
имеет смысл, поскольку оно представляет собой сайт, в котором область охвата всех разделов страницы должна быть (например, навигация по всему сайту), и она дает документ наброски метки верхнего уровня (что было бы неуказано иначе). В этом случае он не должен быть частью nav
; его ближайший раздел должен быть body
секционным корнем.
Семантически, не имеет значения, если имя / логотип сайта отображается как изображение или как текст. В случае изображения атрибут alt
предоставляет эквивалентный контент в виде текста.
Итак, для логотипа сайта вы можете:
<body>
<header>
<h1><a href="/" rel="home"><img src="…" alt="ACME Inc."></a></h1>
</header>
</body>
И для имени сайта вы можете имеют:
<body>
<header>
<h1><a href="/" rel="home">ACME Inc.</a></h1>
</header>
</body>
Это будет зависеть от формата изображения.
Например, в PNG это довольно просто: декодируйте первые 32 символа base64 в 24 байтах: убедитесь, что позиции 1-3 состоят из строки ASCII 'PNG ', а затем прочитайте ширину и высоту в позициях 16-19 и 20-23 http://www.libpng.org/pub/png/spec/1.2/PNG-Structure.html