SaaS Web サイトのアクセシビリティ チェックリスト

公開: 2022-09-29

ウェブサイトのアクセシビリティとは?

Web アクセシビリティとは、すべての人が SaaS Web サイトのコンテンツにアクセスし、消費し、関与できるようにすることです。 アクセシブルな Web サイトとは、ユーザーの身体的または精神的能力に関係なく、すべてのデバイスのすべてのユーザーに対応するものです。

アクセシビリティは、SaaS Web サイトと製品の両方にとって、最新のユーザー エクスペリエンス デザインの重要な部分です。 World Wide Web Consortium (W3C) による Web Content Accessibility Guidelines (WCAG) 2.1 の最新版では、Web コンテンツをよりアクセシブルにするための幅広い推奨事項が取り上げられています。

SaaS Web サイトをアクセス可能にする理由

SaaS ソリューションが最大数のユーザーに到達することを望んでいます。 しかし、何だと思いますか? ターゲット オーディエンスのかなりの部分が、色覚異常、読書困難、聴覚障害などの障害を抱えて生活している可能性があります。

  • WHO によると、何らかの障害を持つ人々は世界人口の 15% を占めています。
  • 米国では成人の 4 人に 1 人、つまり 6,100 万人が障害を持っています。

SaaS Web サイトのアクセシビリティを高めることは、正しいことであるだけでなく、それを怠ると、製品を紹介する前に見込み客を遠ざけることになります。

さらに、SaaS をアクセス可能にしないと、費用のかかる訴訟が発生する可能性があります。

  • 2018 年には、2017 年に比べて連邦 ADA 訴訟が 181% 増加しました。
  • 2020 年と比較して、2021 年の上半期には、Web サイト、アプリ、およびビデオに障害のある人がアクセスできないと主張する訴訟の数が 64% 増加しました。

アクセシブルな Web デザインの 4 つの基本原則

Web コンテンツ アクセシビリティ ガイドラインは、次の 4 つの原則に基づいて構成されています。

  • 知覚可能:視覚障害、聴覚障害、または感覚障害のある訪問者は、(スクリーン リーダー、キャプション、トランスクリプト、またはその他の支援技術を通じて) コンテンツを利用できます。
  • 操作可能:訪問者は、マウスを使用できない人のためにキーボード ショートカットを使用するなど、好みのコントロールで Web サイトを操作できます。
  • わかりやすい: Web サイトのインターフェースは、てんかんや自閉症などの認知障害を持つユーザーにとってわかりやすいものです。
  • 堅牢性: Web サイトはクロスブラウザー、クロスプラットフォームであり、現在の支援技術と互換性があります。

アクセシビリティの WCAG レベル

アクセシビリティ コンプライアンスには 3 つのレベル (A、AA、および AAA) があり、レベル A は満たされた最低限の必需品 (完全にアクセス可能ではない) であり、AAA は最も最適化されたアクセシビリティ レベルです。

  • レベル A:最低限の要件セットを満たすアクセシビリティの最低レベル。 障害のあるユーザーの多くのグループは、そのような Web サイトのコンテンツにアクセスすることが困難または不可能であると感じるでしょう。
  • レベル AA:より高いレベルのアクセシビリティ。 ユーザーのグループによっては、そのような Web サイトの情報にアクセスするのが難しい場合があります。 このレベルに到達すると、障害のあるユーザーが Web コンテンツにアクセスする際の主要な障壁が取り除かれます。
  • レベル AAA:最高レベルのアクセシビリティ。 これらの基準を満たすことで、障害を持つ個人にとって最適なユーザー エクスペリエンスが保証されます。

14 ポイントの SaaS Web サイトのアクセシビリティ チェックリスト

このチェックリストは包括的なものではありませんが、SaaS Web サイトのアクセシビリティとコンプライアンスを向上させるために考慮する必要がある優先要素をカバーしています。

  • H1、H2 などを正しく使用して、明確な HTML ヘッダー構造を確立します。
  • ページ上のハイパーリンクをユーザー フレンドリーにします。
    • インライン リンクのテキストに下線を引き、残りのコンテンツとは異なる色を使用します。
    • 「ここをクリック」ではなく、「無料のアクセシビリティ ガイドをダウンロード」などの説明的なアンカー テキストを作成します。
  • スクリーン リーダーなどの支援技術を使用するユーザーがコンテンツを使用できるように、すべての画像と表に説明的な代替テキストを追加します。
  • 字幕、埋め込みキャプション、または少なくともビデオおよびオーディオ コンテンツに使用できるテキスト トランスクリプトがあることを確認します。
  • 色を慎重に使用する:
    • さまざまな要素 (テキストやボタンなど) と背景の間に適切な色のコントラストを持たせます。
    • ユーザーに情報を伝えるために色だけが使用されていないことを確認してください。
    • パターンやテクスチャを使用して、チャートやグラフなどの視覚的な違いを示します。
  • アクセシブルな書体を選択して、文字を簡単に区別できるようにし、フォントの文字間に十分なスペースを確保します。
  • ページがすべてのブラウザーで期待どおりに機能している間に、テキストのサイズを簡単に変更できる機能を提供します。
  • SaaS Web サイトをキーボード フレンドリーにします。
    • キーボードのキーのみを使用して、マウスを使用せずに Web サイトのすべての部分にアクセスできるようにします。 マウスで実行できるすべての操作は、キーボードでも実行できる必要があります。
    • メニューに必要なカテゴリのみを含め、Web サイトのナビゲーションを直感的かつ簡潔に保ちます。
    • ユーザーが現在選択しているアクティブな要素を特定する目に見えるフォーカス インジケーターを表示します。
  • フォームにアクセスできるようにします。
    • 明確な境界と境界線を定義します。
    • どのデータを入力する必要があるかを説明するために、フォーム要素にラベルを付けます。
    • 必須フォーム フィールドを必須としてマークします。
    • 役立つエラー メッセージを表示します。
  • 時間制限のあるページでは、ユーザーが制限を調整したり、オフにしたりできるようにします。
  • 読みやすさと理解を助けるために、テキスト コンテンツが文法的に正しく、平易な言葉で書かれていることを確認します。 用語集で略語や珍しい単語を定義します。
  • 1 秒間に 3 回以上点滅する要素をページに配置しないでください。
  • セマンティック HTML 要素を使用して、ページ要素の目的を効果的に記述します。
  • 会社のアクセシビリティの目標レベルと、ADA 準拠を達成するための取り組みを示すアクセシビリティ ステートメントを公開します。

厳選された無料のアクセシビリティ評価ツール

Web サイトのアクセシビリティを評価するために使用できる多くの無料ツールの一部を以下に示します。

  • WAVE : 作成者が自分の Web コンテンツを障害を持つ個人にとってよりアクセスしやすいものにするのに役立つ一連の評価ツール。
  • WebAccessibility.com : 全体的な W3C コンプライアンス スコアを 100 点満点で取得すると、SaaS Web サイトが WCAG にどの程度準拠しているかを確認できます。
  • SortSite : Web サイトが WCAG アクセシビリティ基準に照らしてチェックされ、リハビリテーション法第 508 条に準拠していることを確認します。 アクセシビリティ、壊れたリンク、ブラウザ コードの互換性、検索エンジンの最適化、およびその他のユーザビリティの問題をチェックします。
  • aCe by accessiBe : 完全に自動化されたアクセシビリティ ツールで、Web サイトが ADA および WCAG に準拠しているかどうかを即座に正確に判断できます。

このチェックリストは役に立ちましたか? これは、同僚やネットワークと共有できる便利なインフォグラフィック バージョンです。