こんにちは。サイボウズの小林です。前回はアクセシビリティとは何か？について解説しました。今回は、ウェブデザインにおけるアクセシビリティを高めるためのポイントを、大きく以下の3つにわけて紹介します。
- 理解しやすく一貫性のある構造をつくる。
- ユーザに多様な選択肢を与える。
- すべてのユーザに同等の体験を提供する。
理解しやすく一貫性のある構造をつくる
アクセシビリティを高めるうえで、まず大切なのは、理解しやすく一貫性のある構造をつくることです。これは一般的なデザインの原則に通じる部分が多く、普段から実践されている方も多いと思います。たとえば、以下のようなデザインは、障がいの有無によらず、あらゆるユーザーにとってページの構造を理解する助けとなるのです。
- わかりやすいページタイトルをつける。
- すべてのページで一貫性のあるレイアウトやナビゲーションを使う。
- すべてのページで使われている文言を統一する。
さらにアクセシビリティを向上させる際に重要な視点は、ページの構造を理解することがより困難なユーザの視点を借りて、デザインを洗練させていくことです。
たとえば全盲のユーザーは、「一見して」画面を確認することができません。このため、音声読みあげソフトを使い、ページの見出しだけを辿って構造を理解したり、リンクやボタンだけを読みあげて、操作する場所を探したりします。そのため以下のようなデザインは、全盲のユーザーがページ構造を把握する際に、それを助けることができます。
- ページの見出しだけを読んで、ページの概要を理解できるようにする。
- リンクやボタンの文言だけを読んで、操作内容を理解できるようにする。（「ここをクリック」など、文言だけを読んで内容が理解できない表現を避ける）
また、ロービジョン（弱視）のユーザーは、画面を拡大するため、画面の一部しか視認することができず、構造の把握に時間がかかることがあります。このため、以下のようなデザインが望まれます。
- 拡大した時に重要な情報が画面に収まるようにする。（横スクロールを発生させない）
- フォーム入力時にエラーが起きたとき、原因となったフォームの近くにエラーを表示する。
ここで大切なことは、紹介したデザインは、全盲のユーザーやロービジョンの方だけでなく、健常者を含め、すべてのユーザーの利便性を向上させることができるという点です。特別なユーザーのために特別な対応をするのではありません。わたしたちは、極端なユーザーの視点を「借りる」ことで、より汎用なデザインを目指すことができるのです。
