障害を持つ人々があなたのウェブサイトにアクセスできるようにする方法

開示: あなたのサポートはサイトの運営を維持するのに役立ちます!このページで推奨する一部のサービスについては、紹介料を稼ぎます.


ワールドワイドウェブコンソーシアム(W3C)によると、ウェブはテクノロジーを使用して、障害の影響を受ける人々に、これまでにないレベルの筆記、オーディオ、ビデオコンテンツへのアクセスを提供するユニークな機会を表しています。教育、雇用、政府、ビジネス、ヘルスケア、エンターテインメントサービスの急増により、アクセシブルなWebサイトの設計は重要な問題であり、障害者が障害のない私たちのサービスに平等にアクセスできるかどうかが決定されます.

場合によっては、アクセシビリティを提供する理由は法的領域にまで及びます。たとえば、米国連邦政府によって開発または購入されたすべてのウェブサイトが障害者に平等なアクセスを提供することを要求する本に関する法律があります。国連も同様のガイドラインを作成しました。さらに、一部のWebサイトは裁判所によって米国障害者法(ADA)に準拠するよう要求されており、現時点ではすべての教育機関がアクセス可能なWebサイトを持つことをお勧めします.

Webによって可能になった障害者へのメリット、および特定の最小アクセシビリティ基準を満たさないWebサイトに直面する可能性のある法的影響を考慮して、W3Cを含むいくつかの組織は、Webサイト設計者が適用できる基準を開発しましたすべての訪問者がWebサイトの情報と機能を最大限に活用できるようにする.

アクセシブルなウェブサイトを作成するためのヒント

障害を持つ人々は、支援技術を使用してWebサイトにアクセスすることがよくあります。アクセシブルなWebサイトは、支援技術で適切に機能するように設計されているため、Webサイトの基本である情報と機能は、すべての訪問者がアクセスできます。.

色覚異常などの場合には、支援技術は使用されません。代わりに、これらの訪問者がアクセスできるWebサイトは、Webサイトを設計するときにこれらの問題を考慮し、視覚要素を適切に使用します.

つまり、W3Cによれば、「Webアクセシビリティとは、障害のある人が障害を問わず、Webを使用できることを意味します」(出典)。そのアクセスレベルに到達することは、W3Cから現在適用可能な標準であるWebコンテンツアクセシビリティガイドライン(WCAG)2.0の目標です。.

アクセシビリティを念頭に置いてプロジェクトを開始する

アクセシブルなWebサイトを構築する最初のステップは、障害を持つ人々がWebにアクセスする方法を理解することです。 W3Cは、実際のWebユーザーのストーリー、Webユーザーの多様性の探求、ユーザーがWebにアクセスするさまざまな方法のディスカッションを含むリソースをまとめました。これらのリソースを確認すると、障害を持つ人々がWebをどのように使用しているかが明確にわかります.

ウェブアクセシビリティのコンポーネントについて考えることも重要です。設計者は、アクセシビリティの考え方を、設計する視覚要素と作成するコードに制限したくなるかもしれませんが、パズルの他の部分、特に、アクセシビリティを強化するために使用される支援技術やソフトウェアなど、およびそれらの方法を理解することが重要です。ウェブデザインに知らせる.

プロジェクトが開始され、オーサリングツールが選択されたら、アクセシビリティに留意してください。すべてのテーマ、ウィジェット、プラグインがウェブサイトの訪問者に同等のアクセシビリティを提供するわけではありません。これらのさまざまなツールによって作成されたWebサイトのアクセシビリティは、オーサリングツールが選択されるときに考慮される基準の1つである必要があります.

最後に、プロジェクトを開始する前に、WCAG 2.0で行われた推奨事項を確認してください。このドキュメントの推奨事項に従うことで、Webサイトのコンテンツが認識可能で、操作可能で、理解可能で、堅牢であることを確認できます。.

HTMLを適切に構成する

