« デジハリ070120+アクセシビリティ | トップページ | 富士通アクセシビリティ・アシスタンス »

2007年1月21日 (日)

Web Accessibility Toolbar

昨日の記事の続き。さっそくInfoaxiaのサイトからダウンロードして使ってみたので、使い勝手をレポートする。

同サイトには『オーストラリアの視覚障害者団体が設立したNPOのAISが開発したツールバーです。1人でも多くの人に使ってもらうことで、Webアクセシビリティの重要性に気づいてもらいたいという開発者の思いから、最もシェアの高いWindows版IEのツールバーとして開発されました。』と解説されている。
また、アクセシビリティに関する記事や用語集もあるので、Web制作の知識を深めることができる。

実験してみて、予想以上の機能に驚いた。
アクセシビリティの検証ができるだけでなく、Web制作の協力な支援ツールである。

CSSのメニュー一覧
HTML/CSSのメニューからは、CSS有効/無効という定番機能の他、「div要素の順序と外枠を表示」でサイト内の構造が一目で分かる機能。CSSを使ったWebページを学習するとき、協力な支援ツールになるだろう。
ちなみに、私はCSSの有効/無効切り替えには「ス切りボ」というツールを使っている。「ス切りボ」はツールバーに組み込まれるがスペースを取らないのが嬉しい。

シミュレーションのメニュー一覧
これは「シミュレーション」のメニュー。「第一色覚特性」とは、赤と緑が識別できない色覚特性だが、このユーザーからの見え方をシミュレーションする機能などアクセシビリティを検証することに役立つ。
また、ウィンドウのサイズを 640x480/800x600/1024x768および任意サイズに変更する機能は レイアウトを重視したWebページ開発を支援してくれる。

当ブログの色の一覧「画像」のメニューからは、このようにCSSで使用している色の一覧を表示する機能や、画像を代替テキスト表示に切り替える機能などがある。
特に、新規ウィンドウに使用している画像とその情報の一覧を表示してくれる機能は、複雑なページを制作する際に役に立ちそうだ。

色のメニュー
特にWebアクセシビリティの機能として気になったものは、Infoaxiaのサイトからダウンロードして組み込める「カラーコントラストアナライザー(CCA)」。特に、Web ページ上のテキストの判読性および画像上の文字の判読性を判断するのに役立つツールだ。

拡大鏡で色をピックアップこのように、自動拡大表示から前景色と背景色をピックアップすると、色覚特性ごとの見え方と結果を表示する。色相差と明度差の両方の基準値をクリアーしていないと×マーク。
次のような2つの表示モードがある。(クリックすると原寸表示)

カラーコントラストアナライザーの判定例1カラーコントラストアナライザーの判定例2

ちなみに、上の左の結果は当ブログのタイトル部分の判定であり、コントラスト不足であることが判る。タイトルとサイドバーのブルー/ブログの背景のグレーで校舎の色を表現しており、メインの部分でもないので当面変更はしない。
タイトル部には白地も混在しているので、ブログタイトルと説明文の可読性が悪い。「明らかに改善の必要がある」ことを認識しているが、あえて事例として残しておきたい。

明日は「富士通アクセシビリティ・アシスタンス」のツール群をレポートする。

|

« デジハリ070120+アクセシビリティ | トップページ | 富士通アクセシビリティ・アシスタンス »

コメント

コメントを書く



(ウェブ上には掲載しません)


コメントは記事投稿者が公開するまで表示されません。



トラックバック

この記事のトラックバックURL:
http://app.f.cocolog-nifty.com/t/trackback/178689/5040133

この記事へのトラックバック一覧です: Web Accessibility Toolbar:

» このブログのアクセシビリティ [舎密亭日乗 ]
五十嵐さんが、ブログで Web Accessibility Toolbar とい [続きを読む]

受信: 2007年1月26日 (金) 22時54分

« デジハリ070120+アクセシビリティ | トップページ | 富士通アクセシビリティ・アシスタンス »