Total Validator 没有找到此链接并向我写此警告:
添加跳过导航链接作为页面上的第一个链接。
如何以更好的方式编写此链接?
<html>
<body>
<a href="#skip">Skip to Content</a>
navbar with menu
<div id="skip">
</div>
</body>
</html>
Total Validator 没有找到此链接并向我写此警告:
添加跳过导航链接作为页面上的第一个链接。
如何以更好的方式编写此链接?
<html>
<body>
<a href="#skip">Skip to Content</a>
navbar with menu
<div id="skip">
</div>
</body>
</html>
根据我的测试,它们确实要求文本链接包含单词“skip”,并且href
属性以 a 开头#
,无论此元素是否存在。
使用您提交的代码,它可以与我自己安装的 TotalValidator 一起使用(我并不是说我会使用这个工具)。
有关信息,TotalValidator 网站使用以下代码
<div id="skip"><a href="#content">Skip navigation</a></div>
[...]
<a id="content"></a>
尽管第一条评论说了什么,ID 值“skip”在技术上是好的;它不需要更改为“skiptocontent”。TotalValidator 没有检测到跳过链接的原因可能是别的。该链接指向页面中的某处,并且该“某处”未明确标记为主要内容。您可以使用WAI-ARIA landmarks来做到这一点。
使用如下标记,验证器应该很明显,您的第一个链接是指向主要内容的跳过链接:
<body>
<a href="#skip">Skip to Content</a>
<!-- navigation menu goes here -->
<div role="main" id="skip">
<p>...</p>
</div>
</body>
您还可以使用“语义”元素,例如
<body>
<a href="#skip">Skip to Content</a>
<header><h1>...</h1></header>
<nav><!-- navigation menu goes here --></nav>
<main id="skip"><!--role="main" is redundant on the main element-->
<p>...</p>
</main>
<footer>
</footer>
</body>
有关main (role)的文档,请参阅 WAI-ARIA 规范和有关main 元素的 HTML5.2 规范。