アクセス可能な無効状態
アクセシビリティ色のコントラスト要件を満たす無効または非アクティブなボタンまたはタブのベストプラクティスはありますか？
淡色表示の処理が最も一般的であるようですが、淡い灰色の灰色は、色覚異常または視覚障害のあるユーザーのアクセシビリティ要件を満たしていません。
ハイコントラストを維持しながら、明らかに無効化/無効化されている一般的な一般的な治療法はありますか？
試すことができるいくつかの戦略があります。
- ホバーリングまたはクリック時のスタイル変更を削除して、何かがインタラクティブでないことを示すことができます
- スタイルの装飾（境界線、影など）を削除して、他のアクティブなUI要素とは異なる状態を示すことができます
- プロンプトまたはツールチップを表示して、コンポーネントが非アクティブである理由を示すことができます
- ステータスインジケーターバッジ/アイコン/ラベルを使用できます
おそらく上記の戦略の組み合わせが最良の効果を生み出しますが、それはアプリケーションの設計スタイルと相互作用パターンに依存します。
ユーザーがUI要素にカーソルを合わせる必要があるソリューションには注意してください。これらはタッチベースのUIでは機能しません。
探索するいくつかの追加の視覚的戦略：
- UIでインタラクティブな要素が少ない場合は、アクティブと非アクティブの両方のUI要素のコントラストを上げます（たとえば、アクティブな要素には明るい色の背景、非アクティブな要素には明るい灰色の背景）。
- ラベルは読み取り可能なままにしておきますが、それに付随する装飾や入力ウィジェットは読み取らないようにしてください。たとえば、チェックボックスやボタンの装飾を好きなだけグレー表示にして、ラベルをアクセシビリティのガイドライン内に保つ
ただし、次の点に注意してください（ Web Content Accessibility Guidelines 2. から）：
色だけを使用して必須フィールドを示すことはできません。この問題は、次の十分なテクニックを用いて達成基準1.4.1（色の使用）で対処されています。
- G122：色の手がかりが使用される場合は常にテキストの手がかりを含める
- G14：色の違いによって伝えられる情報がテキストでも利用できるようにする
Web UIの場合、フォーム要素のラベルの横に「（無効）」を追加するなど、無効にするフォーム要素を示す追加のキューが必要です。これはCSSスタイルシートで実現可能であり、メニューにオプションを提供することで、ユーザーに「ハイコントラスト」バージョンのWebサイトに切り替えることを許可できます。
UIツールキットを作成している場合は、少なくともウィジェットが無効になっているかどうかをプログラムで確認する方法や、ツールキットが無効になっているウィジェットの表示方法を変更できるようにするメソッドを提供する必要があります。