Web Technorogies

Accessibility について

さて Webページのアクセシビリティを向上するためのチェックポイントとテストの仕方を挙げてみましょう。

ブラウザのウィンドウサイズを変更しても見やすいですか?

当然のことですが、あなたが Web ページをデザインしたときのウィンドウサイズでユーザーが見ているとは限りません。色々なサイズ(極端に小さい状態から、フル画面でタイトルバーもツールバーも消した状態まで)でテストしてみましょう。
IEの場合は[F11]キーを押して、上部に表示されるツールバーを右クリックし、[自動的に隠す(H)]を選択すると完全なフル画面表示をテストできます。

スクロールしないと見れない領域が多くないですか?

長時間モニター上で文章を読む場合、スクロール量が多いページよりスクロールなしでワンクリックでページを移動していく方が疲労が少なくなります。Mic's Studioでは、例えばコラムページや、自己紹介ページではクライアントサイドスクリプトを使用してなるべくスクロールしないで見れるよう作っています。(ただし IE4以上)また、このコーナーの場合はスクロール量があまり多くならないように1ページあたりの文章を適当な長さで抑えるようにしています。

モノクロ画面でも見やすいですか?

全てのユーザーの環境がカラー表示できるとは限りません。また、ある人は色を認識できないかもしれません。背景色と文字の色の彩度が近い場合、モノクロではほとんど字が読めなくなってしまうことに注意してください。
モノクロのテストを行う最も簡単な方法は、ペイントソフトを使用して彩度を 0にしてみることです。これでモノクロ画面の状態を作ることが出来ます。あるいはモノクロプリンタで印刷するという手もありますが、プリンタドライバによってはコントラストを自動調整してしまうものもあるのであまりお奨めできません。

ブラウザのフォントのサイズを変更(大、中、小など)しても見やすいですか?フォントサイズの変更は可能ですか?

目の不自由な人や、お年寄は、ブラウザのフォントの設定を「大」や「最大」にして見ている場合があります。
また、解像度の低いモニターを使用している人は、「小」や「最小」にして見ているかもしれません。
HTMLまたは CSS(Cascading Style Sheet)の中でフォントのサイズを「10pt」というように固定してしまうと、ブラウザのフォントサイズの設定が効きません。フォントサイズは指定しないで(標準のHTMLのタグのみで)デザインするか、指定する場合は相対サイズで指定しましょう。(1.5emや 80% 2exなど)また、フレームを使用する場合はフレームサイズも固定サイズにしないで相対サイズで指定しましょう。

問題が起きやすいのは、フレームを使用して左側や上部にメニューを表示している場合です。フォントが大きい設定にした途端にメニューが半分しか見えなくなってしまってメニューを読むためにいちいちスクロールしたり、あるいはフレームのサイズを変更する必要が生じます。一般的な人にはちょっと面倒くさい、ぐらいで済みますが手の不自由な人やマウスを使用できない(あるいは持っていない)環境の人にとっては大変な労力になる場合があります。

これらを踏まえて、フォントサイズの設定を「最大」、「最小」などに変更されたときに見やすいかどうかをテストすることをお奨めします。

続く...