メインコンテンツまでスキップ
pdf?stylesheet=default
Blackboard Help

  男性の12人に1人、女性の165人に1人が何らかの色覚障害を
             訴えています。1

私たちの多くは、色スキームや色の手がかりが学習の中で果たす力や意義を理解しています。私たちの多くには、colored_mouse_three_teal.png特定の色の好みがあります。すべての受講者にコンテンツへのアクセシビリティを確保するための色スキームを考案する際、唯一配慮する必要があるのが色覚異常です。

色は、人や使用中のコンピュータ、モニタ、オペレーティングシステム、またはブラウザによって表示が異なります。自分が選択したとおりの色を誰もが見ているという確信は持てないので、他の人に見える色を確認するために、いろいろなコンピュータやブラウザ上でコースを表示させてみてください。

色に関する主な考慮事項

  • 一貫した色スキームを使用します。パレットは5色以内にしてください。同じ色相で濃淡を変え、1色または2色をアクセントとして使うとうまくいきます。
  • 背景には明るい色を選択します。背景が白、テキストが濃い色というのが最も読みやすい組み合わせです。白以外の背景を使用する場合は、コントラストを最大にするために明るい色を選択します。ページに暗い色や鮮やかな赤、緑、黄色などを使うのは避けてください。読みづらく、目が疲れます。
  • 色は慎重に使用し、強い色は控えめに使います。たとえば、黄色に黒だと色同士のコントラストが強いので色の組み合わせとしては良いとされます。でも、ページ全体としてはどうでしょうか。代わりに、黒と黄色の組み合わせを情報チャートなどページの一部で注意を引くために使用してください。
  • 訪問済み、アクティブ、スタティックの3つのリンクステータスを色分けします。これらの色は、コース全体を通して一貫性を保ちます。リンクは、白の背景で見やすい程度に暗い色にします。
  • 赤と緑、青と茶色は一緒に配置しないようにします。これらの色の組み合わせは、色覚障害を持つ人々にとって区別するのが困難です。
  • 重要情報を伝える際に、色だけに頼らないでください。重要なテキストは、太字で強調するか、横にアスタリスク(*)を付けるか、強調タグを使用して目立たせます。色付き画像にALT属性を使用して、色に依存する情報の伝達を支援します。

調和のとれた色の組み合わせ

関連付けられているテキストを示す画像   単色

単色の色スキームでは、1色だけを使用します。1色の異なる値を使用して、異なる色の感覚を創出できます。単色の色スキームは調和がとれて平和であり、洗練された感覚をもたらします。1色のみの使用は統一感をもたらし、物事を結びつけるのに役立ちます。

関連付けられているテキストを示す画像   相似色

相似色の組み合わせでは、関連する色を使用します。相似色スキームは、カラーホイール上で隣り合った色を使用します。このような色同士は、通常よくマッチし、穏やかで快適なデザインを生み出します。自然界に多く見られ、調和がとれていて目にも楽しい組み合わせです。青と紫、赤とオレンジなどの選択が相似色スキームを生成します。

関連付けられているテキストを示す画像   コントラスト

コントラストが高い色は相補的であり、目にも楽しくなります。反対色は、コントラストの高い色スキームを生成します。たとえば、黄色と紫、赤と緑はコントラストの高い色です。コントラストの高い色スキームは、一般に暖色と寒色を使用します。

関連付けられているテキストを示す画像   3色

3色の組み合わせは、3つの相対する色で構成されます。3色スキームでは、カラーホイールの中で均等な間隔にある色を使用します。赤、黄、青が3色スキームになります。

 

ソース:1http://www.indiana.edu/~pedagogy/pre...hapter6etp.pdf