2

次のマークアップでバリデーターからエラーが発生しました。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Bla Bla Bla</title>
</head>
<body>

    <h1 role="banner">Bla Bla Bla</h1>

    <section role="main">
        <h1>Bla Bla Bla</h1>
        <p>Bla Bla Bla</p>
    </section>

    <p role="contentinfo"><small>Bla Bla Bla</small></p>

</body>
</html>


エラーは次のとおりです。エラー:この時点では、要素h1で属性の役割は許可されていません。

それは要素role="banner"になければならないという意味ですか?header

4

1 に答える 1

3

ARIAロールは、任意のHTML要素に割り当てることができます。WAI-ARIAドキュメントから:

3.2.7.1ARIAロール属性

すべてのHTML要素には、ARIAロール属性が指定されている場合があります。


ただし、特定の要素にロールとして指定できるものにはさまざまな制限があります。これは主に、暗黙的なセマンティクスが明示的なセマンティクスで混乱した状態になるのを防ぐためです。

上記にリンクされているW3CHTML5仕様のテーブルを見ると、「暗黙のARIAセマンティクス」の下h1に、hgroup祖先のないが設定されている場合は、またはのいずれかの役割が必要headingであることがわかりますtab

そのため、検証エラーが発生します。

headまた、の強力なネイティブセマンティクスを持つテーブルからもわかります。つまりno role、これも設定できません。に設定する必要がありますpresentationheaderサンプルに要素がないため、それが意味するものかどうかはわかりません。

要素があった場合header、その役割をbanner次のように設定できます。実際、設定できるのはそれだけです(設定した場合)。これは、上記でリンクしたテーブルでもカバーされています。

また、内部に役割を設定してみることもできます。これは、これを修正する最初の試みでした。h1sectionbanner

于 2012-11-15T08:12:04.953 に答える