img-alt-quality
<img>の代替テキストは適切である必要があります(手動レビュー)
空でない代替テキストを持つ<img>要素を、内容が適切かどうかの人によるレビュー対象として報告します。altがファイル名、URL、プレースホルダー、「image of」のような書き出しに見える場合や、非常に長い場合は、その旨も示します。
適用範囲:alt属性があり、その値が空でない<img>要素に適用されます。要素はアクセシビリティツリーに含まれている必要があり、role属性がpresentation/noneに解決される場合(既知のロールを指す最初のトークンを大文字と小文字を区別せずに照合)は対象外になります。ただし、フォーカス可能であればロールが復元されるため対象に含まれます。altがまったくない<img>はimg-alt-presentの失敗、alt=""の<img>はimg-alt-decorativeのレビュー対象です。
期待される結果:提供されている代替テキストが正確かつ適切であることを、人がレビューして確認する必要があります。説明以外のものに見える代替テキストには、専用の概要とヒントが付きます。ファイル名(または画像自身のファイル名と同じalt)、URL、記号のみ(「★★★★☆」など)、「image」や「TBD」のようなプレースホルダーや汎用的な語、画像であることを述べる書き出し(「image of」「photo of」)、150文字を超えるaltです。それでも検出結果はすべてcantTellです。いずれも文脈によっては正しい場合があるからです。
検出結果が報告する内容:
altSignal:代替テキストが疑わしく見えた理由で、該当する検出結果にのみあります。file-name、url、symbols、placeholder、redundant-prefix、too-longのいずれかです。通常の代替テキストの検出結果にはありません。複数が当てはまる場合は、この順で最初のものが報告されます。length:代替テキストの文字数で、too-longの場合のみです。limit:altが長すぎるとみなされる長さ(150)で、too-longの場合のみです。reasonCode:画像がリンクやボタンの唯一の内容である(テキストもほかの画像もない)ため、そのaltがコントロールの名前になる場合(H30)はIMAGE_ONLY_CONTROL_CONTENTで、controlContentがコントロールのロール(linkまたはbutton)を示します。それ以外はTEXT_ALTERNATIVE_REVIEWです。
これらのdata.detailsのフィールドは、検出結果を読み解き、再現するのに役立ちます。reasonCodeと、出力スキーマで安定と明記された一部のフィールドを除き、安定した契約ではありません。マイナーリリースで名前が変わったり、なくなったりすることがあるため、これらに依存した実装はしないでください。
例
<img src="chart.png" alt="image">
空でないaltはありますが、「image」はグラフが示す内容を説明せず、要素の種類を繰り返しているだけです。検出結果は、altがプレースホルダーまたは汎用的な語であることを示します(data.details.altSignal: "placeholder")。ファイル名、URL、「image of」のような書き出し、150文字を超えるaltの場合も同様です。
<img src="team.jpg" alt="Our support team at the 2025 meetup">
通常の代替テキストには一般的なレビューが行われます。文脈の中で画像をうまく説明しているかどうかは、人にしか判断できません。
<img src="border.png" alt="">
空のaltは画像を装飾としてマークします。それはこのルールではなくimg-alt-decorativeが扱う問題です。
確認方法
このルールが判断できない場合はcantTellを報告し、判断を人に委ねます。ルールが投げかける各質問を、理由コードごとに、答えるための手順とともにここに示します。検出結果にも同じ手順がhowToCheckとして、スキャンの言語で含まれます。出力スキーマを参照してください。
IMAGE_ONLY_CONTROL_CONTENT
- レポートに示されたリンクまたはボタンを見つけてください。画像が唯一のコンテンツであるため、そのaltがコントロールの名前になります。
- 代替テキストを読み、コントロールを操作するかリンク先を確認して、その働きを把握してください。
- altが画像の見た目ではなく、コントロールの働き(「検索」「ホーム」)を伝えているか判断してください。
満たす場合:代替テキストがコントロールの目的またはリンク先を示しています。
満たさない場合:代替テキストがファイル名、アドレス、汎用的な言葉、記号などであり、コントロールの働きを伝えていないため、WCAG 1.1.1を満たしません(H30、F30)。
TEXT_ALTERNATIVE_REVIEW
- レポートに示された画像を見つけ、その代替テキストを読んでください(疑わしいと判断された理由があれば、レポートに示されています)。
- 画像とその文脈を見て、ページにとって重要な何を示しているかを検討してください。
- テキストによる代替が、グラフや図によくあるように画像の名前を示すだけの場合、詳細は別の場所(隣のキャプション、テキスト、表、またはすぐ横のリンク)にあるかもしれません。スクリーンリーダーの利用者が画像からそれを見つけられ、画像が示すすべてを伝えている場合にだけ、それを認めます。
- altが重要な内容を伝えているか、画像の名前を示し残りをその説明が伝えているかを判断してください。ファイル名、ウェブアドレス、「画像」のような一般的な語はどちらにもなりません。
満たす場合:altテキストが、画像が示す利用者に必要な内容を伝えているか、画像の名前を示し、スクリーンリーダーの利用者が画像からたどれる説明が残りを伝えています。
満たさない場合:altテキストも画像からたどれる説明も画像の内容を伝えていない(altがファイル名、アドレス、一般的な語であるなど)ため、WCAG 1.1.1を満たしません(F30)。