web-dev-qa-db-ja.com

優れたアクセシビリティのための最大コントラスト比

そのため、エンタープライズアプリをゼロから作り直しています。今回は、適切な調査に基づいて設計を決定します。

私たちのユーザーは、UXの高い要件でアプリを24時間年中無休で使用しています。したがって、私たちの主な目標は、すべてをできるだけ使いやすく、アクセスしやすくすることです。

以前は、アプリに「日テーマ」(デフォルトは明るい色)と「夜テーマ」(別名「暗いテーマ」、夜に働く人向け)の2つのカラーテーマがありました。今回は、「日」、「夜」、「高コントラスト」の3つのテーマ(別名「アクセシビリティテーマ」)を使用します WCAG2.1 準拠私たちはできる。

「日」のテーマ(WCAGレベルAA)と「高コントラストのテーマ」(WCAGレベルAAA)はすべて問題ありませんが、「夜」のテーマにはいくつか問題があります-WCAGレベルAAは「方法」夜間の作業ではコントラストが強すぎる(「明るすぎる」、「目が悪い」)。

私たちは他のいくつかの標準とガイドラインをチェックしましたが、それらはすべて最小要件について話し、最大については決して話しません。

新しくリリースされたmacOS「ダークモード」のガイドライン 状態

カスタムの前景色と背景色については、7:1のコントラスト比を目指してください。この比率により、デスクトップティンティングがアクティブな場合を含めて、フォアグラウンドコンテンツがバックグラウンドから目立つようになります。また、コンテンツがより厳格なアクセシビリティガイドラインを満たしていることも保証します。少なくとも、色間のコントラスト比が4.5:1以上であることを確認してください。

それは私たちが私たちの夜のテーマでやろうとしていることとうまく合います。 マテリアルデザインガイドラインの推奨事項 および Windowsデザインガイドライン にも合格しています。

たとえば、Adobe Photoshopの最も暗いカラーテーマでは、小さいテキストとボタンの比率が4:1未満になることがあります。

それで私の質問は、夜間の作業で対照的に「最大上限」を設定する既知の調査または標準はありますか?多分コントラストが高すぎることのいくつかの健康への影響?コントラストを最大化しない他のいくつかの理由

10
exp

一般にコントラストが良い

昼間でも夜間でも、コントラストの上限に関する一般的な基準はありません。一般に、コントラストが高いほど、どちらの場合も読みやすくなります(Parker&Schaff、1998; Zuffi、Brambilla、Beretta、&Scala、2007)。したがって、UIは2つの独立した次元を持つことができます。昼対夜、低対高コントラストです。高コントラストは、昼間モードでも夜間モードでもWCAG AAAに準拠しています。

過度のコントラストに関するユーザーの不満は慎重に扱います。低コントラスト(濃い灰色のフォント)が最近多くのWebサイトでファッショナブルになったことを考えると、ユーザーは実際には読みやすくなるというよりは、クールでモダンに見えるので、ユーザーがより好むかもしれません。

コントラストとディスレクシア

私が聞いた高コントラストに関する唯一の懸念は(そして実際に低コントラストモードを使用する唯一の理由)は、失読症のレポートレターを使用する一部の個人が高コントラスト設定(Rello、Kanvinde、およびBaeza-イエーツ、2011)。ただし、効果は十分に確立または理解されておらず(O’Brien、Mansfield、およびLegge、2000など)、かなりの個人差があるようです(Rello、Kanvinde、およびBaeza-Yates、2011)。ユーザーにコントラストを選択させることをお勧めします。連続的にスライダーを使用することもできます。 JonWとのコメント交換では、ユーザーは恐ろしい色の組み合わせを選択できるのは正しいですが、スライダーの範囲をWCAG AAAレベルとAAレベルの間の範囲に制限すると、ユーザーはそれほど悪くすることはできません。障害のある人は、コントラストと(微妙な)色さえ選択しても問題ないようです(Gregor&Newell、2000)。

したがって、WCAGの制限内でコントラストをユーザーが調整できるようにすることをお勧めしますが、デフォルトでハイコントラストにし、コントラストスライダーの調整方法に関するインラインドキュメントを提供することをお勧めします(「アクセシビリティ:文字が最も見やすくなるまでスライドします。動いていないように見える」)。

たぶん問題はナイトモードです

