はじめに
現在、インターネットは重要な社会インフラの一つとなっており、インターネット上にあるWebサイトを通じて情報を収集することが当たり前になりつつあります。それは、年齢や健康状態を問わず、様々な人が様々なデバイスからWebサイトを閲覧することを表します。そうした中で、どんな人やデバイスでも、同じように情報が得られるようにするため、Webアクセシビリティが求められるようになってきました。今回のコラムでは、このWebアクセシビリティではどういったことが求められるのかについて、説明していきたいと思います。
主なアクセシビリティ
文字色と背景色のコントラスト比を高くする
文字色と背景色が同一の場合、文字がはっきりと見えず、文字を識別しづらくなってしまいます。特に高齢者や色覚障がいをお持ちの方は、色が区別できず、文字の判別が行えない可能性があります。また、近年利用が増えているスマホで屋外利用とすることも増えているため、コトンラスト比の重要度は増している状況です。
こういったこともあり、文字色と背景色には、コントラスト比を意識した配色を行うことが期待されます。Webアクセシビリティのガイドラインとして用いられるWCAG2.0では、少なくとも4.5:1のコントラスト比があることが推奨されています。
キーボードだけで操作できるようにする
視覚障がい者や上肢障がい者、高齢者には、マウスポインタが見えづらかったり、細かなマウスの操作ができなかったりといったことがあります。
そういった方たちがWebサイトが利用できるよう、タブキーやエンターキー、スペースキー、矢印キーなどキーボードだけでWebサイトを操作できるようにすることが期待されます。この際、Webサイト上のどの部分にフォーカスがあたっているのかが把握できるよう、フォーカスインジケーターを表示するようにしましょう。
また、こういった対応を行う際には、キーボード操作だけではフォーカス解除ができず、特定のコンテンツから抜け出すことができないことがないようにする必要があります。(例: モーダルダイアログ内ではキーボード操作が行えず、モーダルダイアログを閉じることができずに、Webサイトを操作できなくなってしまう)
画像・写真を投稿する時に代替テキストをつける
視覚障がいを持つ方の中には、Webサイトを閲覧する際に、スクリーンリーダーを使用して情報を取得する場合がございます。スクリーンリーダーとは、Webサイト上の文字を音声合成を行い音声として出力したり、点字ディスプレイに出力したりするソフトウェアとなります。
そこで、画像の内容を文字であらわした代替テキストを設定することが期待されています。代替テキストとは、写真やイラスト、グラフなど主に画像で提供される情報と同等の役割を果たすテキストとなり、これをalt属性で設定します。代替テキスト設定する際は、スクリーンリーダーでの可読性を考慮し、80文字程度が望ましいとされています。
映像コンテンツには字幕をつける
近年のWebサイトでは、映像コンテンツが多用され、利用者に映像と音声による多くの情報を提供しています。一方、そういったコンテンツは聴覚障がい者などの利用者にとっては、音声が聞こえず、コンテンツの内容を理解できないといったことにもなりかねません。
そういった方にも映像コンテンツの内容を理解いただくため、音声の内容をキャプションとして映像コンテンツに表示させることが期待されています。
また、それ以外の映像コンテンツのアクセシビリティとしては、光の点滅を伴うような映像コンテンツは避けるといったものもあります。
主なWebアクセシビリティガイドライン
代表的なWebアクセシビリティガイドラインは、ウェブの世界的基準化を目指す国際的団体「W3C(World Wide Web Consortium)」が作成したWeb Content Accessibility Guidelines(WCAG)があります。現状の最新バージョンは2.2となっています。
また、WCAG2.0を基準に「ISO/IEC 40500」が国際規格に策定され、国内規格としてもWCAG2.0をベースに「JIS X 8341-3」が策定されております。
おわりに
今回はWebサイトをより様々な利用者に使ってもらうためのWebアクセシビリティを紹介いたしました。
SmartBeeでも、少しでも多くの利用者が利用しやすく、使いやすいサービスを目指しているため、こうしたWebアクセシビリティを意識したサイト構築を心がけてまいります。最後に、少しでもSmartBeeに興味をもたれましたら、お問い合わせをいただければ幸いです。
SmartBee
作業項目や現場情報の一括管理を可能にするクラウドサービスです。
SmartBeeを導入すれば、管理業務の負担が減るばかりでなく、点検現場の状況をリアルタイムで把握でき、ミスやコスト削減につながります。
