アイコンとラベルの併記
ウェブサイトのユーザーインターフェース (UI) 設計においてアイコンを実装する際、なるべくなら、アイコンには (目に見える、隠れていない) ラベルが併記されているべきだと思います。
ウェブサイトのユーザーインターフェース (UI) 設計においてアイコンを実装する際、なるべくなら、アイコンには (目に見える、隠れていない) ラベルが併記されているべきだと思います。
ここ数年、多くのウェブサイトで「フラットデザイン (flat design)」が採用されるようになり、表現手法として実質的に広く定着したと言えます。この記事では、フラットデザインにおけるユーザビリティの配慮について、考えてみたいと思います。
最近では Font Awesome のようなアイコンフォントを用いるウェブサイトが増えてきました。画像アイコンに比べメリットが多く、とても便利なアイコンフォントですが、アクセシビリティ (とりわけ、スクリーンリーダーを介した情報伝達) の観点で考えると、実装において若干の工夫が必要です。
ウェブコンテンツの表現で、テーブル (表) を用いる場合は、できるだけシンプルな表組みに設計するとよいでしょう。また、データセルの中にリンクが含まれる場合は、リンク箇所の識別性やリンクラベルの明確さを意識しましょう。
Web ページの中にナビゲーションメニューが複数ある場合、個々のナビゲーション (<nav role=“navigation">) に aria-label を記述すると、スクリーンリーダーユーザーがナビゲーションメニューの種類を容易に把握しやすくなります。
JIS-X8341-3:2010 では、「8. 試験方法」で「実装チェックリスト」の作成が求められています。おすすめは、ウェブサイト構築の上流工程から、アクセシビリティの要件定義書として、実装チェックリストを作ってしまうことです。
Web ページに埋めこまれている動画をモバイルデバイスで再生しようとすると、キャプション (字幕) が表示されないという問題がありましたが、最新の iOS および Android では、この問題が解決しています。
Web アクセシビリティ向上を推進しようとする際、サイトオーナー (サイトの運営者) からよく聞かれるのが、「アクセシビリティ対応をするにしても、それで自社は儲けることができるの (アクセシビリティ対応にかけたコストをペイできるの)?」という話です。
アクセシビリティを「デザインに対する制約」と捉える人が少なくありません。でもそれは、もしかしたら「目的」と「手段」を混同した考えかた、かもしれません。
YouTube の動画を再生するにあたっては、ユーザーの任意で、HTML5 のプレーヤーを使うことができます。YouTube の HTML5 プレーヤーは (従来の Flash ベースのプレーヤーに比べ)、アクセシビリティが向上しています。