達成基準 1.1.1 の失敗例 - テキストを表すために、テキストによる代替を提供せずに、テキストのようなものを使用している

達成方法に関する重要な情報

この達成方法 (参考) の使用法と、この達成方法が WCAG 2.1 達成基準 (規定) とどのように関係するのかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用 (対象) のセクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法の存在は、その技術があらゆる状況で WCAG 2.1 を満たすコンテンツを作成するために使用できることを意味するものではない。

適用 (対象)

全てのウェブコンテンツ技術

これは達成基準 1.1.1: 非テキストコンテンツ (失敗例) に関する達成方法である。

解説

この失敗例の目的は、グリフが目的の文字に似ている文字をその目的の文字の代わりに用いるのを回避することである。Unicode の文字セットでは、数十種類の筆記方法にわたる何千もの文字が定義されている。一部の文字のグリフは、視覚的提示では他の文字のグリフに似ているかもしれないが、テキストを音声に変換するツールでは、同じようには処理されない。

例えば、U+0063 と U+03F2 は、どちらも「c」の文字に似ている。しかし、U+0063 が西欧言語のアルファベットであるのに対して、U+03F2 はギリシャ語のアルファベットで、西欧言語では使われないという違いがある。また、U+0033 と U+04E0 は、どちらも数字の「3」に似ている。しかし、U+04E0 は、実際にはキリル文字のアルファベットである。

注記:

この失敗例は、文字実体の使用にも適用される。失敗例を含むグリフ表現のために使用される不正な文字であって、文字が実装されるメカニズムではない。

事例

事例 1: 文字

次の語は、適切なフォントサポートのあるブラウザで見ると、英語の「cook」という単語のように見える。しかし、実際には U+03f2 U+043E U+03BF U+006B という文字列で構成されていて、このうち西欧言語のアルファベットは 1 字しかない。この語は、意味のあるかたちでは処理されず、テキストによる代替は提供されていない。

ϲоοk

事例 2: 文字実体

次の例は、先の例と同様、適切なフォントサポートのあるブラウザで見ると、英語の「cook」という単語のように見える。この場合、これらの文字が、文字実体で実装されているが、やはり単語として意味のあるかたちでは処理されず、テキストによる代替は提供されていない。

ϲоοk

コード例の実際の表示例: "ϲоοk"

検証

手順

  1. テキストを表現するために、文字又は文字実体を用いていることを確認する。
  2. 用いられている文字は、コンテンツの自然言語において表示されるグリフの適切な文字と一致しない場合、見た目が似たグリフが使われている。

期待される結果

  • よく似たグリフが使用され、かつよく似たグリフを使用するテキストの範囲に対してテキストによる代替がない場合、コンテンツは達成基準を満たしていない。