8

我正在编写一个多语言网站，我有以下导航：

 <nav id="language">
    <ul>
      <li><a href="/en/" hreflang="en">en</a></li>
      <li><a href="/de/" hreflang="de">de</a></li>
      <li>fr</li>
    </ul>
    </nav>

我可以改进语义吗？带有微数据或标签属性，例如

4

3 回答 3

10

abbr元素

您应该添加abbr，并给出相应语言的完整语言名称：

<nav id="language">
  <ul>
    <li><a href="/en/" hreflang="en"><abbr lang="en" title="English">en</abbr></a></li>
    <li><a href="/de/" hreflang="de"><abbr lang="de" title="Deutsch">de</abbr></a></li>
    <li><abbr lang="fr" title="Français">fr</abbr></li>
  </ul>
</nav>

title属性为a

您可以添加一个title属性，a其内容如下：“切换到此页面的英文翻译”

往...去nav

你可以给这个nav部分一个标题，比如“这个页面的翻译”（对于英文页面）。

如果您不希望它在页面上可见，请将其隐藏，以便屏幕阅读器用户仍然可以读取它（例如，使用clip方法）。

（如果您提供这样的标题，您可能不再需要该title属性a。）

另外：link元素（在head）

对于机器人，您可以将翻译与页面link中的元素head链接：

<link rel="alternate" href="/de/" hreflang="de" />
<link rel="alternate" href="/en/" hreflang="en" />
于 2013-01-27T15:06:36.253 回答
2

您应该在链接上添加一个langandhreflang属性，并使用IETF 语言标签(bcp47) 作为目标值，参见例如维基百科关于水的文章中的链接到其他语言的相同项目：

<a lang="de" hreflang="de" title="Wasser" href="//de.wikipedia.org/wiki/Wasser">Deutsch</a>

注意：该lang属性不是链接特定的。它指定标签内容的语言（维基百科也将它放在<html>- 标签和<h1>标题标签中。），同时hreflang指定您链接到的页面的语言。

于 2013-01-27T07:29:58.383 回答
2

我认为也许改成en会Change site language to English改善语义。就目前而言，en没有上下文就非常神秘。

于 2013-01-26T21:49:12.737 回答