WCAG 2.0 達成方法集

Skip to Content (Press Enter)

-

F86: 達成基準 4.1.2 の失敗例 - 例えば電話番号にように、複数に分けられたテキストフィールドのそれぞれに対して、識別名が提供されていない

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

これらの達成方法(参考)の使用法及び、それらがWCAG 2.0 達成基準(規定)とどのように関係するかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用(対象)セクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法があるからといって、WCAG 2.0 を満たすコンテンツを作成する際に、常にその技術が使用可能であるわけではない。

適用(対象)

全般

これは、次の達成基準に関連する失敗例である:

解説

これは、複数のテキストフィールドから成るフォームの入力項目で、その一部又は全部に識別名がないことによる達成基準 4.1.2 の不適合事例について述べている。多くの場合、複数のテキストフィールドから成るフォームの入力項目の全体に対してラベルが 1 つあり、そのラベルが最初のテキストフィールドに対してプログラム的に関連付けられているか、又はどのテキストフィールドに対してもプログラム的に関連付けられていない必要がある。

注記: 識別名は、必ずしも視覚的に表示しなければならないわけではないが、支援技術に対しては明示されている必要がある。

事例

失敗例 1

米国の電話番号は、3 桁の市外局番、3 桁の市内局番、それに続く 4 桁の番号で構成されている。通常はこれが、例えば(206)555-1212のように、(市外局番)市内局番-番号というフォーマットで示される。多くの場合、電話番号の記入を求めるフォームは 3 つのテキストフィールドに分かれているが、次の例ではラベルが1つしかない。


電話番号: 
(<input type="text" size="3">) <input type="text" size="3">-<input type="text" size="4">

この不適合となる事例は、アクセシビリティ API に 3 つのテキストフィールドそれぞれに対する識別名(name)がない場合に生じる。支援技術を使っている利用者は、3 つの不明確なテキストフィールドを提示されることになる。また、3 つのテキストフィールドから成る米国の電話番号の場合、一部の支援技術は、1 つ目のフィールドを「(」、2 つ目のフィールドを「)」、3 つ目のフィールドを「-」とラベル付けすることがあり、これも決して利用者の役に立つものではない。

失敗例 2

同じく米国の電話番号で、この事例では、ラベルがプログラム的にどの部分にも関連付けられていない。


電話番号:
(<input type="text" size="3">) <input type="text" size="3">-<input type="text" size="4">

支援技術を使っている利用者は、3 つの不明確なテキストフィールドを提示されることになる。

失敗例 3

同じく米国の電話番号で、この例では、ラベルが1つめのテキストフィールドにプログラム的に関連付けられている。


<label for="area">電話番号:</label> 
(<input id="area" type="text" size="3">) <input type="text" size="3">-<input type="text" size="4">

支援技術を使っている利用者は、1 つめのテキストフィールドが電話番号全体のためのテキストフィールドであると理解し、2 つめと3 つめは不明確なテキストフィールドとして認識することになる。

参考リソース

この参考リソースは、あくまでも情報提供のみが目的であり、推薦などを意味するものではない。

検証

チェックポイント

マルチパートフォームフィールドにある各サブフィールド:

  1. プログラム上そのフィールドに割り振られた名前(name)があることを確認する。

判定基準