本人の情報を入力する欄の目的を、ソフトにも伝える。

05条件と補足

対象となる入力欄

この基準は利用者本人についての情報を集め、次の両方に当てはまる入力欄を対象にします。

• WCAG本体の「ユーザインタフェース コンポーネントの入力目的」の一覧にある目的に当てはまる。
• 想定される入力の意味を特定できる技術で作られている。

本人の氏名、住所、電話番号などが例です。他の人についての情報を入力する欄や、商品を探す検索欄などへ、一律にこの要件を広げません。HTMLではinput要素に加え、入力を受け付けるtextareaやselectなども対象になり得ます。

HTMLで目的を指定する方法

HTMLでは、目的に合うautocompleteの値を使う方法が公式テクニックH98にあります。次の表はその値の一部です。すべての入力目的は参照資料にある公式の一覧で確認できます。

規定の値と欄の目的を対応させます。生年月日の値を独自にbirthdayと書くなど、仕様にない値では伝わりません。autocomplete="on"だけでは氏名や生年月日といった具体的な目的を指定できません。

type="email"はメールアドレスを受け付ける種類の欄だと伝えますが、本人のメールアドレスを求める目的までは示しません。この例ではtype="email"に加えてautocomplete="email"を指定します。

ユーザー名とメールアドレスを兼ねる欄のように、1つの欄が2つの目的を受け付け、技術上複数の目的を指定できない場合もあります。公式解説では、この場合はどちらかの目的を指定するか、目的の指定を省略することを認めています。

自動入力の動作と要件の違い

この基準では、ソフトが入力目的を取得できるかを確認します。自動入力が実行されなくても、目的の指定を確認できます。逆に、ブラウザーが項目名などから推測して自動入力できても、それだけでこの基準を満たすとは判断できません。

3.3.2「ラベル又は説明」は、利用者に入力内容を伝える項目名や説明を扱います。1.3.5では、本人の情報に関する入力目的をソフトが取得できるかも確かめます。autocompleteを付けても、画面の項目名や説明は引き続き必要です。

この改善例は示した2つの入力欄の目的についての例です。ページやサイト全体のWCAG適合を示すものではありません。