アクセシブルなWebサイトを作成するときに重要なことの1つは、セマンティックHTMLを適切に使用することです。ここにあなたを始めるためのいくつかのヒントがあります:

  • 画像の代替テキスト(代替テキスト)を提供する:スクリーンリーダーは代替テキストを読み上げるので、わかりやすくします。テキストを読むことは、画像を表示することと同じ意味を伝える必要があります.
  • ヘッダータグを正しく使用する:スクリーンリーダーはヘッダータグに注意を払い、情報の重要性とページ上のコンテンツの構造に関する手掛かりとしてそれらを使用します。見出しレベルをスキップしないでください。また、順序どおりに使用しないでください。.
  • アクセシブルなフォームを作成する:各入力フィールドにわかりやすく配置されたラベルを使用し、ラベルタグまたはARIAプロパティを使用してラベルを入力フィールドに関連付けます.
  • テーブルを適切に使用する:以前は、Webサイトのレイアウトにテーブルを使用するのが一般的でした。ただし、スクリーンリーダーは、データを含むテーブルとレイアウト目的で使用されるテーブルを区別できません。その結果、不適切に使用されたテーブルは、スクリーンリーダーを使用している訪問者に不必要な複雑さと混乱を引き起こします。.

ビジュアルコンテンツの操作

視覚障害のあるユーザーがアクセシビリティを失わないように、視覚要素を慎重に検討する必要があります。このようなユーザーは、特別な高コントラストWebブラウザー、スクリーンリーダーを使用するか、CSSスタイルを視覚的な障壁を取り除くように設計された一連のルールに置き換えることで、Webサイトにアクセスすることがよくあります。視覚障害者へのアクセスを最大限に提供するサイトを作成するには、以下のヒントを検討してください.

情報を伝えるために色だけに依存しない

必須フィールドを識別するために色を使用するフォームは、色覚異常の訪問者やスクリーンリーダーを使用する訪問者にとって問題になります。同時に、他のユーザーは、色を使用して情報を伝えることで大きなメリットを得ます。要点は、色を使用する必要があることですが、重要な情報を伝える他の方法も使用する必要があります.

重要な情報を提供するためにCSSを使用しないでください

一部のWebブラウザーには、訪問者が独自のスタイルシートを作成するオプションがあり、WebサイトのCSSファイルによって提供されるスタイルをオーバーライドします。 Webサイトを作成するときはこのことを念頭に置き、すべての重要な情報と機能がCSSファイルとは別に配信されるようにしてください。 CSSを使用してコンテンツを作成および配信する能力が高まるにつれて、障害を持つ人々がアクセスするための障壁が高まります。革新的なデザインが訪問者の一部を残さないように注意してください.

オーディオおよびビデオコンテンツに代わるものを提供する

今日のウェブは、ポッドキャストやビデオなどのリッチメディアを多用しています。この種のコンテンツを使用する場合は、視覚的および聴覚障害を持つ訪問者に代替テキストを提供してください。つまり、書き起こされたトランスクリプトはビデオとオーディオの両方のコンテンツで利用できるようにし、キャプションはすべてのビデオで利用できるようにする必要があります。.

説明リンクテキストを使用する

スクリーンリーダーを使用している訪問者は、リンクのテキストに基づいて、リンクの先を決定します。結果として、「続きを読む」などのリンク、または代替テキストを提供しない画像上のリンクには、これらの訪問者はアクセスできません。テキストリンクには、「私たちについて” のではなく “続きを読む」。このリンクは理解しやすく、音声認識ソフトウェアを使用している訪問者にとって覚えやすく、繰り返しも簡単です。.

動的コンテンツを使用する場合の注意事項

現在、事実上すべてのWebサイトがJavaScriptやその他のテクノロジーを使用して、双方向性と機能性を追加しています。ただし、動的コンテンツはスクリーンリーダーに問題を引き起こす可能性があり、キーボードのみのユーザーはページオーバーレイに閉じ込められる可能性があり、開発プロセス中にアクセシビリティを考慮しないと他の問題が発生する可能性があります.

ARIAの役割について学び、使用する

Web Accessibility Initiative Accessible Rich Internet Applications(WAI-ARIA)勧告は、動的コンテンツをよりアクセスしやすくするためにWebサイト開発者を支援するように設計されたW3C仕様です。 ARIA仕様全体は開発者による真剣な調査に値しますが、HTMLを作成する人は、HTML要素に割り当てることができる新しいrole属性とaria-label属性について学ぶために時間をかける必要があります。これらの属性は、特定の障害を持つ訪問者が動的なWebサイトをナビゲートするのに役立ちます.