さて、ナイトモードについて。あなたはあなたの使用環境を説明していませんが、みんなのためにlight-on-darkフォントは夜にテキストを読みやすくしません。ダークオンライトは、明るいまたは暗い条件で一貫して読みやすくなります(Buchner&Baumgartener、2007; Dobres、Chahine、およびReimer、2017)。これにはいくつかの理論がありますが(Scharff&Ahumada、2003)、暗闇での使用を目的として設計された最新のコンピューターフォントにまで及ぶ可能性があります。いずれにせよ、明暗のコントラストが強すぎるというユーザーの不満は、明暗自体が読みにくいという不満であり、コントラストの問題ではない可能性があります。

ナイトモードの目的は、その他すべてを夜間に見やすくすることです。つまり、デバイスから照射される光の量を減らすことで、ユーザーは他のものを見るために暗い順応を維持します。デバイスを使用しているときにユーザーが暗いオブジェクトを操作していない場合は、周囲の照明に関係なく、ライトオンダークは必要ありません。

ユーザーが暗い順応を維持する必要がある場合でも、ディスプレイからの光を減らすために他の方法を検討する必要があります。たとえば、読みやすい明暗のテキストを維持しながら、ディスプレイを物理的に暗くしたり、物理的な減光フィルターを配置したりすることもできます。ただし、ディスプレイの照明を減らすために何かを行うと、ディスプレイの読みやすさが低下することに注意してください。暗い順応のために人間の目が拡張すると、特に高齢者の場合、焦点を合わせるのが難しくなります。あなたの場合、トレードオフの価値があるかどうかを判断する必要があります。

参照

Buchner&Baumgartner、2007。 テキスト–背景の極性は、周囲の照明や色のコントラストに関係なくパフォーマンスに影響します 。人間工学、50、1036-1063。

Dobres、Chahine、およびReimer、2017年。 周囲の照明、コントラストの極性、文字サイズが一目でわかるようなテキストの読みやすさに及ぼす影響 。 Applied Ergonomics、60、68-73。

Gregor&Newell、2000。 一部の失読症者が遭遇する問題の一部をコンピューター技術を使用して軽減できる方法の経験的調査 。バージニア州アーリントンの支援技術に関する第4回国際ACM会議の議事録。

O’Brien、Mansfield、&Legge、2000。 失読症における読影速度に対するコントラストの影響 。 Vision Research 40、1921–193。

Parker&、Scharff、1998年。 グラフィカルユーザーインターフェイスのコンテキストでのテキストの読みやすさに対するコントラスト感度の影響

Rello、Kanvinde、およびBaeza-Yates、2011年。 失読症のアクセシビリティを向上させるWebテキストおよびWebサービスのレイアウトガイドライン 。フランス、リヨンのWebアクセシビリティに関する国際分野横断会議の議事録。

Scharff&Ahumada2003。文字識別のパフォーマンスは、正のコントラストよりも負のコントラストの方が優れています。 Vision Sciences Society Annual Meeting、サラソタフロリダ

Zuffi、Brambilla、Beretta、&Scala、2007。 Human Computer Interaction:Legibility and Contrast 。画像分析と処理に関する第14回国際会議(ICIAP 2007)。

9

WCAGには最大のコントラストはありません。背景と前景の情報(オーディオまたは通常は視覚的)の違いを処理するのが困難なユーザーに焦点が絞られているためです。

私が知っている絶対的な最高のコントラスト比は21:1で、これは白黒です(コントラストは前景と背景ではなく、最も暗い色と最も明るい色です)。したがって、AAAコンプライアンスを遵守しようとする場合、移動する十分な余地があります。と、16進数のカラーパレット全体で約280兆を超える色の組み合わせ。

通常、夜間に発生するのはコントラストの問題ではなく、明るさの問題です。暗い色と一緒に使用される明るい色は、より多くポップする傾向があり、これは低光(夜)シナリオで特に当てはまります。明るさは通常、アプリではなくビジュアルディスプレイユニット(VDU)またはデバイスのドメインですが、色を薄くして見かけの明るさを下げることができる場合があります(または、デバイスの明るさを実際に変更する方法はありますか?開発者にとっては1つかもしれません)。

見かけの明るさを下げると、実際の明るさを下げるのと同じような効果が得られるので、カラーパレットをいじるのが最良のオプションかもしれません。

4
Karl Brown

これは、いくつかの実証的な実験によるデザインほど公式の研究ではありませんが、 Solarized は非常にうまく機能します。明るいテーマと暗いテーマの両方を持ち、コントラストが低くコントラストが強いようにデザインされています。

私はそれを数年間使用しており、自分自身がこれを使用していないことはありません。同僚がいてライトが点灯している日中は素晴らしいですし、タイマーがライトをオフにする夜は素晴らしいです。 (私はオープンコンセプトのワークスペースでの消灯タイプです:-/)

0
studog