インパクト 色覚異常 あるいは、色覚異常 (CVD) は、世界中で男性の約 1 人に 12 人、女性の 1 人に 200 人が罹患しています。これは、Web サイトまたはアプリにアクセスするユーザー 100 人ごとに、最大 8 人が予想とは大きく異なるコンテンツを体験する可能性があることを意味します。しかし、どうやってそれを確信できるのでしょうか？ ユーザー体験 このカテゴリーの訪問者に魅力を提供し、平等にするためには何を提供しますか?
色覚異常を患っていない場合、色覚異常に対処するのは困難です。幸いなことに、デザイナーは、すべてのカテゴリに適合するデザインを完成させるのに役立つ多くのオンライン ツールにアクセスできます。
いくつかを調べてみましょう 最高のエミュレータ 色覚異常用。
クイックリンク
まず、色覚異常とは一体何でしょうか？
色覚異常のある人のほとんどは、他の人と同じように物体をはっきりと見ることができますが、異なるのは、赤、緑、青の光を区別できないことです。このインポテンスは、体の突然変異によって引き起こされます。
最も一般的なのは赤/緑不感症で、赤または緑を含むすべての色が色の一部として混ざってしまいます。第一色盲の患者は赤色光に対する感度が低いですが、第二色覚の患者は緑色に対して同じ問題を抱えています。たとえば、第二色覚を持つ人は、紫の中の赤の要素を認識できないため、青と紫を混同します。 3 番目のタイプの色覚異常である三色覚異常は、あまり一般的ではありませんが、青色または黄色の光を区別するのに苦労している患者を指します。下の画像は、これらの色覚異常を持つ人にとって虹がどのように見えるかを示しています。
1. Web 開発に最適な色覚異常シミュレーター: 内蔵ブラウザー ツール
いくつかのことをご存知ですか？ 最新のブラウザ 色覚異常シミュレーションが組み込まれていますか?これらのツールは、Web デザイナーが色覚異常を持つ人に適した Web ページを作成するのに役立ちます。デザイナーでなくても、別の Web サイトにアクセスしたり、追加のアプリケーションをインストールしたりすることなく、これらを使用して Web ページを表示できます。
現在、これらを備えているのは Firefox と Chrome ブラウザのみです シミュレーション。 Firefox での色覚異常のシミュレーションの詳細については、次の URL を参照してください。 アクセシビリティインスペクターのヘルプページ.
現時点では Chrome には主要なバリアントにエミュレーション オプションがありませんが、現在開発者向けに設計されたブラウザで利用できます。 カナリア。このツイートでは、新しいツールが実際に動作している様子を確認できます。
の新しいアクセシビリティ機能 @ChromeDevTools: かすみ目やさまざまな種類の色覚異常などの視覚障害をシミュレートします。 🔥
視覚障害を持つ人々があなたの Web アプリをどのように体験しているかを調べて、自分でも気づいていなかったコントラストの問題を解決してください。 pic.twitter.com/QKLQmEhhMM
— マティアス・ビネンス (@mathias) 2020 年 3 月 10 日
2. Web ページに最適な色覚異常シミュレーター: Toptal Color-Blind Filter
Web サイトが色覚異常に対応しているかどうかをテストする場合は、次のことを試してください。 Toptal 色覚異常 Web ページ フィルター。 Web サイトは、遅い場合もありますが、他の人の目から Web ページがどのように見えるかを示す効果的なオプションです。 URL を入力し、カバレッジ フィルターを選択して、[Fetch and Filter!] をクリックするだけです。
ページに色覚異常のフィルターを通すと、色覚異常の人がそのページをどのように操作するかがわかります。 [条件] をクリックして、色覚異常の種類ごとに新しいプレビューを作成できます。
Web サイトがどのように表示されるかを共有する場合は、左下にある [フィルターされたページ URL をコピー] をクリックします。これにより、結果を他の人と共有できるリンクが作成されます。これは、誰かと協力して Web サイトをデザインしており、そのデザインが色覚異常に対しても適切に機能することを証明したい場合に特に便利です。
Web サイトが色覚異常テストに合格した場合は、ページの下部にある画像を使用して、訪問者にページが色覚異常であることを示すことができます。 彼らのニーズに合っている 視覚に問題があるかどうかに関係なく。
3. 画像に最適な色覚異常シミュレーター: Coblis (色覚異常シミュレーター)
もしあなたがそうするなら イメージデザイン しかし、色覚異常の人にはどう見えるか気になる場合は、Coblis の Web サイト (Cああ、Bリンド Sエミュレータ）。 コブリ 画像をアップロードして、色覚異常のさまざまなバリエーションを簡単にテストできる Web ツールです。
このツールを使用するには、ページの中央まで下にスクロールします。アプリのスクリーンショットのようなものが表示されます。だまされないでください。これはスクリーンショットではありません。これは、Web ページに埋め込まれた実際のアプリケーションです。
ボタンを使用して仮想イメージを操作し、ツールで何ができるかを知ることができます。画像をテストする準備ができたら、 ボタンをクリックします ファイルの選択 ダウンロードしたいファイルを選択します。これで、ツールを使用してさまざまなビューを試し、画像がどのように保持されるかを確認できるようになりました。
4. 色覚異常シミュレーションに最適なアドオン: Let's Get Color-Blind
やや心配な名前にもかかわらず、Let's Get Color-Blind は Web サイトをすばやくチェックするのに便利なツールです。確認したいページにアクセスし、右上のブラウザ拡張アイコンをクリックして有効にします。
アクティブにすると、さまざまなタイプの色覚異常を選択でき、Web サイトは設定に合わせて自動的に更新されます。シミュレーションの強度が強すぎるか弱すぎる場合は、好みに合わせて調整することもできます。
ダウンロード: 色覚異常を克服しましょう Chrome | Firefoxの （無料）
5. 最高の色覚シミュレーター アプリ: Chromatic Vision Simulator
Chromatic Vision Simulator は、このリストの中で最も印象的な色覚異常シミュレーターです。色覚異常の人が見るのとまったく同じように Web サイトや画像を表示するのに最適なだけでなく、他のすべてを彼らの目を通して見るのにも最適です。
Chromatic Vision Simulator は、携帯電話のカメラを使用して、色覚異常のリアルな表現をリアルタイムで作成します。ビューポートには 4 つのオプションがあります。 1 つは正常な視覚用で、他の 3 つのオプションはさまざまな色覚異常を表示するためのものです。下部のボタンを使用してそれらを切り替えると、さまざまな目で世界を見ることができます。
このアプリを非常に強力にしているのは、これらのビューをどのように組み合わせて一致させることができるかです。たとえば、ノーマル ビューとプロタノピア ビューの両方を同時にアクティブにして、2 つを比較できます。すべての色覚異常者と同じように、各ビューイングをアクティブにして周囲の世界を見ることもできます。
ダウンロード: 色覚視覚シミュレータ Android | iOS （無料）
オペレーティング システムでの色覚異常ユーティリティの使用
あなたまたはあなたの知人が色覚異常を持っている場合、オペレーティング システムをより色覚異常に対応するために使用できるツールがあります。これには、色覚異常を持つ人が各色をよりよく区別できるように色を調整することが含まれます。
すべてのオペレーティング システムにこの機能があるわけではありません。ただし、Windows 10 を使用している場合は幸運です。確認する 色をより適切に区別できるように Windows 10 を調整したガイド.
この機能により、色覚異常のある人が選択できるようになります... 属性 それは自分のニーズに合っているので、何色かを判断するのに苦労する必要はありません。何よりも、このフィルターは、Web ページや画像など、画面に表示されるすべてのものにも影響します。
視覚障害者の生活を楽にする
ビジュアル メディアを作成して生計を立てている場合は、色覚異常について、また色覚異常に影響を受ける人々に自分の作品がどのように認識されるかについて考えてみるとよいでしょう。幸いなことに、これを実現するために特別なツールは必要ありません。ウェブサイトを使用するかアプリをダウンロードするだけで、あなたのクリエイティブなデザインを他の人の目を通して紹介することができます。
上記のツールが役に立たない場合は、必ず次のツールを試してください 高齢者に役立つ方法.