キーボードだけを使用して訪問者の機能を保持する

運動障害のある人は、マウスを効果的に使用するために必要な精度でマウスを操作できないことがよくあります。その結果、彼らはキーボード、特別なキーボードオーバーレイ、またはWebへのアクセスを容易にするように設計された他のデバイスでWebにアクセスします。ただし、複雑なメニュー、スライドショー、ポップアップ、マウスオーバー操作が必要なアイテムなどの特定のWebコンテンツには、これらの訪問者はアクセスできません。このシナリオを回避するために、Web開発者は、サイトを使用するために必要な対話を設計するときに、キーボードのみのサイト訪問者を考慮する必要があります.

アクセシビリティの確認

サイトのアクセシビリティを監査するために使用できるさまざまなツールとリソースがあります。開始するのに適した場所は、W3Cが提供するEasy Checksのリストです。このリストを確認すると、alt-textのない画像、見出しが欠落しているか順序が正しくない見出し、一般的な色のコントラストの問題など、最も一般的な問題がわかります。.

Easy Checksを実行した後、サイトのアクセシビリティの問題を監査するために利用できる無料および有料のツールのいくつかを使用することを検討する必要があります。 W3Cは、アクセシビリティテストツールの有用なリストをまとめました。アクセシビリティの確認の詳細については、「アクセシビリティ評価リソース」ページをご覧ください。このページには、アクセシビリティの監査とテストに役立つ多くの追加リソースがあります。.

追加のリソース

Webアクセシビリティについてさらに詳しく知りたい場合は、追加の教育、チュートリアル、ツール、およびその他のリソースを見つけることができる場所がいくつかあります。ウェブサイトのすべての訪問者のアクセシビリティを確保するために取り組む際には、以下の組織をお勧めします.

W3C Web Accessibility Initiativeは、アクセシビリティ標準とガイドラインの開発を推進している組織の1つです。 WAIの詳細については、WAIホームページを参照し、無料のアクセシブルデザインチュートリアルを完了し、アクセスできないWebサイトを改善してアクセシビリティガイドラインに合わせるために必要な変更の例を参照してください。.

Googleでは、無料のウェブアクセシビリティ入門コースも提供しており、アクセシブルなウェブサイト構築の基本を学び、Chromeウェブブラウザのアクセシビリティツールを使用してサイトのアクセシビリティをテストする方法を示します。.

ワシントン大学は、印刷して必要に応じて参照できる30のWebアクセシビリティヒントのリストをPDF形式でまとめました。このリストは、アクセシブルなWebサイトを作成するためのすべての基本的なガイドラインをカバーしており、アクセシブルなWebデザインのすべての基本的なテナントの記憶をすばやくリフレッシュするための良い方法です。.

WebAIMは、Webをよりアクセシブルにすることを専門とするもう1つの組織であり、次のツールやシミュレーションなど、さまざまな障害について学習するための多くの役立つリソースを提供しています。

  • セクション508のチェックリスト:この有用なチェックリストは、設計がセクション508の要件に準拠していることを確認するのに役立ちます。.
  • WCAG 2.0チェックリスト:目標がWebコンテンツアクセシビリティガイドライン(WCAG)2.0に準拠することである場合、このチェックリストは、設計が標準に準拠していることを確認するのに役立ちます.
  • カラーコントラストチェッカー:フォントの色と背景色を入力するだけで、2つの間のコントラストがWCAG基準を満たしているかどうかを判断できます.
  • スクリーンリーダーシミュレーション:スクリーンリーダーを使用する訪問者がこのシミュレーションでWebを体験する方法を理解する.
  • 低視力シミュレーション:このシミュレーションでは、緑内障、白内障、黄斑変性症などのさまざまな視覚障害の影響を模倣した方法でウェブサイトを表示できます.
  • ディスレクシアシミュレーション:この簡単なエクササイズは、ディスレクシアで試して読むことがどのようなものであるかを理解し、影響を受ける訪問者がWebをナビゲートする際に直面する課題をより深く理解することができます。.
  • 注意散漫シミュレーション:このシミュレーションは、注意散漫に苦しむことの影響の感覚を与え、注意散漫を減らすように設計されたWebサイトの価値を評価するのに役立ちます.
Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map