「第15回宝塚映画祭」トップページのJIS X 8341-3:2010 等級A試験結果2(模範解答)(7.2.4.2から7.4.1.2)

「第15回宝塚映画祭」のサイトのトップページをJIS X 8341-3:2010-等級A達成基準7.2.4.2から7.4.1.2の実装チェックを2014年12月に行いました。

7.2.4.2の実装チェックリスト例

項番	実装方法	適合	適用	試験方法	注記	状況-番号-項目	関連する実装テクニック	検証方法
1	title要素を用いて、コンテンツの内容が分かるページタイトルを提供する	○	○	HC		1	G88 H25	head要素内にコンテンツに関連し、ウェブページを特定できるtitle要素があるか確認する。
7.2.4.2の試験結果
1	総合結果	○	○	HC

7.2.4.3の実装チェックリスト例

項番	実装方法	適合	適用	試験方法	注記	状況-番号-項目	関連する実装テクニック	検証方法
1	ウェブページが順番にナビゲートできて、そのナビゲーション順序が意味又は操作に影響を及ぼす場合、フォーカス可能なコンポーネントは意味及び操作性を保持した順序でフォーカスを受け取るようにする	○	○	HC		1, 2	G59 H4 C27	TABキー又は矢印キーを用いて、フォーカスを受け取る要素を移動し、その順序が意味及び操作性を保持していることを確認する。
2	以下のいずれかを用いて、ウェブページを動的に変化させる 1) 動的なコンテンツをDOMのトリガーとなる要素の直後に挿入する 2) デバイス非依存の方法でカスタム･ダイアログを作成する 3) DOMを用いて、ページ上にある複数のセクションを並び替える	○	-	HC	該当要素なし	3	SCR26 SCR37 SCR27	ウェブページを動的に変化させている場合に、SCR26, SCR37, SCR27のいずれかを満たしていることを確認する。
7.2.4.3の試験結果
1	総合結果	○	○	HC

7.2.4.4の実装チェックリスト例

項番	実装方法	適合	適用	試験方法	注記	状況-番号-項目	関連する実装テクニック	検証方法
1	以下のいずれかを用いて、リンクの目的を特定する 1) a) b)を用いてリンクの目的を説明したリンクのラベルを提供する a) a 要素のリンクの目的を説明するテキストリンクを提供する b) イメージマップの area 要素に代替テキストを提供する 2) リンクのラベルとそれが含まれている文章中のテキストとを組み合わせる 3) リンクのラベルとそれが含まれているリスト項目とを組み合わせる 4) リンクのラベルとそれが含まれている段落とを組み合わせる 5) リンクのラベルとそれが含まれているデータセル及び関連づけられた見出しセルとを組み合わせる 6) リンクのラベルとその直前にある見出し要素とを組み合わせる 7) 入れ子になったリスト項目にあるリンクのラベルとその親のリスト項目とを組み合わせる 8) CSSを用いて、リンクの目的の説明を補足したリンクテキストの一部を非表示にする	○	○	AF		1, 3, 4, 5	G91 H30 H24 G53 H77 H78 H79 H80 H81 C7	それぞれのリンクにTABキー操作などで移動した後に、支援技術で前後を読み上げる操作を行ってリンクの目的が明確になることを確認する。
7.2.4.4の試験結果
1	総合結果	○	○	AF

7.3.1.1の実装チェックリスト例

項番	実装方法	適合	適用	試験方法	注記	状況-番号-項目	関連する実装テクニック	検証方法
1	html要素の言語属性を用いる	×	○	HC	IE9以下ではlang属性が抜ける。	1	H57	H57
7.3.1.1の試験結果
1	総合結果	×	○	HC	不適合箇所あり

7.3.2.1の実装チェックリスト例

項番	実装方法	適合	適用	試験方法	注記	状況-番号-項目	関連する実装テクニック	検証方法
1	状況の変化を生じるトリガーには、"focus" ではなく、"activate" を用いる	○	○	HC		1	G107	G107
7.3.2.1の試験結果
1	総合結果	○	○	HC

7.3.2.2の実装チェックリスト例

項番	実装方法	適合	適用	試験方法	注記	状況-番号-項目	関連する実装テクニック	検証方法
1	状況の変化を開始する際は、実行ボタンを提供する。 状況の変化を開始する実行ボタンを提供できない場合、状況の変化を引き起こすフォームのコントロールが変化する前に、何が起こるのかを説明する	◯	-	HC	該当要素なし	1, 2	G80 H32 H84 G13	状況の変化を開始する際は、submitボタンあるいはselect要素とともに実行を指示するボタンが用いられていることを確認する。 実行ボタンが提供されていない場合は、状況の変化を引き起こすフォームのコントロールが変化する前に、何が起こるのかの説明が提供されていることを確認する。
7.3.2.2の試験結果
1	総合結果	◯	-	HC	該当要素なし

7.3.3.1の実装チェックリスト例

項番	実装方法	適合	適用	試験方法	注記	状況-番号-項目	関連する実装テクニック	検証方法
状況 A： フォームが利用者からの情報が必須である入力フィールドを含む場合：
1	未入力の必須項目を特定するための説明テキストを提供する	○	-	HC	該当要素なし	A-1, 2	G83 SCR18	G83
状況 B： 利用者によって提供される情報が、特別なデータフォーマットか特定の値であることが求められる場合：
1	要求されたフォーマットまたは値でないことを説明するテキストを提供する	○	-	HC	該当要素なし	B-1, 2, 3, 4	G84 G85 SCR18 SCR32	G84 G85
7.3.3.1の試験結果
1	総合結果	○	-	HC	該当要素なし

