Of ChaichanPapa-World !

Home/Menu

ストリクトなHTMLの基礎講座

アクセシビリティについて

◆ はじめに

正しいHTMLは、もうご理解を頂けたでしょうか...。しかし、Webの世界は動きが速く、すでにアクセシビリティとユーザビリティの時代に突入しているみたいです。

ウェブにおいてのアクセシビリティとは、障害のある人にとって、ホームページをどのように作成すると、アクセシブルになるのかを云います。(W3CのWeb Content Accessibility Guidelines 1.0 から)

一方、ユーザビリティとは、操作性(取り扱いのしやすさ)、認知性(分かりやすさ)、快適性(心地よさ)等を云います。

また、アクセシビリティが向上すれば、普通の人には、よりアクセシブルになり、結果的にユーザビリティが向上します。

ユーザビリティが悪いものは、自然淘汰されるはずです。ですので、アクセシビリティを向上させましょう!

ここに、アクセシビリティをまとめてみましたので、是非ごらんください!
そして、ご自分のホームページへ反映させてください!

アクセシビリティ、ユーザビリティの向上こそ、これからの流れです...。

◆ アクセシビリティについて

ここでは、W3CのWeb Accessibility Initiative (WAI)が、障害を持つ人にも使いやすいページを作成するためのガイドライン(Web Content Accessibility Guidelines 1.0 )の概略を以下に説明します。

障害のある人って、自分には関係ないと思いのあなた、実は、私たちも、病気やけがによって、いつ障害を持つことになるかわかりません。もちろん、言うまでもなく全ての人は年をとります。

全ての人に読んでもらえるページを作るということは、特別なコトではなく、すでに当然のコトであると言えるでしょう。

ガイドラインの概略

  1. 音声や画像コンテンツには、同等の役割を果たす代わりのものを提供する
    代表的なのは、img要素のalt属性の明記です。また、イメージマップには文字によるリンクも併記しましょう。
  2. 色だけに依存した表現をしない
    色を再現できない環境で表示しても、テキストやグラフィックスが理解できるようにする。
  3. 正しいマークアップをし、スタイルシートを使う
    これに関しては、もう大丈夫ですよね! すでに常識です。いまさら、テーブルでレイアウトなど...。
  4. 文書で使用する言語の明示する
    html要素には必ずlang属性(lang="ja")で言語の明示をしましょう。
    あと、abbr要素やacronym要素のtitle属性もフルスペルで明示しましょう。
  5. テーブルでも「表」として視覚的に表現できないユーザーのための配慮
    ベタ読みして意味不明にならないように配慮しましょう。
    また、tr,th,thead,tbody,tfoot,col,colgroupの各要素を適切にマークアップ。
  6. 最新技術をサポートしないユーザーへの配慮
    JavaScript、プラグイン、スタイルシートが使えない場合の配慮。たとえば、テキストで仮表現するとか...。
  7. 時間によって変化する内容については、ユーザーが制御できるようにする
    移動、点滅、スクロール、自動的に更新されるオブジェクトやページは、一時的にまたは完全に停止させることができるようにする。
  8. 埋め込みオブジェクトのユーザーインターフェイスは、アクセシブルなものにする
    勝手に動いてしまったりするのではなく、ユーザーが直接操作可能にしておくこと。
  9. 装置に依存しないように設計する
    マウス以外にも、キーボードなどによって操作できるようにしましょう。
    フォームの入力項目にTABキーでの選択を容易にするtabindex属性、キーボードショートカットのためのaccesskey属性などが推奨されています。
  10. 暫定的な解決策をとる
    支援技術や古いブラウザを使った場合でも正しく操作できるように、暫定的なアクセシビリティの解決策をとる。
  11. W3Cのテクノロジーとガイドラインを使用する
    W3Cのテクノロジー(仕様)とガイドラインに従う。正しいHTMLと本説明のアクセシビリティですか...。
  12. 文脈や文書の流れを理解するための情報
    複雑な内容やページ構成でもユーザーが理解できるように、前後関係や位置を表す情報を提供する。 また、まとまった要素はできるだけグループ化することで、視覚的な情報がなくても内容を理解し易くする。
  13. はっきりとわかるナビゲーションの機能を提供する
    探している情報がすぐに見つけだせるように、明確で一貫したナビゲーションのための仕組(位置情報、ナビゲーション・バー、サイトマップなど)を提供する。
  14. 文書は明瞭で簡潔なものにする
    一貫したページレイアウト、すぐに意味のわかるグラフィックス、わかりやすい文章。

◆ おわりに

今回、ウェブにおいてのアクセシビリティについてお勉強をしましたが、まさに、「正しいHTML+α」ですね!

そして、徹底した見る側主体の作り、そう、これからは、アクセシビリティをつねに心がけていきましょう。

本サイトは、まだまだ未熟ですが、しかし、「正しいHTML+α」へ徐々にシフトさせていきます。

尚、本ページ作成にあたって、以下のページを参考にさせて頂きました。大変ありがとうございました。

本ページより、数段素晴らしいページですので、是非アクセスしてみてください。

Home/Menu/HTML概説リファレンス