装飾用画像

Silktide は、空の代替テキストによって装飾用としてマークされた画像を検出します。これにより、がスキップしても本当に問題ないことを確認できます。装飾用としてマークされた画像は、スクリーンリーダーを使用する人には表示されません。

<!-- この画像は支援技術によってスキップされます。
     それでよいでしょうか。それとも情報を伝えていますか？ -->
<img src="chart.png" alt="">

重要な理由

空の alt="" は、に画像を完全に無視するよう指示します。これは、――美的な目的だけで使用され、情報も機能も持たない画像――にはまったく正しい設定です。しかし、グラフや意味を持つ写真、ボタンとして使用される画像に同じ空の属性が設定されていると、画像を見られない人にはその内容が気付かれないまま失われます。一方、目の見える訪問者には何も問題がないように見えます。

空の代替テキストは、テンプレートやコンテンツ管理システムでよく使われる既定値でもあります。そのため、意味のある画像が意図的にではなく、誤って装飾用としてマークされてしまいます。

修正方法

このチェックでは、問題が確定していると報告するのではなく、各画像を確認するよう求めます。画像ごとに、次の手順を行います。

画像が本当に装飾用である場合は、変更する必要はありません。検出結果をしてください。
画像が情報を伝えている、またはコントロールとして機能している場合は、CMS またはコードで空の属性を説明的なに置き換えてください。
画像の意味が隣接するテキストで完全に繰り返されている場合――同じ単語の隣にあるアイコンなど――その画像は正しく装飾用とされているため、空の alt="" を維持してください。

Silktide によるテスト方法

各ページで、明示的に空の alt="" 属性が設定されているすべての画像を検出します。
いずれにせよ支援技術が読み上げない画像を除外します。これには、ソースがない画像、1 ピクセル以下の画像、スクリーンリーダーから隠されている画像が含まれます。
明示的な role="presentation" 属性が設定されている画像を除外します。テンプレートの既定値であることが多い空の alt とは異なり、presentation ロールはほとんどの場合、意図的に選択されています。
埋め込み地図タイルなど、既知のサードパーティサービスからの画像を除外します。
残った各画像を、文脈を把握できるよう周囲のテキストとともに一覧表示します。画像が本当に装飾用かどうかを確認してください。

alt 属性がまったくない画像は、代わりに代替テキストの不足で報告されます。

トラブルシューティング

問題ない可能性のある画像を確認する理由

画像が装飾用かどうかは、何が描かれているか、またページ上でどのような役割を果たしているかによって決まります。これは自動テストでは判断できません。Silktide は判断材料を提示します。あなたが一度判断すれば、承認した画像は承認済みのままになります。