色覚異常シミュレーター&チェッカー
ガイド
色覚異常シミュレーター&チェッカー
画像やカラーパレットが色覚異常を持つ人にとってどのように見えるかを確認します。8種類の色覚異常をシミュレートし、WCAGコントラストコンプライアンスのためにデザインをテストして、すべてのユーザーにとってアクセスしやすいことを確認します。
使い方
画像やカラー値を入力してシミュレートします。色覚異常のタイプを選択して、影響を受けたユーザーにデザインがどのように表示されるかを確認します。コントラストチェッカーを使用して、カラーコンビネーションがWCAGアクセシビリティ標準を満たしていることを確認します。
特徴
- 8種類の色覚異常シミュレーション – 1型色覚異常、2型色覚異常、3型色覚異常、1型色覚鈍麻、2型色覚鈍麻、3型色覚鈍麻、全色盲、および色弱
- 画像シミュレーション – 画像をアップロードして、さまざまなCVDの視点から表示します
- カラーパレットテスト – 各タイプで個々の色とパレットがどのように表示されるかを確認します
- WCAGコントラストチェッカー – 前景色/背景色の組み合わせがAAおよびAAA基準を満たしていることを確認します
- サイドバイサイド比較 – 元のビューとシミュレートされたビューを比較します
- クライアント側処理 – 画像はブラウザに保存されます
よくある質問
-
色覚異常の原因と一般的な原因は何ですか?
色覚異常(色覚欠損)は通常、X連鎖劣性遺伝によって遺伝します。そのため、男性の約8%に影響がありますが、女性ではわずか0.5%です。この状態は、網膜の錐体細胞の1種類以上が欠損しているか機能不全の場合に発生します。3種類の錐体は、赤(長)、緑(中)、青(短)の波長に反応します。ほとんどの色覚異常を持つ人は、文字通り色に「盲」ではなく、区別できる色相の範囲が狭いと認識しています。
-
1型色覚異常、2型色覚異常、3型色覚異常の違いは何ですか?
これらは、3種類の色盲(1種類の錐体細胞が完全に欠如している状態)です。1型色覚異常は赤に敏感な錐体を欠いており、赤が暗く見え、緑と区別できなくなります。2型色覚異常は緑に敏感な錐体を欠いており、同様の赤緑の混乱がありますが、暗くは見えません。3型色覚異常は青に敏感な錐体を欠いており、青と黄色の混乱を引き起こします。1型色覚異常と2型色覚異常ははるかに一般的ですが(それぞれ男性の約2%と6%に影響)、3型色覚異常はまれです(人口の約0.01%)。
-
色覚アクセシビリティのためのデザインが重要なのはなぜですか?
世界中で約3億人が何らかの形の色覚異常を持っています。情報が色だけで伝えられる場合(エラーの場合は赤、成功の場合は緑など)、これらのユーザーは重要なフィードバックを見逃す可能性があります。アクセシブルなデザインは、アイコン、パターン、ラベル、十分なコントラストなど、複数の手がかりを使用します。WCAGガイドラインは、テキストに対して最低4.5:1のコントラスト比を推奨しており、情報を伝える唯一の手段として色を使用しないことを推奨しています。
恵 スコアボードが到着しました!
スコアボード ゲームを追跡する楽しい方法です。すべてのデータはブラウザに保存されます。さらに多くの機能がまもなく登場します!
