as_test

テスト ID

WAIC-TEST-0012-02

テストのタイトル

チェックボックスとラベル (label 要素)

テストの目的

label 要素に指定したラベルとチェックボックスが関連付いているかの確認

テストの対象となる達成基準 (複数)

1.1.1, 1.3.1, 3.3.2, 4.1.2

関連する達成方法 (複数)

H44

テストコード (テストファイルへのリンク)

WAIC-CODE-0012-02

テストコードのソース (抜粋)

<div>
<p>物件の詳細情報や写真をご覧になる場合は、各物件のチェックボックスにチェックを入れて「詳細情報を見る」ボタンをクリックしてください</p>
<div>
<label for="yamadasou">山田荘</label>
<ul>
<li>最寄り駅：○○駅　徒歩5分</li>
<li>間取り：2DK(45平方メートル）</li>
<li>築年数：23年</li>
</ul>
1. <input type="checkbox" id="yamadasou" name="bukken">
</div>
<div>
2. <label><input type="checkbox" id="tanakaapart" name="bukken">田中アパート</label>
</div>
<div>
3. <label>佐藤マンション<input type="checkbox" id="satomansyon" name="bukken"></label> 定期借家
</div>
</div>

テスト手順 (視覚閲覧環境)

テストファイルを操作し、結果を確認

期待される結果 (視覚閲覧環境)

次の 1. 〜 4. をすべて満たしている

1. ラベル “山田荘” をクリックすると、“1.” のチェックボックスにフォーカスが移動する
2. ラベル “田中アパート” をクリックすると、“2.” のチェックボックスにフォーカスが移動する
3. ラベル “佐藤マンション” をクリックすると、“3.” のチェックボックスにフォーカスが移動する
4. “定期借家” をクリックしても “3.” のチェックボックスにフォーカスが移動しない

テスト実施時の注意点 (視覚閲覧環境)

なし

テスト手順 (音声閲覧環境)

テストファイルを操作し、結果を確認

期待される結果 (音声閲覧環境)

次の 1. 〜 2. をすべて満たしている

1. それぞれのチェックボックスにフォーカスを移動すると、次のように関連付けられたラベルを知るための何らかの手段が提供されている
   • “1.” のチェックボックス : ラベル “山田荘”
   • “2.” のチェックボックス : ラベル “田中アパート”
   • “3.” のチェックボックス : ラベル “佐藤マンション”
   • “1.” のチェックボックス : ラベル “山田荘”
   • “2.” のチェックボックス : ラベル “田中アパート”
   • “3.” のチェックボックス : ラベル “佐藤マンション”
2. “3.” のチェックボックスにフォーカスを移動すると、 “定期借家” は読み上げられない

テスト実施時の注意点 (音声閲覧環境)

2. では、チェックボックスとラベルの位置関係による関連付けではなく、label 要素 (内のテキストのみ) による関連付けかどうかを確認している

関連する要素や属性

type=”checkbox” を持つ input 要素 , label 要素