7.3.3.2の実装チェックリスト例

項番	実装方法	適合	適用	試験方法	注記	状況-番号-項目	関連する実装テクニック	検証方法
1	以下のいずれかを用いて、目的や内容が分かるラベルを提供する データ形式および入力例を提供する フォーム又はテキストフィールド一式の先頭で、必須項目に関する説明文を提供する 入力項目とラベルの関係がよく分かるように配置する 未入力の必須項目を特定するための説明テキストを提供する	○	-	HC	該当要素なし	1	G131 G89 G184 G162 G83	入力箇所を特定し、その目的や内容が分かるラベルが以下のいずれかの方法を用いて提供されていることを確認する。 データ形式および入力例を提供する。 （G89） フォーム又はテキストフィールド一式の先頭で、必須項目に関する説明文を提供する。 （G184） 入力項目とラベルの関係がよく分かるように配置する。 （G162） 未入力の必須項目を特定するための説明テキストを提供する。 （G83）
2-a	label要素を用いて、テキストのラベルとフォーム・コントロールを関連付ける	○	-	HC	該当要素なし	2	H44	H44
2-b	label要素を用いることができないとき、title属性を用いてフォーム・コントロールを特定する	○	-	HC	該当要素なし	4	H65	H65
3	フォームのコントロールがあるグループを形成している場合、fieldset 要素及び legend 要素を用いて、フォーム・コントロールのグループに関する説明を提供する	○	-	HC	該当要素なし	3	H71	H71 (input type="text" の場合でも、グループを形成しているときは、同様に確認する。)
4	ラベルを用いることができない場合、隣接するボタンを用いて、テキスト・フィールドの目的をラベル付けする。 ただし、その他の実装方法が適用できない場合にだけ用いる「最後の手段」であること	○	-	HC	該当要素なし	5	G167	該当するテキストフィールドとボタンが、表示および読み上げ順序の双方で隣接していることを確認する。
7.3.3.2の試験結果
1	総合結果	○	-	HC	該当要素なし

7.4.1.1の実装チェックリスト例

項番	実装方法	適合	適用	試験方法	注記	状況-番号-項目	関連する実装テクニック	検証方法
1	ページをバリデートし、問題がないことを確認する。 ページがバリッドでない場合、少なくとも下記のいずれかを満たすこと 開始タグ及び終了タグが仕様に準じており、属性値のクオーテーションが正しく組になっていること ページがwell-formedであること	○	○	AC	Another HTML-lint 5／W3C Markup Validation Service 37：プロトコル名が省略されている。IE8以下でcssの二度読みが発生するためcssに対しては使うべきではない。 126：「 e 」は「é」にすべき。 新着情報のSVG未対応ブラウザ用「new_icon.png」がNotFound。	1, 2, 3, 4	G134 G192 H88 H74 H75	バリデータを用いて確認する。
7.4.1.1の試験結果
1	総合結果	○	○	AC	Another HTML-lint 5／W3C Markup Validation Service

7.4.1.2の実装チェックリスト例

項番	実装方法	適合	適用	試験方法	注記	状況-番号-項目	関連する実装テクニック	検証方法
1-a	標準的な HTML のコントロールだけを用いる	◯	○	AC	Another HTML-lint 5／W3C Markup Validation Service ※下記は仕様に準じていない（H88）が、ユーザーインターフェース・コンポーネントには影響なし。 meta要素のproperty属性に"og:?"を使用している。 link要素のrel属性に"apple-touch-icon-precomposed"、"profile"、"pingback"、"Shortcut Icon"を使用している。	A-1-1, 2, 3, 4, 5	G108 H91 H44 H64 H65 H88	標準的なHTMLのコンポーネントだけが用いられていることを確認する。また、それらのコンポーネントが仕様に準じて使用されていることを確認する。
1-b	スクリプトやプログラム技術を用いたコンポーネントを用いている場合、WCAG 2.0 または JIS X8341-3:2010 に準拠していることが確認されたものを使う	×	○	AC	VoiceOver／NVDA／PC-Talker7 カルーセルに使用しているコントロールについてVoiceOver／NVDAでの操作に不備あり。 VoiceOver：スクロールボタンでジャンプした際にフォーカスを受け取らない。 NVDA：一度リンク先に遷移した後、戻ると操作不能になる。	C-1, D-1	G135 G10	スクリプトやプログラム技術を用いたコンポーネントを用いている場合、それらのコンポーネントがWCAG 2.0 または JIS X8341-3:2010 に準拠していることを、そのコンポーネントの開発者が試験していることを確認する。また、それらのコンポーネントが、開発者の定めた仕様に準じて使用されていることを確認する。
2	DOM（ドキュメント・オブジェクト・モデル）を用いて、ページにコンテンツを追加する(Scripting)	△	○	AF	※直接コンテンツに影響があるかどうか分からないのですが、document.writeで書かれた部分があります。 http://2014.takarazukaeiga.com/wp-content/plugins/jetpack/modules/sharedaddy/sharing.js?ver=20121205 http://stats.wordpress.com/e-201448.js	A-1-6, B-1	SCR21	SCR21
7.4.1.2の試験結果
1	総合結果	×	○	AF／AC	不適合箇所あり

チェックシート作成者：ウェブアクセシビリティ基盤委員会

This document is licensed under a Creative Commons 表示 - 継承 2.1 日本 License.