HTML記述の問題点をチェックしてアクセシブルに | デザインってオモシロイ -MdN Design Interactive-
【サイトリニューアル!】新サイトはこちらMdNについて


Webデザインには、あなたの知らない「落とし穴」がたくさん。大きなものから小さなものまで、それが及ぼす影響はさまざまだ。カンペキだと思っているあなたのサイトも、実はすでに暗い穴の中かも・・・。




HTML記述の問題点をチェックしてアクセシブルに


 今日のWebページ作成においてアクセシビリティといった言葉をよく耳にするようになった。accecibilityとは「受け入れられやすさ」という意味の英単語であるが、要は「さまざまな環境、高齢者や障害者などハンディをもつ人にとってどの程度閲覧できるか」という意味で使われる。Webページ作成においてデザインとの兼ね合いで優先的にアクセシビリティを考慮するのもなかなか難しいができる限りの対応はしたいものだ。

 今回はアクセシビリティを上げるために簡単に使える機能を紹介したい。Dreamweaverにはサイトメニューの中にレポートという機能があり、これを使って画像の代替テキストの設定のし忘れや「無題ドキュメント」のままのタイトルをチェックすることができる。また、「アクセシビリティ」という項目でW3C(World Wide Web Consortium)のWCAG(ウェブ・コンテンツ・アクセシビリティ・ガイドライン)のチェックポイントに準拠しているかどうかを調べることもできる【1】。

 レポートは単一ページ、複数ページ、あるいはサイト全体をチェックすることができるので状況に応じて変更していただきたい。レポートの項目をチェックして実行すると、修正もしくは検討する必要のあるものが指摘される。それぞれの項目をダブルクリックするとページ内の対応する部分がハイライト表示されるので、すぐに修正することができる【2】。

 サーバにアップする前にレポート機能で自分の作成したページをチェックしてみよう。



【1】レポートする対象のページを選びレポートする内容にチェックを入れる


【2】修正もしくは検討する必要のあるものが指摘された。ダブルクリックして対応する部分を表示させよう

解説:横山 剛

(※本文中、及びキャプション内で使用している「<」、「>」は、全角になります。ご注意ください。)





twitter facebook このエントリーをはてなブックマークに追加 RSS
【サイトリニューアル!】新サイトはこちらMdNについて

この連載のすべての記事

アクセスランキング

8.30-9.5

MdN BOOKS|デザインの本

Pick upコンテンツ

現在