文字情報
Silktide は、ページ上の情報が単語の画像ではなく、実際のテキストで伝えられていることを確認するよう求めます。実際のテキストは、サイズ変更、スタイル変更、翻訳、音声読み上げができますが、画像に埋め込まれた文字にはそれができません。
重要な理由
読み手は、自分のニーズに合わせてテキストを調整します。テキストを拡大したり、色やフォントを変更したり、で読み上げたり、機械翻訳したりします。 文字の画像では、これらすべてができません。拡大するとぼやけ、ユーザーの設定も無視されます。また、文字の画像よりもテキストをはるかに適切にインデックスする検索エンジンにも悪影響を及ぼします。これは、ほとんどの法律が参照する標準の一部である、の要件(達成基準1.4.5)です。
修正方法
このチェックは、各ページを確認するためのプロンプトです。
- 情報を伝える単語を含む画像を探します。バナー、ボタン、見出し、デザインツールから書き出した販促用グラフィックなどが該当します。
- それらをでスタイル設定した実際のテキストとして作り直します。
<!-- 情報が画像の中に閉じ込められている -->
<img src="/images/sale-50-off.png" alt="セール:50%オフ!">
<!-- 修正後:デザインに合わせてスタイル設定した実際のテキスト -->
<div class="promo">セール:50%オフ!</div>
- 文字の画像は、表示が本質的に重要な場合(ロゴやワードマークなど)、または読み手が自分のニーズに合わせて表示をカスタマイズできる場合には許容されます。
- ページに問題がないことを確認したら、その指摘をします。
Silktide のテスト方法
- すべてのページが手動確認の対象になります。画像に単語が含まれているかどうか、またその単語が情報を伝えているかどうかを確実に判断するには、人間の判断が必要です。
トラブルシューティング
類似するAAAチェックとの違い
このチェックは、カスタマイズ可能な文字画像や本質的に重要な文字画像を許容するレベルAAの達成基準(1.4.5)を対象とします。 文字の画像は、装飾目的または本質的に重要な場合にのみ許容する、より厳しいレベルAAAの達成基準(1.4.9)を対象とします。まずはこちらを満たしてください。