SDGs

高齢の方や障がいを持つ方も利用できるコンテンツをつくるために、知っておいてほしい色の話

高齢の方や障がいを持った方も利用できるコンテンツをつくるための色の話

仕事や学校、あらゆる場で、「色を決める」機会のある方は多いのではないでしょうか。

例えば、資料を作るとき。黒板に文字を書くとき。製品を作るとき。

 

その際に、使う色に気をつけないと、もしかしたら読めない・読みづらい、と感じる人がいるかもしれません。

色のせいで、そのサービスや製品を利用できないかもしれないのです。

 

今回は、そんな「アクセシビリティ」に関するお話。

アクセシビリティ…?なんか難しい言葉出てきた…という方も、安心してください!

 

ノンデザイナーにも、わかりやすく。を心がけて作りました。

 

ノンデザイナーにも知っておいてほしい色の話

ノンデザイナーにも知っておいてほしい色の話 高齢の方や障がいのある方にとっても使いやすいサービスにしていきたいと思いませんか?

アクセシビリティとは

ウェブアクセシビリティって? アクセシビリティの例 色のアクセシビリティ

色覚多様性って?

色にまつわる障壁 色覚多様性とは 色覚多様性 色覚多様性

色覚多様性の人にはどんな風に見えるの?

色覚多様性の見え方 色覚多様性の見え方例 色覚多様性の見え方例 色覚多様性の日常で起こる困った 色の見え方の違いによって、サービスを利用できなくなってしまう人がいる

起こりうる障壁

文字が読めない 文字が読めなくなってしまう原因は、コントラスト不足

コントラストとは?

背景色と文字色の差=コントラスト コントラストが高いと読みやすい、コントラストが低いと読みにくい。色覚多様性やロービジョンだと、もっと読みにくい コントラスト不足で読みにくくなってしまう可能性の高い例

コントラストの不足はどうやって判断したらいいの?

コントラスト不足のチェック方法 世界基準のガイドラインWCAG2.0 1.4.3コントラスト(最低限) コントラスト比の基準は4.5:1だけど、基準値が高すぎるので、最低限3:1クリアを目安にするとよい コントラスト測定ツール、カラーコントラストアナライザー

コントラストを担保した淡い色の使い方

淡い色は使いづらい?いいえ、こんな使い方ができます。ピンクの使い方

アクセシビリティを高めて多くの人にとって使いやすサービスを

①色覚多様性の人ってけっこう多い②色を決めるときはコントラストを意識③コントラスト比の目安は最低限3:1 アクセシビリティ高めたいよね!それコントラスト足りなくない? アクセシビリティを高めて多くの人にとって使いやすサービスを

おわりに

「とにかくわかりやすく」を心がけたので、説明不足の点が多々ありますこと、ご了承ください。

 

色覚多様性(色盲・色弱・色覚異常)の方々や、高齢などでロービジョンな方々へも、配慮したコンテンツ作り。

少しだけ心がけてみたら、優しい世界が広がるかもしれません。

ブログランキングを見る

ブログランキングに参加中です。

記事を気に入っていただけたら、猫様をぽちっとしていただけると嬉しいです!