aria-braille-equivalent

aria-braillelabel/aria-brailleroledescriptionには点字以外の対応する指定がある必要があります

automaticWCAG 4.1.2 (A)確度:high重大度:moderaterobust

aria-braillelabelを使う要素が通常のアクセシブルな名前も持ち、aria-brailleroledescriptionを使う要素がaria-roledescriptionも持つことを確認します。

適用範囲:空でないaria-braillelabel属性、または空でないaria-brailleroledescription属性(あるいはその両方)を持つ要素。

期待される結果:ARIA仕様では、aria-braillelabelは要素の通常のアクセシブルな名前を置き換えるものではなく、点字向けにそれを補足するものです。同様にaria-brailleroledescriptionはaria-roledescriptionを補足するものです。そのため要素には次も必要です。

  • aria-braillelabelを宣言している場合は、点字以外の仕組みによる空でないアクセシブルな名前
  • aria-brailleroledescriptionを宣言している場合は、空でないaria-roledescription

どちらかの点字専用属性だけで名前を付けていると、点字以外の支援技術(ほとんどのスクリーンリーダーや音声操作など)にはアクセシブルな名前やロールの説明がまったく伝わりません。FAILではなくCANTTELLとして報告されます。aria-roledescriptionのないaria-brailleroledescriptionはどのユーザーにも届かず、アクセシブルな名前の欠落については、名前が必須のロールに関して名前付けのルールが判定するためです。点字属性に対応する指定がないことは知らせる価値がありますが、それ自体が達成基準の不適合ではありません。

検出結果が報告する内容:

  • attr:対応するものがない点字の属性で、aria-braillelabelまたはaria-brailleroledescriptionです。
  • requires:要素にほかに必要なものです。aria-braillelabelには「an accessible name」(アクセシブルな名前)、aria-brailleroledescriptionにはaria-roledescriptionです。

これらのdata.detailsのフィールドは、検出結果を読み解き、再現するのに役立ちます。reasonCodeと、出力スキーマで安定と明記された一部のフィールドを除き、安定した契約ではありません。マイナーリリースで名前が変わったり、なくなったりすることがあるため、これらに依存した実装はしないでください。

例

pass
<button aria-braillelabel="SAVE">Save changes</button>

点字ラベルは実際のアクセシブルな名前(「Save changes」)を補足しており、点字以外の支援技術にも名前が伝わります。

can't tell
<button aria-braillelabel="SAVE"></button>

名前付けの仕組みがaria-braillelabelしかなく、点字以外の支援技術にはアクセシブルな名前がまったく伝わりません。

確認方法

このルールが判断できない場合はcantTellを報告し、判断を人に委ねます。ルールが投げかける各質問を、理由コードごとに、答えるための手順とともにここに示します。検出結果にも同じ手順がhowToCheckとして、スキャンの言語で含まれます。出力スキーマを参照してください。

BRAILLE_ATTR_WITHOUT_EQUIVALENT

  1. レポートに示された要素を調べ、aria-braillelabelまたはaria-brailleroledescriptionがあるかを控えてください。
  2. aria-braillelabelがある場合は、ブラウザーの開発者ツールでアクセシビリティペインを開き、要素のアクセシブルな名前を読んでください。
  3. 名前が必要なロール(ボタン、リンク、画像、チェックボックスなど)であれば、点字ラベルとは別に名前があることを確認し、音声読み上げのスクリーンリーダーでその名前を聞いて確かめてください。
  4. aria-brailleroledescriptionがある場合はaria-roledescriptionもあるか確認し、ない場合はネイティブのロールが引き続き読み上げられ、ほかの意図がないことを確かめてください。

満たす場合:要素に読み上げられる名前があり(点字のロール説明がある場合はroledescriptionもあり)、またはロールに名前が不要で、失われる情報はありません。

満たさない場合:コントロールまたは画像に点字ラベルしかないため、音声の利用者には名前が伝わらず、WCAG 4.1.2を満たしません。

ソースコードを見る