大佬教程收集整理的这篇文章主要介绍了html5 – 语言切换器的语义标记，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
这是我现在使用的：
<header>
<div><a href="#content" class="skiplink">Skip to content</a></div>
<h1>
<a href="/">Site Name - the best site</a>
</h1>
</header>
<ul class="langSwitch">
<li class="langPl"><img src="/gfx/pl.png" alt="Polski" /></li>
<li class="langEn"><a rel="nofollow" href="/en" hreflang="en" lang="en" xml:lang="en"><img src="/gfx/en.png" alt="English" /></a></li>
<li class="langDe"><a rel="nofollow" href="/de" hreflang="de" lang="de" xml:lang="de"><img src="/gfx/de.png" alt="Deutsch" /></a></li>
正如您所做的那样,您应该使用相应的目标语言而不是当前语言来提供语言名称.
当你使用img时,你可能会包含国旗.你shouldn’t do that.它们象征着国家,而不是语言.
如果您愿意,可以使用a Language Icon(另请参阅old version).
放置
它应该放在顶部附近,这样文本浏览器和屏幕阅读器浏览器就不必通过外语内容来到达语言切换器了.要知道首先有翻译.
但是我会说它应该放在skiplink之后(特别是如果有很多翻译),因为Skiplink完全有这个工作：跳过我不想为每个页面重复的内容.
使用nav element.你可以给它一个明确的标题(这更像是一个可用性问题),但你没有必要;如果你不提供一个,这个分区元素将在大纲中无标题.
该导航可以但不一定是身体标题的孩子.
在Nav内部使用ul是合适的.
使用rel–alternate and hreflang作为链接,因为它表明这些是翻译的链接：
如果你使用HTML5(不是XHTML5),you could omit the xml:lang attribute(它在HTML5中没有任何效果;只允许“轻松迁移”).
例
<nav> <h1>Translations of this page</h1> <!-- Could be omitted → usability question --> <ul> <li>English</li> <!-- Could be omitted → usability question --> <li><a rel="alternate" href="/pl" hreflang="pl" lang="pl">Polski</a></li> <li><a rel="alternate" href="/de" hreflang="de" lang="de">Deutsch</a></li> </ul> </nav>
以上是大佬教程为你收集整理的html5 – 语言切换器的语义标记全部内容，希望文章能够帮你解决html5 – 语言切换器的语义标记所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。