如果徽标是文本，应使用什么标签作为徽标元素？ [英] What tag should be used for a logo element if the logo is text?
问题描述
我读过< h1> 标签不适用于徽标。但是，如果您的标志是纯文本，您应该使用什么？我觉得< p> 和< span> 也不合适。以下是一个示例：
< header>
< nav>
< a id =logohref =。>
< span>公司名称< / span>
< / a>
< a id =linkOnehref =＃thingOne>
< img src =...>
< / a>
< a id =linkTwohref =＃thingTwo>
< img src =...>
< / a>
< a id =linkThreehref =＃thingThree>
< img src =...>
< / a>
< / nav>
< / header>
谢谢！
考虑到您的标记示例，您似乎会询问 nav 元素中的链接。如果是这样的话，你不应该为它使用标题元素，因为标题元素会标记 nav 部分（这可能不是你想表达的;如果你愿意的话在 nav 中有一个标题，它应该类似于导航）。
在这种情况下，根本不需要特殊元素，只需列出 nav （理想情况下在 ul 中）的链接：
< header>
< nav>
< ul>
< li>< a id =logohref =。 rel =home>公司名称< / a>< / li>
< li>< a id =linkOnehref =＃thingOne>< img src =...alt =...>< / a>< / li>
< li>< a id =linkTwohref =＃thingTwo>< img src =...alt =...>< / a>< / li>
< li>< a id =linkThreehref =＃thingThree>< img src =...alt =...>< / a>< / li>
< / ul>
< / nav>
< / header>
但是，如果您谈论站点名称（通常）显示在站点范围的横幅/ header在每个页面上使用 h1 是合理的，因为它表示网站，在该范围内页面的所有部分应该是（例如，站点范围的导航） ，并且它给文档大纲提供了一个顶层标签（否则将不予指定）。在这种情况下，它不能是 nav 的一部分;其最接近的部分应该是 body 切片根。
从语义上讲，如果网站名称/徽标没有区别显示为图像或文本。在图片的情况下， alt 属性提供了与文本等效的内容。 因此，对于网站徽标，您可能有：
< body>
< header>
< h1>< a href =/ =home>< img src =...alt =ACME Inc。>< / a>< / h1>
< / header>
< / body>
而对于一个网站名称，您可能有：
<身体GT;
< header>
< h1>< a href =/ =home> ACME Inc.< / a>< / h1>
< / header>
< / body>
I have read that an <h1> tag is inappropriate for a logo. But if your logo is plain text, what should you use? I feel like <p> and <span> are also unsuitable. Here's a sample:
<header>
<nav>
<a id="logo" href=".">
<span>Company Name</span>
</a>
<a id="linkOne" href="#thingOne">
<img src="…">
</a>
<a id="linkTwo" href="#thingTwo">
<img src="…">
</a>
<a id="linkThree" href="#thingThree">
<img src="…">
</a>
</nav>
</header>
Thanks!
Given your markup example, you seem to ask about a link in the nav element. If that’s the case, you should not use a heading element for it, because the heading element would label the nav section (that’s probably not what you want to convey; if you would have a heading in nav, it should probably be something like "Navigation").
In that case, you wouldn’t need a special element at all, just list the links in nav (ideally within a 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>
However, if you talk about the site name that gets (typically) shown in the site-wide banner/header on each page, using a h1 makes sense, because it represents the site, in which scope all of the page’s sections should be (e.g., the site-wide navigation), and it gives the document outline a top-level label (which would be unspecified otherwise). In that case it must not be part of the nav; its nearest section should be the body sectioning root.
Semantically, it makes no difference if the site name/logo is shown as image or as text. In case of an image, the alt attribute provides equivalent content as text.
So for a site logo you might have:
<body>
<header>
<h1><a href="/" rel="home"><img src="…" alt="ACME Inc."></a></h1>
</header>
</body>
And for a site name you might have:
<body>
<header>
<h1><a href="/" rel="home">ACME Inc.</a></h1>
</header>
</body>
这篇关于如果徽标是文本，应使用什么标签作为徽标元素？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
