アクセシビリティの基礎を学ぶ

デザイナーのHandaです。

先日、「Understanding Accessibility」という素敵なデザインのサイトを見つけました。

こちらのサイトにはデザイナーとして理解しておくべきアクセシビリティの基礎が記載されています。
アクセシビリティとは「アクセスしやすさ」「利用しやすさ」といった意味合いがあり、デザイナーとして無視できない内容です。

サイト内は全て英語で書かれているのですが、WEBデザインを制作する上でも基礎となる大事な部分がたくさん書かれていたので、ポイントをまとめてみました。

アクセシビリティで気をつけたいポイント

色について

• コントラストカラーチェッカーを使って、常に適切なコントラスト比を設定する
• 色の数が多いと読みにくいため、最小限に抑える

レイアウトについて

• ユーザーが異なるブロックを認識できるように、サイト全体で一貫したレイアウトを使用する
• ナビゲーションバーとフッターを必ず入れる
• スマートフォンやタブレットなど、あらゆる画面に対応できるようにする

フォントについて

• 13pt未満のフォントサイズは使用しない (フォントのデザインによる)
• 読みやすいフォントを選ぶ (セリフ体よりもサンセリフ体のほうが読みやすい）
• ボディコピーの場合、1行あたり単語数はスペースを含めて45～80文字にする

最後に

どの項目もデザインする上でとても重要なものばかりでした。

アクセシビリティはトレンドを押さえた”イケてる”デザインを妨げるものではありませんが、アクセシビリティを念頭に置くことで情報を多くの人に正しく伝えることができます。
今回まとめた内容はほんの一部に過ぎませんが、デザインするときはいつもユーザーのことを考えながら作っていきましょう！