スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

拡張機能をアクセシブルにする5つの方法

Marco’s accessibility blog より、Extension developers: 5 things to make your extension more accessible の翻訳です。


以前、私が拡張機能開発者に最初の支援を求めた後、Aaron と私で議論を交わし、あなたのような拡張機能開発者に考慮して欲しい、拡張機能をよりアクセシブルにする最も一般的な 5 つの事柄を話題にしました。ここに挙げたものがそれです:

  1. あなたの拡張機能がキーボード操作で簡単に見つかるようにしてください。よくあるパターンは、拡張機能を実行するために、アイコンをステータスバーやツールバー上に置くことですが、この方法ではマウスを使用せずにキーボードだけで見つけることができません。最も簡単で見つけやすい方法は、キーボードユーザが実行できるように [ツール] メニューに追加することです。
  2. ラベルは、そのラベルが付けられたコントロールに関連付けられていません。そのため、スクリーンリーダは textbox や menulist, radiogroup などがどの部分なのかを知りません。xul:label の control 属性で該当するコントロールの id を指し示し、コントロールをそれらのラベルに関連付けてください。これを xul:textbox や xul:menulist, xul:radiogroup、その他の要素で動作させることが、アクセシビリティに必要不可欠です。
  3. xul:page 要素には title 属性がありません。chrome 内で xul:page 要素を使用する場合は、それらに意味のある title 属性を与えてください。こうすることで、視覚障害者のためのスクリーンリーダが適切に title 属性を取り上げ、代わりに chrome URL を読み上げることがなくなります。
  4. タブの移動順にあるプレースホルダは、
    <a href="#">

    または

    <div tabindex="0" role="button" onkeypress="if (event.keyCode == event.DOM_VK_ENTER) { ... }"/>

    を使用してください。

    Web ページ内に置かれたユーザ体験向上させ、ユーザと対話するアイテムは、キーボードから操作可能でなければなりません。Adblock plus が持つ Flash アニメーションのような要素をブロックする機能が良い例です。

  5. すべてのイベントハンドラがマウスとキーボードからの対話スキーマ (interaction schema) に反応するようにしてください。実際に、拡張機能のすべてのテストをマウス無しで行ってください。いくつかの一般的な問題は:
    • コンテキストメニューを開くために、oncontextmenu イベントハンドラや context 属性を使用してください。マウスの右ボタンのクリックでコンテキストメニューを開くコードを書いてはいけません。キーボードの使用が除外されてしまいます。oncontextmenucontext の両方とも、オペレーティングシステムで指定されたコンテキストメニューのトリガに作用します。
    • mouseovermousemove, ondoubleclick などのマウス依存の機能は、キーボードで同等の操作を提供してください。例えば、listbox 内の list アイテムをダブルクリックして特定の動作をさせる場合、Enter キーや同等のキーストロークで同じ動作ができるようにしてください。ドラッグ&ドロップについては、コンテキストメニューで代替操作 (コピー&ペーストなど) を提供してください。

これらのヒントがあなたの拡張機能や XULRunner アプリケーション、その他の作成に役立ち、すべての人にとってアクセシブルになることを望みます!

さらに詳しい情報は MDC 上の XUL Accessibility guidelines をご覧ください。

関連記事

コメント

コメントする

管理者にだけ表示を許可する

この記事のトラックバックURL

http://chimantaea.blog8.fc2.com/tb.php/62-422a5e84

※トラックバック元には、この記事へのリンクを含めてください。