Articles

色盲のためのデザイン方法

色盲または色覚欠損(CVD)は、世界中の1人の男性で12人、1人の女性で200人に影響を与えます。 つまり、ウェブサイトやアプリを訪問する100人のユーザーごとに、最大8人までのユーザーが実際にコンテンツを体験できることは、期待どおりです。 もうすることを保証するためとお客様のユーザー体験の魅力にも同様にこれらの観覧できますか? 我々は救いの手を貸すためにここにいる。 だから、あなたがパニックにあなたのデザインチームに実行する前に、色のアクセシビリティのためのUXを設計するときに考慮すべきトップのこと,

まず、色覚異常とは何ですか?

ほとんどの色盲の人は、他の人口と同じくらいはっきりと物事を見ることができますが、違いは赤、緑、または青の光を区別できないことです。 この欠乏は、X染色体の突然変異の結果であり、女性は患者よりもキャリアである可能性が高く、3つの主な方法で現れる可能性があります。

最も一般的なのは、赤/緑の色覚異常であり、患者は全色の一部として赤または緑を有するすべての色を混合する。, Protanの色盲によって影響されるそれらはDeuteranopiaの被害者に緑との同じ問題がある間、赤灯により少なく敏感です。 彼らは紫の色の赤い要素を認識することはできませんので、たとえば、Protanopiaを持つ人は、青と紫を混同します。 色の欠乏の第三のタイプ、Tritanopiaは、最も一般的であり、青または黄色の光を区別するのに苦労している患者を指します。 下の画像は、虹が色盲のこれらのフォームのそれぞれを持つ個人にどのように見えるかを示しています。,

では、色のアクセシビリティを向上させるためにどのように設計できますか?

あなたは考えているかもしれません。”しかし、一般的に、色盲ユーザーにとって有利な要素は、実際には広い意味での優れたデザイン慣行であると考えられています。 うにサイトの場合は、既にアクセスできます。

設計のためのアクセスえてくるということではない、美容の完全性のデザインが悪くなります。,

色と記号の両方を使用する

メッセージを伝えるために色だけに頼るべきではありません。 一つのアプローチは、ユーザーの注意が必要な色と記号の両方を使用することです。 これの良い例は、Facebookのフォームフィールドと添付されたエラーメッセージです。,

楽しい事実:Facebookのロゴと悪名高い青色の配色は、Mark Zuckerbergが赤緑の色盲であり、青が最高であると見ているため、特に選ばれました。

最小限に抑える

ウェブサイトに使用するカラーパレットを制限する必要があります。

ミニマルなデザインは時代を超越した美しいトレンドであるだけでなく、色のアクセシビリティのために設計しているときにも便利です。,

パターンとテクスチャを使用してコントラストを表示

強調が必要な要素には、複数の色ではなく異なるテクスチャを使用してみてください。 たとえば、色盲のユーザーがグラフやグラフを解釈するのは難しいかもしれません。 この場合、対照的なパターンを使用し、可能であれば代わりにテキストを配置する方が良いでしょう。

対照的な色と色合いに注意してください

あなたの唯一の対照的な色として黒と白に頼るのではなく、あなたのデザイン, 例えば、ゲーム語犬使用は色、タイルすることができ抜けるようにな色のビジョンの欠乏状態にあるといえる

悪い色のコンボを避ける

あなたの色の組み合わせを選ぶときは、スマートにする必要があります。 色盲はさまざまな方法で人々に影響を与えるので、どの色がwebデザインで使用するのが安全であるかを判断することは困難です。,iv id=”7030bde3c1″>

Red

  • Green & Brown
  • Blue & Purple
  • Green & Blue
  • Light Green & Yellow
  • Blue & Grey
  • Green & Grey
  • Green & Black
  • Side note: how do you know if you’re color blind?,

    まあ…他の誰かがそれらを指摘しない限り、効果は比較的見過ごされる可能性があるので、色盲であることを知らずに何年も行く人もいます。 下の画像は、一般的に色盲のためにテストするために使用されます–それを行くを与えます! (あなたはこの記事の下部に完全なテストへのリンクを見つけることができます。)

    まだわかりませんか?

    1. 石原色盲テスト:あなたは38プレートベースのテストを受けて、同様にフィードバックを得ることができます。,
    2. カラーブラインドチェック:Colorblindorによって作成されたAndroidアプリで、±60秒で色盲かどうかをテストできます。
    3. Coblis:Color Blindness Simulator:ここでは、画像をアップロードして、さまざまな種類の色盲を持つ人々の目を通してどのように見えるかを見ることができます。
    4. モバイルアプリ:ここでは、特に色盲のユーザーを支援するために開発された3つのAndroidとiOSアプリです。,

    結論

    一般的に、UXデザイナーは、すべての人がアクセスでき、ユーザーフレンドリーなウェブサイトを作成する必要があります。,

    1. メッセージを伝えるために色だけに頼らないでください
    2. カラーパレットを2または3色に制限してください
    3. テクスチャとパターンを使用してコントラストを表示する
    4. コントラストのある色と色合いを慎重に選択します
    5. 悪い色の組み合わせを使用しないでください