アクセシビリティとユーザビリティは何がちがうの？

ユーザビリティは「使いやすいか」、アクセシビリティは「そもそも使えるか」。読めない・押せない・たどり着けないをなくすのがアクセシビリティで、その土台の上に使いやすさがあります。

a11yってどう読むの？

「アクセシビリティ」または「エーイレブンワイ」と読みます。accessibilityの最初のaと最後のyの間に11文字あることからできた略記です。

まずは意味のとおりにHTMLを書くこと。見出しにはhタグ、押せるものにはbuttonやaタグ、画像にはalt。これだけでアクセシビリティの大部分が整います。

アクセシビリティとは、「だれでも使えること」。目が見えにくい人、マウスが使えない人、ゆっくりでないと読めない人——いろいろな人がいて、いろいろな状況でページは開かれます。そのだれが来ても、ちゃんと読めて、ちゃんと操作できる。それがアクセシビリティの高いページです。

障害のある人だけの話ではありません。だれにでも、こんな瞬間があります。

アクセシビリティのくふうは、こうした全員のいつもの不便も一緒に解決します。だから、ちゃんと作られたページは、結局みんなにとって使いやすいのです。

目の不自由な人は、スクリーンリーダーという読み上げソフトでページを聞きます。画面を見るかわりに、HTMLの構造を上から順に音声で聞いていく——このとき頼りになるのが、みなさんがHTMLコースで学んだタグの意味です。

つまり、意味のとおりにHTMLを書くこと自体が、最大のアクセシビリティ対応。みなさんはすでに一歩目を踏み出しています。

道具がなくても、自分のページのアクセシビリティは今日から確かめられます。

キーボードだけで使ってみる——マウスから手を離し、Tabキーとエンターキーだけでページの端から端まで移動してみる。押せないボタン・たどり着けないリンクがあれば、それが改善ポイントです
画像をぜんぶ隠したつもりで読む——画像が1枚も表示されなかったとして、文章だけで話が通じるか。通じない部分は、altや本文の説明が足りないサインです

完ぺきを目指す必要はありません。気づけるようになることが、アクセシビリティの最初の一歩です。

このコースでは、今日から実践できる6つのくふうを、1つずつ手を動かせる形で見ていきます。

どれも特別な道具はいらず、HTMLとCSSの書き方を少し変えるだけ。難しい理論より先に、手が覚える形で進めます。