アクセシビリティとは？事例やWebサイトの改善ポイントを紹介！

アクセシビリティって何か知ってる？

アクセシビリティとは、サービスや情報がどれだけ使いやすいかを示す指標ってところかな！

アクセシビリティを高めることで、どんな人でも平等に情報やサービスにアクセスできるようになるから、お客様に情報やサービスを提供する企業は、取り組む必要があるんだよ

たとえば、障害を持つ人や高齢者などにもサービスが行き届くようになる感じ！

あとは「使いやすいサービスを提供している」っていう印象を与えられるから、アクセシビリティの高いサービスや情報を提供している企業は、それだけで競合との差別化が図れるね

そうだよね、そしたら、実際にどんな風にアクセシビリティが使われているのか、具体的な3つの例を紹介するよ！

スマートフォンやパソコンで、画面の文字を拡大できる機能があるよね

あれもアクセシビリティの1つだよ

この機能は、「文字拡大機能」といって、視覚障がいのある人や小さい文字が読みにくくなった高齢者の方向けに提供されている機能だよ

文字サイズを調整して読みやすくすることで、どんな人でも必要な情報にアクセスできるんだ！

そう、だから、公共施設のデバイスとかWebブラウザとかには必ず文字拡大機能がついているんだよ

トイレの入り口や電車のいたるところに表示されているアイコン「ピクトグラム」もアクセシビリティを意識した結果の1つだよ

そう、ピクトグラムは、図やアイコンを使用して情報を伝えることができるから、文字が読めない人とか、日本語がわからない外国の方とかにも情報を伝えられるよ

点字ブロックもアクセシビリティの1種だよ！

点字ブロックは、視覚に障がいのある人々が歩行時に安全に移動できるようにするための設備だけど、それがあると、警告やナビゲーションを理解できるから、視覚障害者は安全に移動ができるんだよ

たとえば、多くの人が行き交う公共施設や交差点で、何もナビゲーションがないと、視覚障害者は目的の場所に行くことができないよね？

点字ブロックは、社会全体のバリアフリー化を促進し、視覚に障がいのある人々が自立して移動できるという点で、アクセシビリティの1種だと考えられるよ

じゃあ次は、Webサイトのアクセシビリティを高める場合に改善したい箇所を紹介するよ！

ちなみに、アクセシビリティを高めるために何をすべきかについては、デジタル庁が提供する「ウェブアクセシビリティ導入ガイドブック」を参考にしているよ！

まずは、目的の記事に到達できるようにするということで、わかりやすい記事のタイトルをつけることが大事だね

例えば、この記事なら「アクセシビリティとは？事例やWebサイトの改善ポイントを紹介！」っていうのがタイトルだけど、このタイトルをみて、どう思った？

そうだよ、わかりやすいタイトルっていうのはそういうこと！

読者が検索しているであろうキーワードを盛り込んで、タイトルを作るのがWebサイトのアクセシビリティを高めるために重要なんだよ

あと、ちょっと難しいから簡単に紹介するけど、GoogleがWebサイトの記事を検索結果に表示させるときにも「本文内容をタイトルに反映させる」というのがものすごく重要になるんだ

SEOの観点で重要ってことだね！

そういうこと！

ページから他の記事にリンクを貼るときには、わかりやすく色をつけて表示するのも、アクセシビリティの観点で重要だよ！

間違えてテキストをクリックして、他のページに遷移するのを防ぐためだよ

せっかく、記事をじっくりと読みたいと考えているのに、間違って他のページに飛ばされたらイライラするでしょ？

そういう誤作動を防ぐために、アンカーテキストにはわかりやすく色をつけた方がいいんだよ！

リンクには青色をというのが、Webサイトの昔からの慣習だから、基本的には青色で表示すればいいよ！

デフォルトでも青色のリンクだから、そのままで大丈夫！

次に大事なのは、モバイルからのアクセスを考えて、しっかりと対応させることだよ

これを「モバイルフレンドリー」っていうんだけど、最近はほとんどのユーザーがモバイル端末で検索するから、対応させた方がいいんだ！

もし、モバイル対応させていない状態で読者がWebページに訪れると、パソコンの画面に写っている情報をそのまま切り取ったような状態で表示されてしまうから、画面いっぱいに文字が表示されたり、逆に文字が小さく表示されたりするから気をつけてね

また、視認性の高い色味を使うことも重要だよ

薄い色じゃなくて、誰もが理解できる濃い色味にするってこと！

特に、色盲と呼ばれる色の判別が困難な人や、視覚障がいのある人は薄い色だと何が書かれているか全くわからないから、視認性の高い色味を使おうね！

代替テキストもアクセシビリティを高める上で重要だよ

代替テキストは、画像が電波障害などによって表示されない場合に、代わりに表示させるテキストのことなんだ

たとえば、遊んでいる犬の画像をサイトに貼り付ける場合に「遊んでいる犬」というように画像の説明を簡潔に文章にするんだ！

そうすると、画像が表示できない場合に、画像の代わりに「遊んでいる犬」って文字が表示されて、読者はそこに表示されていた画像がわかるという仕組みだよ

あとは、画像を見れない視覚障害者に対しても、代替テキストは役立つよ！

スクリーンリーダーのような文字を代わりに読んでくれるツールを使用した場合に、代替テキストも一緒に読んでくれるから、読者は内容を理解できる！

最後に、アクセシビリティについてまとめるね

今回は、アクセシビリティについてまとめてきたけど、ブルーはわかった？

そういうこと！

特に、Webサイトのアクセシビリティを高める方法は今回紹介した以外にもたくさんあると思うから、どうすればお客さんに喜んでもらえるかを自分で考えることが大事なんだ！

ぜひ参考にしてみてね！