スライダーとアクセシビリティ：障害を持つユーザーのためのスライダーの使いやすさ
スライダーを使用すると、障害を持つ人々が値を選択することが難しくなるのではないかと思っていました。彼らのためにドラッグアンドドロップするのはどれくらい難しいですか？別の要素を移動しているときに値の変化を確認したり、特定の値を選択したりするのはどのくらい簡単ですか。
スライダーは拡張機能であり、データ入力の代わりではありません。モータースキルに問題のある人は、スライダーに問題がある可能性があるため、キーボードから手動で入力値を入力できるようにする必要があります。これには、値フィールドを表示してフォーカス可能にする必要があります。
マークアップはデフォルトで入力フィールドを生成するはずです：
Value:
[50% ]
次に、JSを使用して、スライダーを追加することでこれを「強化」します。これにより、テキストフィールドが更新されます（逆に、テキストフィールドを手動で更新すると、スライダーが更新されます）。
Value:
>========||========< [50% ]
HTML5には、スライダーとしてレンダリングされるrange入力タイプが含まれていることに注意してください。ただし、現時点では、その特定の入力にアクセスできるかどうかは完全にはわかりません。参照をプルアップしてみましたが、特にアクセシビリティに対処するrange入力への参照が見つかりません（誰かがリンクを持っている場合は、共有してください！）
悪いコンポーネントや良いコンポーネントはありません。実装によって異なります。一般的に、スライダーはあまりアクセスしにくいUIコンポーネントですが、もっと良くすることができます。
スライダーのアクセシビリティについて考えるとき、私は WAI-ARIA 仕様から始めます。これは、Ajax、HTML、JavaScriptおよび関連テクノロジーで開発されたUIコンポーネントのアクセシビリティを向上させる方法を指定します。 WAI-ARIA 1.0オーサリングプラクティス のコメント：
スライダーは、ユーザーが指定された範囲内から値を選択するユーザー入力です。スライダーには通常ボタンがあり、移動するとスライダーの現在の範囲内で現在の値が変更されます。ボタンはキーボードでアクセスできる必要があります（フォーカス可能で操作可能）。通常、矢印キーなどの方向キーを使用して、現在の値に加算または減算することができます。
- → （右矢印）と ↑ （上矢印）スライダーの値を増やします。
- ← （左矢印）および ↓ （下矢印）スライダーの値を減らします。
- Home そして End スライダーの最小値と最大値に移動します。
- Tab スライダーに出入りします。
- Page Up そして Page Down 必要に応じて、スライダーを指定された量だけ増加または減少させます。
だから、私の推薦-あなたがスライダーが必要だと思うなら、それを使ってください、しかしそれをアクセス可能にしてください。そしてもちろん、テストテストテスト。