具体的にどのような項目を抑える必要がある？
アクセシビリティへの対応には非常に重要

あらゆる人・誰もが負担なく情報を取得できることは非常に重要です。

JIS 規格にもとづき、アクセシビリティを向上することは、今や多くのウェブサイトに求められていることだと言えます。

ウェブアクセシビリティに配慮するために対策するべき項目

ウェブアクセシビリティに配慮するために対策するべき項目を一覧で見ていきましょう。

コントラスト・色使い

文字の可読性や誘目性はウェブサイトにおいて非常に重要です。

特に、文字色と背景色のコントラストは、ある程度の比を保たないと、可読性が損なわれてしまいます。

人によって見える色の数は違うのです。

一部の人にとって見えやすいウェブサイトであっても、一部の人にとって見えないのであれば、それはウェブアクセシビリティに配慮されていません。

コントラスト比を確保した色の組合せを心がけてデザインすることが大事です。

書体やフォント

文字・フォントも重要です。基本的には、ゴシック書体を使用しておくと、読みやすさに配慮されていると判断できるでしょう。

文字のかたちがわかりやすいことや、読み間違えしづらいことなどに気を付けてフォントを選びましょう。

他にも、以下のようなフォントがおすすめです。

・メイリオ

・游ゴシック

・ヒラギノ角ゴシック

基本的には、ゴシック系なら問題ないと覚えておきましょう。

テキスト形式の文字サイズ

ホームページの大部分を構成するのが、テキストと言えます。

テキストこそ情報を伝える真髄です。

まず、フォントのサイズ形式は、大きさを変更することができるようにしておくと、高齢者などにも親切です。

全ページの上部に、文字の大きさを調整することができるポップアップなどが出ていると親切です。

他にも、ウェブアクセシビリティにおいて、文字サイズをどのくらいにしたらいいのか悩む人もいるでしょう。

一般的に読みやすいとされる文字サイズは、16〜24px相当です。

さらに、行の高さは150〜200%(line-height: 1.5;以上)としておくことで、文字の間隔も綺麗に見えやすくなります。

スタイルシートの使い方

配置や見栄えなどは、CSSで綺麗に整えましょう。

しかし、読み上げ機能などでは、主にHTMLを参考に読み上げられるため、スタイルシートが効かないことがあります。

このため、あくまで「スタイルシート」はプラスアルファで読みやすくなる程度のつくりにとどめましょう。

そして、スタイルシートが適用されない閲覧環境の人であっても、理解に支障が生じないような設計が大事です。

ナビゲーションの付与

高齢者の方がウェブサイトに訪問すると、よくあるお悩みとして出てくるのが、どのページにいるのかわからなくなってしまったという例です。

そういったトラブルを防ぐために、ホームページのヘッダーにナビゲーションを常に表示させたり、パンくずリストを設けたりするなどすると良いでしょう。

ウェブアクセシビリティに富んだサイトを作成するには

ウェブアクセシビリティに富んだサイトを作成するには、例えば、画像の示す情報に代替テキストを付与するなど、細かい作業が必要です。

他にも、文字と背景のコントラスト比を保つように修正するなど、既存のウェブサイトを改善できるように、作業が必要になります。

ウェブアクセシビリティに富んだサイトを簡単に作成するには、ウェブアクセシビリティAIがおすすめです。

通常のウェブサイトにアドインでナビゲーションツールを表示させ、障害者の方向けのガイドラインをうつしだすことができます。

気になる人はぜひウェブアクセシビリティAIを使ってみてください。