WCAG 4.1.2・レベルA

ARIAおよびラベルに使用されているIDは一意でなければなりません

ラベルや説明に使われるidを複数の要素が共有しているため、支援技術が誤ったラベルを読み上げる可能性があります。

このルールがチェックする内容

ARIAおよびラベルに使用されているすべてのid属性の値が一意であることを確認してください.

なぜ重要なのか

ラベルや説明はidで要素を参照しているため、idが重複するとその関連付けが壊れます(WCAG 4.1.2)。

修正方法

  1. 各要素に固有のidを付け、それを参照する属性(for、aria-labelledby、aria-describedby)を更新します。
  2. Shopifyのセクションでは、繰り返し使われるセクションでもidが固有になるよう、idに{{ section.id }}を追加します。

修正の確認方法

  • 再スキャンし、duplicate-idルールが合格することを確認します。

FixReportsが検出する方法

当社のスキャンは、テストする各ページで実際のChromeブラウザを使ってaxe-coreのルールduplicate-id-ariaを実行し、不合格の要素ごとに、そのページ、マークアップ、該当する場合はスクリーンショットを報告します。

自動テストで確認できるのは、この特定の問題が存在することです。ページのそれ以外の部分がアクセシブルかどうかはわかりません。人がページを確認して初めて見つかるバリアもあります。

今すぐウェブサイトをスキャン

見つけて、直して、確かめる。

これはどんな種類のサイトですか?

回答に合わせて、オンラインストアの購入フローなど適切なチェックを選びます。サイト自体の判断材料も確認し、両方を表示します。

これはどんな種類のサイトですか?

無料スキャン。クレジットカードは不要です。