クレジット：
クレジット：
Web には、視覚障害のあるユーザー向けに Web サイトをデザインする方法に関するヒントがたくさんあります。そのほとんどは、スクリーン リーダーが Web サイトにアクセスできるようにすることを目的としています。しかし、上記の数字を見ればわかるように、大きな中間点が存在します。視覚障害のある人の大多数は、法的に盲目であるとみなされる人であっても、画面読み上げソフトウェアを必要とせず、使用しません。しかし、Web は依然として、はっきりと見えない場合、ナビゲートするのが難しくて面倒な場所である可能性があります。
ここでは、視覚障害のあるユーザーがサイトをよりアクセスしやすくするためのヒントとテクニック、およびそれらが重要である理由をいくつか紹介します。
1. 拡大テキストを考慮する
クレジット：
多くの場合、ユーザーが必要とするのは単にテキストを大きくするだけです。より大きなフォント サイズの代替スタイルシートを提供することを検討し、ブラウザでテキストのみのズームが有効になっているときにレイアウトが崩れないようにしてください。視覚障害のあるユーザーの多くは、サイト レイアウト全体の縮尺を変更せずにテキストを拡大したいと考えますが、その場合、長い行にわたるテキストのスクロールや追跡が困難になる可能性があります。
サイトのターゲット市場によっては、デフォルトのフォントを数ポイント大きくすることも検討できます。また、記事や大量のテキストを公開する場合は、テキストのみのバージョンを提供することをお勧めします。その後、テキストを好きなように操作します。
2. コントラストが鍵
クレジット：
網膜色素変性症、緑内障、網膜症、白内障などの目の病気（最も一般的な目の病気の一部）はすべて、コントラスト感度、つまり、同じような色合いや明るさのレベルを区別する目の能力の大幅な低下につながります。
しかし、今日のレイアウトは詳細指向であり、多くの場合、微妙なグラデーションや値のわずかな変化を利用して、すっきりとしたモダンで控えめなインターフェイスを作成しています。正常な視力を持つユーザーにとって、これは非常に快適な視覚体験になります。しかし、コントラスト感度に悩むユーザーにとっては、文字通りの頭痛の種となる可能性があります。
要素間のコントラストを高めたサイトの 2 番目のバージョンを提供することを検討してください。低コントラストのアイテムでは読みやすさを高めるために太字のテキストを使用し、非常に細いフォントは避けてください。また、ユーザーがマウスでページの要素を強調表示したり、デフォルトの強調表示動作を変更したりすることを妨げる JavaScript または CSS テクニックは使用しないでください。視覚障害のあるユーザーの多くは、コントラストを高めて視覚的な集中を助けるための簡単な方法としてハイライトを利用しています。
3. アクションアイテムの色に注意する
クレジット：
遺伝性の色覚異常は、男性全体の約 8%、女性全体の約 0.5% がある程度の影響を受けています。さらに、目の病気や怪我 (緑内障や白内障など) が原因で生じる後天性色覚異常もあり、色覚異常ユーザーの総数はさらに増加します。これらのユーザーにまったく異なる配色を提供することが常に実現可能であるとは限りませんが、ほとんどのユーザーは通常これを受け入れます。ただし、色の使用に最大限の注意を払う必要がある場所が 1 つあります。それはアクション アイテムです。ユーザーの注意を呼び、直接的な操作が必要なボタンや通知を作成する場合は、色盲のユーザーが混乱しやすい色の組み合わせ (赤と緑、青と黄色) の使用を避け、これらの要素に明確で目に見えるテキストや図像が含まれていることを確認してください。それは彼らの目的を明確にします。
たとえば、緑色の「送信」ボタンの隣に赤色の「キャンセル」ボタンを配置すると、赤緑色盲のユーザーに視覚的な混乱を引き起こす可能性があります。同様に、一見誤って呼ばれている「青黄色」色覚異常 (後天性色覚異常に多く見られる) を持つユーザーは、緑と青の色合いを区別することができません。
4. デスクトップ ユーザーがモバイル サイトを閲覧できるようにする
クレジット：
Web サイトのモバイル バージョンを提供する場合は、モバイル デバイスのみに限定しないでください。モバイル Web 用に最適化されたレイアウトは、通常、本質的に、より成熟したレイアウトよりも視覚的にアクセスしやすくなっています。多くの場合、要素は簡素化され (したがって拡大縮小が容易になり)、テキストにより重点が置かれ、視覚がぼやけたり、コントラストや色に困難を抱えているユーザーを混乱させる可能性がある全体的な視覚的な混乱が軽減されます。誰でもサイトのモバイル バージョンにアクセスできるようにすることで、開発コストを大幅に増やすことなくアクセシビリティを向上させる簡単な方法となります。
ただし、視覚に問題がある晴眼者には非常に便利ですが、大量の JavaScript と AJAX 機能を利用するモバイル Web サイトは、画面読み取り技術を介して Web にアクセスする必要がある視覚障害のあるユーザーにとっては理想的なソリューションではないことに注意してください。
5. キーボード ショートカットを使用してナビゲーションを支援する
クレジット：
キーボード ショートカットは、スクリーン リーダーを使用している人にとって役立つだけでなく、視覚障害のあるユーザーのサイト ナビゲーションをはるかに簡単にします。キーボード コマンドの追加により、矢印キーといくつかの素早いキーストロークを使用してサイト内を移動できるようになり、画面上でマウス カーソルを追う必要がなくなり、それに伴う視覚的な焦点を移動し続ける必要もなくなりました。これは目の疲れやフラストレーションを軽減するのに大いに役立ちます。視覚障害のあるユーザーの多くは、大型モニター (23 インチ以上) で Web サーフィンをしますが、これにより、特に焦点距離が短い場合、頭と目の動きが大きくなる可能性があります。ユーザーがカーソルを追うのに費やす時間が短縮されるため、紛失しやすい）画面の周囲にあるほど良いです。
Wix.com がサポートするシリーズ
クレジット：
のWebデザイナーシリーズによってサポートされていますWix.com、驚くべきテクノロジーを日常の人々にもたらします。オンライン Flash ビルダーの驚くべきシンプルさを発見し、楽しむ強力なドラッグ アンド ドロップ インターフェイスを使用して美しい Web サイトを作成します。
Mashable のその他のデザイン リソース:
