不十分な代替テキスト
画像には、何が表示されているかを伝える説明文を付ける必要があります。Silktide は、説明が存在していても、ファイル名や「画像」という単語のように実質的な価値がないと思われる画像を報告します。
は、画像の代わりになるものです。ファイル名、URL、一般的な単語などのテキストは、何も説明していません。
<!-- 不十分: ファイル名では、読み上げを聞く人に何も伝わらない -->
<img src="chart.png" alt="chart-final-v2.png">
<!-- 説明的: 画像に表示されている内容を伝える -->
<img src="chart.png" alt="2024年から2026年にかけて売上が2倍になったことを示す棒グラフ">
重要な理由
を使用する人は、画像の代わりに代替テキストを聞きます。「IMG アンダースコア 4 3 2 7 ドット J P G」と読み上げられるのは、何もないより悪い状態です。内容を何も伝えないまま、コンテンツを中断してしまうからです。不十分な代替テキストは通常、CMS がファイル名からフィールドを自動入力したことを意味します。そのため、単純な「代替テキストがあるか」というテストには合格しても、本来その画像を必要としている人には役立たないままになります。
検索エンジンも画像を理解するために代替テキストを読み取るため、不十分なテキストでは、画像を検索で見つけてもらう機会を逃してしまいます。
修正方法
- 画像に何が表示されているか、または画像の用途を、自然な語句や文で説明するよう代替テキストを書き直します。電話で誰かにページの内容を説明するつもりで考えてください。
- リンクやボタンになっている画像の場合は、画像そのものではなく、リンク先や実行される操作(「検索」「カートを表示」など)を説明します。
- 純粋にには、
alt=""を設定して、スクリーンリーダーが完全にスキップできるようにします。 - 問題の原因も修正します。多くの CMS は、画像のアップロード時にファイル名から代替テキストを自動入力します。メディアライブラリに実際の説明を入力してください。
- 検出された代替テキストが本当に適切な場合は、検出結果をします。
Silktide によるテスト方法
- ページ上にある、空でない代替テキストを持つすべての画像を探します。代替テキストがない画像や空の代替テキストを持つ画像は、代替テキストがないなどの別のチェックで報告されます。
- 説明が不要な画像(スクリーンリーダーから非表示になっている画像、トラッキングピクセルなどの1ピクセル画像、出典のない画像)はスキップします。
- 情報を伝えていないと思われる代替テキストを検出します。
- ファイル名のように見える(
photo.jpgなど)。 - URL である。
- 人が読める単語のように見えない(
img_4327_final-2など)。 - 「画像」「写真」「ロゴ」「ここをクリック」など、一般的な単語やフレーズである。
- 文字や数字をまったく含まない。
- ファイル名のように見える(
トラブルシューティング
商品コードやブランド名が検出される
コードのような単一のトークンで構成された代替テキストは、このチェックでは機械的に生成されたものに見えることがあります。そのテキストが本当に適切な説明(たとえば、お客様が知っている商品 SKU)である場合は、検出結果を承認してください。あるいは、より適切な方法として、「ZX-200 ドリルの商品写真」のようにフレーズへ展開してください。
埋め込み地図の画像が検出される
埋め込み地図サービスの地図タイルは提供元によって生成されるため、代替テキストを編集できません。Silktide では、このようなサードパーティ画像をチェック対象から除外できます。検出された場合は承認するか、ウェブサイトのサードパーティに関する問題を除外できるかお問い合わせください。