無効な ARIA ロール

Silktide は、ページ上のすべての role 属性を、ARIA 標準で定義されているロールの一覧と照合してチェックします。スペルミスのあるロール、存在しないロール、空のロール、または内部使用向けに予約されたロールはブラウザーによって無視されるため、要素が意図した意味を、それを必要とする人に伝えられません。

<!-- 問題: "buton" は実在するロールではないため、この div は意味を持ちません -->
<div role="buton" tabindex="0">保存</div>

<!-- 修正: 有効なロールを使用する（または、より適切な実際の button 要素を使用する） -->
<button>保存</button>

重要な理由

ロールは、要素が何であるか（ボタン、タブ、ダイアログなど）をに伝えます。ロールが無効な場合、ブラウザーはそのロールを破棄します。そのため、の利用者には、作成者がコントロールとして意図した要素が単なるテキストとして読み上げられ、要素を操作できることに気付く手段がない可能性があります。目の見えるマウス利用者にとってはページが通常どおり表示され、動作するため、テストを行わなければこうしたミスは見過ごされます。

修正方法

実在する ARIA ロールと一致するようにスペルミスを修正します（完全な一覧）。たとえば、role="nav" ではなく role="navigation" とします。
抽象ロール（widget、composite、landmark、section など）を具体的なロールに置き換えます。抽象ロールは標準を整理するためだけに存在し、ページ上で使用してはなりません。
空の role="" 属性を削除します。
適切な意味を持つネイティブの要素（<button>、<nav>、<main> など）がある場合は、それを優先して role 属性を完全に削除します。

Silktide によるチェック方法

role 属性を持つページ上のすべての要素を検出します。
空の role 値を報告します。
role 値内の各単語を、ARIA 1.2 で定義されているロールと照合します。デジタル出版（doc-）およびグラフィックス（graphics-）拡張のロールも受け入れられます。
定義済みのロールと一致しない単語、および抽象ロールを示す単語を報告します。

トラブルシューティング

ロールが複数の単語で構成されています

role 属性には、フォールバックとして複数のロールを指定できます。ブラウザーは、認識できる最初のロールを使用します。Silktide は、リスト内の無効な単語や抽象的な単語をすべて報告するため、フォールバックも整理できます。

検出結果があるはずなのに、このチェックで何も報告されません

ARIA のテストは、ウェブサイトごとに無効にできます。ウェブサイトの詳細設定を確認してください。