こんにちは！デザイナーのヒロです。
アクセシビリティはすごく重要です！みんなが見れる、良いWebサイトを作るために、ぜひ知っておきましょう！
Webサイトをデザインする時、使う色も新しく決めないといけないですよね。
そこでストップ！
その色、アクセシビリティは大丈夫ですか？
そもそも、アクセシビリティって知ってますか？
今回は、Webデザイナーなら絶対に知っておきたい、色のアクセシビリティについてご説明しますね！
アクセシビリティとは
Webサイトってたくさんの人が見ますよね。
その中には、高齢者の方や、色覚に障害がある方なども訪れるでしょう。
そういった方にとって、あなたのWebサイトは見やすく・使いやすく設計されているでしょうか？
アクセシビリティとは、「アクセスのしやすさ」のことです。
その意味が転じて、「製品やサービスの利用しやすさ」という意味でも使われるようになりました。
なので、Webサイトの利用しやすさのことを「Webアクセシビリティ」と呼びます。
最近では、いろいろな方が、
パソコンやスマートフォンなどの様々なデバイスを、
家や電車の中だったり、外だったりでWebサイトを見るようになりました。
どんな方でも、どんなデバイスでも、どんな状況でも、Webサイトを見ることができる。
今の時代だからこそ、Webアクセシビリティは、とても大切なことなのです。
Webアクセシビリティは、規定されている！
Webアクセシビティがとっても重要だということは、わかっていただけましたか？
ですが、
「このWebサイトは、Webアクセシビリティを十分満たしている！」
「このWebサイトは、誰がどのデバイスで、どういう状況でも見れる！」
…と自信を持って言うためには、どうしたら良いのでしょうか？
実は、このWebアクセシビリティには、基準があるんです！
その基準が、この３つの規格です。
- WCAG 2.0（W3Cの勧告）
- ISO/IEC 40500:2012（国際規格のISO）
- JIS X 8341-3:2016（国内規格のJIS）
「なんで３つもあるんだ。覚えられない…」と思った方、ご安心ください。
覚えるのは、最後の「JIS X 8341-3:2016」だけで大丈夫です！
なぜなら、
W3C（世界のWeb技術の標準化団体）が定めた基準の WCAG 2.0。
その WCAG 2.0 が、そのまま、国際規格 ISO/IEC 40500:2012 になり、
その ISO/IEC 40500:2012 との一致させた国内規格が、JIS X 8341-3:2016 です。
つまり、３つとも同じ規格なのです！
それであれば、最後に制定され、日本語で読みやすい JIS X 8341-3:2016 の規格を覚えるだけで十分ですよね。
この、 JIS X 8341-3:2016 で設定されているWebアクセシビリティに関して、
また今度、別の記事で詳しくご説明しますね。
色の組み合わせとコントラストに注意！
配色について注意するポイントは、
「色の組み合わせ」と「コントラスト（明暗差）」の２つです！
色の組み合わせについては、
色の三属性を説明した記事で、明度や輝度についてご説明しました。
色が知覚できないと、このようにモノクロに見えるとされています。
モノクロにしてみると、赤色や緑色の違いがわかりづらいですよね。
つまり、まったく違う色でも、
コントラストが低い（= 明暗の差がない）ので、
色が知覚できないと同じ色に見えてしまうんです！
Webアクセシビリティを考慮した色の確認は、
PhotoshopやIllustratorなどの制作ツールや、
Webブラウザの拡張機能（Chromeだと「NoCofee」という拡張機能が有名）、
またはスマートフォンのアプリなどで確認することができます。
配色を決める前に、ぜひチェックしてくださいね！
いかがでしたか？
色が自分と同じように見えない人や、デバイス、状況がある。
それを常に意識してデザインすることが、デザイナーのとってとても重要です！
なので、ぜひ覚えておいてくださいね！
コメント