HTML 5的验证错误

Question

我遇到了一系列疯狂的错误。我使用的是Bootstrap代码而没有编辑它。那为什么会出现错误？

  

具有link属性的sizes元素必须具有rel属性，其中包含值icon或值apple-touch-icon。

...

  

元素banner上属性role的值nav不正确。

为了看到同样的事，去吧 https://validator.w3.org/nu并输入：www.iqtests4kids.com /

Answer 1

W3C HTML检查程序（验证程序）的维护者。 rel=apple-touch-icon-precomposed错误是因为我最近更新了检查器以符合HTML spec requirements for sizes：

  

sizes属性与icon链接类型一起使用。不得在link元素上指定该属性，该元素没有指定rel关键字或icon关键字的apple-touch-icon属性。

关于role=banner nav上的错误，这是因为检查程序符合HTML规范中nav must not have any role other than navigation的ARIA要求。

但请注意HTML规范also states the following requirement中的ARIA：

  

Web开发人员不应将ARIA role和aria-*属性设置为与表中定义的隐式ARIA语义匹配的值。

引用的“表格”中的要求表明the implicit semantics of nav are navigation。

因此，如果您将role=navigation与nav一起使用，则检查器会发出警告。

因此，根据HTML要求中的ARIA，nav永远不应该有明确的role。

Answer 2

看起来Validator对以下内容感到满意：

<link rel="apple-touch-icon".....

而不是

<link rel="apple-touch-icon-precomposed"......

对于其他错误，您可以通过将有问题的role="banner"设置更改为"role=navigation"来使Validator满意：

<nav id="main-menu" ..... role="navigation">

要么将其留在并与生成的警告＆＃39;或完全省略该值（最佳解决方案），验证者将很高兴：）