ABCDEFGHIJKLMNOPQRSTUVWXYZ
1
タイトル達成等級配慮すべき主なポイント
2
1知覚可能
3
1.1代替テキスト
4
1.1.1非テキストコンテンツA非テキストコンテンツ(主に画像を想定する)には、そばにその内容を示すテキストを添える、テキストが添えられないときは代替テキスト(alt属性)をつける。
5
1.2時間依存メディア
6
1.2.1音声だけ及び映像だけ(収録済み)A音声は、そばにその内容を書き起こしたテキストを添える。
動画は、そばにその内容を書き起こしたテキスト添えるか、動画の内容を解説する副音声つきの音声を添える。
7
1.2.2キャプション(収録済み)A音声および動画には、字幕をつける。
8
1.2.3音声解説又はメディアに対する代替コンテンツ(収録済み)A動画は、動画の内容を解説する副音声つきの音声を添える。
9
1.2.4キャプション(ライブ)AAリアルタイムで配信される音声および動画には、リアルタイムで字幕をつける。
10
1.2.5音声解説(収録済み)AA動画には、動画の内容を解説する副音声つきの音声を添える。
11
1.3適応可能
12
1.3.1情報及び関係性Aページ全体の実装において、セマンティックにマークアップされたHTMLを用いる。
13
1.3.2意味のある順序Aいくつかのテキストを順々に読まなければ意味が通じないとき、HTML上でもその順でテキストを書く。たとえば、「以下の図は」というテキストがCSSによって見た目上は図の上部に配置されていても、HTMLでは図よりあとに書かれていた場合、スクリーンリーダーは図を先に読み上げ、そのあとで「以下の図は」という読み上げをしてしまう。
14
1.3.3感覚的な特徴A画面のレイアウトやあしらいは、ユーザーや閲覧環境によっては伝わらないことを前提に画面を設計し、実装する。たとえば、「右の図は」と書いてもスクリーンリーダーではそもそも「右」がどちらかわからない。フォームで「赤文字の項目は必須」とあっても色覚多様性のユーザーには赤が認知できない。
15
1.4判別可能
16
1.4.1色の使用A色を使用するとき、色覚多様性に配慮し、色がまったくわからなくても情報が伝わるようにする。たとえば、フォームで「赤文字の項目は必須」とするとともに、それぞれの必須項目にはテキストでも「必須」と添える。
17
1.4.2音声の制御 【非干渉】A音声や動画は自動再生しない。自動再生をすると、音声がスクリーンリーダーの音声と混ざってしまい、スクリーンリーダーの操作ができなくなるため。
18
1.4.3コントラスト(最低限レベル)AAすべての文字(画像内の文字も含む)で、文字色と背景色のコントラスト比は4.5:1以上にする。
ただしロゴ画像は除く。
19
1.4.4テキストのサイズ変更AAテキストの文字サイズの指定はCSSで行い、相対値の単位(em, rem, %)を用いる。
※ただし、ie6のサポート終了により、現行の主要なブラウザのズーム機能で本項目は代替できるようになったため、特別な対応は不要となった。
20
1.4.5文字画像AA画像に文字が含まれているときは、そばにその内容を示すテキストを添える。
21
2操作可能
22
2.1キーボード操作可能
23
2.1.1キーボードAウェブページは、マウスを使わず、キーボードだけですべての操作ができる。
24
2.1.2キーボードトラップなし 【非干渉】Aウェブページの実装によっては、キーボードだけで操作したとき、キーボードフォーカスが特定のエリアに閉じ込められてしまい、操作が続けられなくなることがある。これを「キーボードトラップ」と呼ぶ。「キーボードトラップ」が発生しないことを確認する。
25
2.2十分な時間
26
2.2.1タイミング調整可能A入力に時間制限(タイムアウト)のあるフォームをつくらない。身体多様性のあるユーザーのとき、たとえば呼気スイッチを用いて文字入力しているユーザーはフォームの入力に非常に時間がかかることがある。
セキュリティなどの理由により、やむを得ずタイムアウトを設定する場合は、20時間よりも長い時間にする。
27
2.2.2一時停止,停止及び非表示 【非干渉】A自動的に動き出したり、自動的にスクロールしはじめたり、自動的に更新されるコンテンツをつくらない。
ただしリアルタイムの動画配信のように、自動的に更新されることが前提となるコンテンツは除く。
28
2.3発作の防止
29
2.3.13回のせん(閃)光,又はしきい(閾)値以下 【非干渉】A1秒間に3回を超える閃光を放つコンテンツをつくらない。それ以上の点滅は、光てんかんを招きかねないため。この項目はウェブページを通じてユーザーを物理的に直接に加害する唯一の方法であり、とくに重要である。
30
2.4ナビゲーション可能
31
2.4.1ブロックスキップAページ全体の実装において、セマンティックにマークアップされたHTMLを用いる。グローバルナビゲーションのようなすべてのウェブページに共通しておかれる大量のリンクは、スクリーンリーダーで読んだとき、煩雑な繰り返し情報になるため。かつては「ブロックスキップ」という実装でグローバルナビゲーションをジャンプするリンクを設置していたが、近年のスクリーンリーダーはh要素へジャンプする機能をもっているため、「ブロックスキップ」を設置するより、ウェブページにおいて見出しをh要素で正しくセマンティックに実装するほうが好ましい。
32
2.4.2ページタイトルAウェブページのHTMLには、そのページの内容をあらわしたtitle要素がある。そのウェブサイトのなかで、すべてのウェブページのtitle要素は重複なく一意になっている。
33
2.4.3フォーカス順序Aいくつかのリンクを順々に読まなければ意味が通じないとき、ウェブページをキーボードで操作したとき、フォーカスがあたる順番もその順になるようにする。
34
2.4.4リンクの目的(コンテキスト内)Aリンクテキストに「こちら」といった、それだけを読んでもリンク先に何があるのかわからないテキストを用いない。たとえば、「ボランティアの参加方法はこちら」という文章のうち「こちら」だけをリンクにしていたとする。スクリーンリーダーでリンクだけをジャンプして読み上げる操作をしていた場合、「こちら」というテキストだけが読み上げられ、「ボランティアの参加方法は」の部分は読み上げられないため、ユーザーはこの「こちら」リンクの先に何があるのかわからない。
35
2.4.5複数の手段AAウェブサイトにはサイト内検索やサイトマップを用意し、どのウェブページへもたどり着くための経路が複数あるようにする。ただしフォームの送信完了ページのような、ひと続きの操作の結果表示されるページは除く。
36
2.4.6見出し及びラベルAA見出しやフォームのラベルは、読めばその内容がわかるようにする。たとえば、「ボランティアについて」という見出しは、ボランティアの参加条件や、ボランティアの内容など、含まれ得る情報の幅が広すぎるため、読めばその内容がわかる見出しとは言えない。
37
2.4.7フォーカスの可視化AAキーボードフォーカスが当たったときのインジケーター(枠線)をCSSで消さない。
38
3理解可能
39
3.1読みやすさ
40
3.1.1ページの言語Aウェブページには、そのページの言語をHTML要素のlang属性で記述する。
41
3.1.2一部分の言語AAウェブページの一部に、そのページの主言語とは異なる言語で書かれた文章ががあるとき、lang属性を用いてそれを示す。たとえばフランス語のページに、ドイツ語の文章が引用されているような場合を想定する。
42
3.2予測可能
43
3.2.1フォーカス時Aフォーカスが当たっただけで自動的に動作するコンテンツをつくらない。たとえば、フォーカスが当たっただけで送信されるフォームや、ブラウザの新しいタブが開くというようなことをしない。
44
3.2.2入力時Aドロップダウンやセレクトボックスを切り替えるだけで画面を変化させず、フォームには必ず「送信(実行)」ボタンをつける。
45
3.2.3一貫したナビゲーションAAウェブサイトにはグローバルナビゲーション、ローカルナビゲーションが統一して配置する。
46
3.2.4一貫した識別性AAウェブサイトのなかで、同じ機能をもつ要素は同じ外見やラベルをもつようにする。たとえば、ログインアイコンはウェブサイトのなかで一貫して同じ外見になっている。
47
3.3入力支援
48
3.3.1エラーの特定Aフォームを送信してエラーになったとき、フォームのどのフィールドがエラーになっているのか、そしてエラーの具体的な内容がなんなのか、テキストで表示する。
49
3.3.2ラベル又は説明Aフォームの入力フィールドには、それぞれlabel要素でひもづけられたラベルがある。加えて入力例の記載がある。
50
3.3.3エラー修正の提案AAフォームを送信してエラーになったとき、どのように修正すれば正しい入力になるかを具体的に示す。
ただしパスワードのようにセキュリティのための場合を除く。
51
3.3.4エラー回避(法的,金融及びデータ)AAユーザーにとって法律行為もしくは金融取引が生じるフォームおいては、送信時のエラーチェック画面と、確認画面を用意する。また可能であれば、送信後の取り消しもできるようにする。
52
4堅ろう(牢)(Robust)
53
4.1互換性
54
4.1.1構文解析Aページ全体の実装において、誤りがなく、セマンティックにマークアップされたHTMLを用いる。
55
4.1.2名前(name),役割(role)及び値(value)Aページ全体の実装において、WAI-ARIA(Accessible Rich Internet Applications)の技術を用いるなどして、スクリーンリーダーなど身体多様性に配慮したデバイスで操作できるようにする。
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100