こんにちは、freeeのアクセシビリティーおじさん、中根です。 アクセシビリティー・ガイドラインのチェックリスト関連でGoogle Apps Scriptを活用するようになったのをきっかけに、最近はGASおじさんっぽくなっています。
さて、今回もfreeeアクセシビリティー・ガイドラインの更新情報をお届けします。
テキストの拡大表示関連をあれこれ見直し
9月29日に公開したVer. 202009.0では、 テキストの拡大表示に関連するガイドライン、チェック内容、参考情報について、意図が明確になるように見直しを行っています。
これまで、拡大表示関連では以下の2つのガイドラインがありました：
- 200パーセントの拡大表示：
[MUST] コンテンツや機能を損なうことなくブラウザーのズーム機能で200パーセントまで拡大できるようにする。- 400パーセントの拡大表示：
[SHOULD] 4倍に拡大表示したときでも、縦スクロールを前提としたコンテンツては横スクロールが、横スクロールを前提としたコンテンツでは縦スクロールが必要にならないようにする。
これらについて、具体的にどういうことなのか、何をするべきなのか、という疑問が寄せられました。 「拡大表示をして使えるようにする」という意図は明らかなのですが、たしかにどういう問題を回避するためのものなのか、どうもこれだけではピンとこない感じもします。 そこで、より分かりやすくなるように、これらのガイドラインを見直してみることになりました。
200パーセントの拡大表示
まず、200パーセントの拡大表示に関するガイドラインについてです。
WCAGや関連文書をよく読むと、だいたい以下のようなことを読み取ることができます。（と言いつつ、WCAGをそれなりに読み込んでいる僕も、相変わらずの難解さに絶対的な自信を持てないのですが。）
- 何らかの方法で200パーセントの拡大表示ができて、その際コンテンツの利用を困難にするような表示崩れが起こらないようにする
- 最近のブラウザーなら、ブラウザーのズーム機能で200パーセント表示が問題なくできれば良い
- 古いブラウザーにはズーム機能がないものもあり、文字サイズの変更機能を用いて拡大表示をする場合があり、この場合、仮に適切に拡大表示がされなくても、最低限コンテンツの利用を困難にするような表示崩れが起こらないようにする
- 文字サイズ変更機能を用いて拡大した場合に、適切に拡大表示されるとなお良い
これらのポイントを反映する形で、200パーセント拡大表示については以下の3つのガイドラインに再編しました。
- ズーム機能を用いた200パーセントの拡大表示：[MUST] コンテンツや機能を損なうことなく、ブラウザーのズーム機能で200パーセントまで拡大できるようにする。
- 文字サイズ変更機能の使用：[MUST] コンテンツや機能を損なうことなく、ブラウザーの文字サイズ変更機能で200パーセントの拡大表示をする設定ができるようにする。
- 文字サイズ変更機能による200パーセントの拡大表示：[SHOULD] ブラウザーの文字サイズ変更機能で200パーセントの拡大表示をできるようにする。
そして、これらのガイドラインを満たしているかどうかのチェック内容についても見直しました。
上記1に対応する形で、チェックID 0321の文言を変更しました。
- 0321：[プロダクト] ブラウザーのズーム機能で200パーセントまで拡大しても、テキストの理解を妨げるようなレイアウト崩れが起こらない。
上記2に対応するチェック内容として、チェックID 0311と0323を追加しました。
- 0311：[コード] 文字サイズの指定において、絶対値指定（例：px）と相対値指定（例：rem）が混在していない。
- 0323：[プロダクト] ブラウザーの文字サイズ変更機能で200パーセントの拡大表示をする設定をしても、テキストの理解を妨げるようなレイアウト崩れが起こらない。
そして上記3に対応するチェック内容として、チェックID 0324を追加しました。
- 0324：[プロダクト] ブラウザーの文字サイズ変更機能で200パーセントまで拡大することができ、その際テキストの理解を妨げるようなレイアウト崩れが起こらない。
400パーセントの拡大表示
こちらについては比較的意図が分かりやすく（と僕は思っている）、400パーセントの拡大表示をした際に、縦横両方のスクロールをしないと読めないようなコンテンツを作らないという意図です。 ただ、これまでのガイドラインの文言では分かりづらい感じもありましたので、以下のように変更しました。
- 400パーセントの拡大表示：[SHOULD] 400パーセントの拡大表示をしたときでも、横書きのコンテンツのように縦スクロールを前提としたコンテンツては横スクロールが、縦書きのコンテンツのように横スクロールを前提としたコンテンツでは縦スクロールが必要にならないようにする。
また、対応するチェックID 0322についても、以下のように変更しました。
- 0322：[プロダクト] 1280x1024のサイズのウィンドウにおいて400パーセントの拡大表示をしたときに適切にリフローされ
- 縦書きのコンテンツでは縦スクロールが、横書きのコンテンツでは横スクロールが発声しない、かつ
- 読み取れない内容や利用できない機能がない
参考情報も更新
そしてこれらのガイドラインやチェック内容を補足する目的で、参考情報にも情報を追加しました。
これらのガイドラインの意図の説明に加えて、以下のような情報を追加しています。
- ブラウザーのウィンドウ・サイズを1280x1024にする方法
- ブラウザーのズーム機能と文字サイズ変更機能の使い方
これらの変更や情報の追加で、拡大表示に関するガイドラインが少しは分かりやすいものにできたのではないかと思います。
その他の変更
これらの他に、以下のような参考情報の更新もしています。
- 色を用いた表現に関する注意点にカラー・ユニバーサル・デザインに関する記述を追加
- スクリーン・リーダーを用いたチェックの実施方法にNVDAのスピーチビューアーに関する説明を追加
引き続きご意見などお待ちしています
今回の変更についても、それ以外の部分についても、ご意見やお気付きの点など、GitHubリポジトリーのIssuesやPull Requestsでお知らせください。
