WordPressサイトのアクセシビリティを改善する10の方法

公開: 2022-03-29
WordPressサイトのアクセシビリティを向上させる10の方法

Webサイトのアクセシビリティは、身体的および状況的な障害や経済的制約に関係なく、誰もがWebサイトを使いやすいようにすることです。 状況に関係なく、サイトでのエクスペリエンスがすべてのユーザーにとってシームレスであることを確認する必要があります。

ウェブサイトのこの側面が修正されていない場合、オンラインページの主要な機能にアクセスできないという理由だけで、ターゲット市場のかなりの数を制限している可能性があります。

主に障害のある人のことを考えるかもしれませんが、もちろん、ここから始めるのが良いでしょう。 Webサイトのアクセシビリティの問題は、次のような一時的な状況に影響を与える可能性があります。

  • 携帯電話やその他の小画面デバイス、スマートテレビ(TV)などを使用してサイトにアクセスする必要があるユーザー。
  • 高齢化によりさまざまな変化する課題を抱える古いウェブサイトの訪問者。
  • 暗い場所でサイトにアクセスするユーザー。 と
  • 低速のインターネット接続を使用しているユーザー、または国や場所が原因で帯域幅が高いユーザー。

対処する必要のある課題の幅広く多様な状況を知ることは、機能するソリューションを作成するのに役立ちます。 以下は、サイトのアクセシビリティを向上させるための重要な方法です。

1.コンテンツを音声で制御可能にする

音声認識は、Webサイトに統合して、コンテンツを音声で制御できるようにする機能です。 これには、フォーム、ボタン、リンク、およびその他のコントロールが含まれます。 マウスやキーボードを使用できないユーザーが音声を使用してサイトで機能を実行できるようにするディクテーションソフトウェアを統合できます。

これを機能させるには、すべてのコンテンツを適切にコーディングおよび設計する必要があります。 さらに、音声コマンドによってどのコントロールがアクティブ化されるかを明確にするために、サイトのソースコードに、視覚的に表現される方法と一致する識別子とラベルが必要です。

2.色の選択に注意してください

世界中の何百万人もの人々が色盲であるため、使用する色はこの現実に注意する必要があります。

さらに、Webサイトの色の比率とそのコントラストを選択するときは注意が必要です。 色のコントラストのオプションは高くする必要があります。たとえば、特定の視覚的な制限がある場合でも、ユーザーがコンテンツを読みやすくするために、白い背景に黒いテキストを使用します。

3.リンクに下線が引かれていることを確認します

下線が引かれていないテキストは下線が引かれているテキストよりも美的魅力があるため、最近多くの人が「リンクに下線を引く」ルールを先取りしています。 これは本当かもしれませんが、あなたのウェブサイトの主な仕事は機能性の仕事です。 これはすべてのことを意味します。 機能を優先する必要があります。

下線を削除すると、ユーザーがカウンターのハイパーリンクされた部分を識別しにくくなります。 それでもコンテンツに下線を付けたくない場合は、コピーの残りの部分からリンクを目立たせる他の方法を検討してください。 これを行うには、色または太字のテキストを使用できます。

4.画像に代替タグを追加します

Webサイトのアクセシビリティを向上させるには、Webサイト上のすべての画像に「altタグ」を追加することを検討する必要があります。

一部のサイトでは、検索エンジン最適化(SEO)戦略の一環として代替テキストを使用しています。画像をできるだけ簡潔かつ最適に説明するために使用する代わりに、スペースを使用して、サイトのランク付けに役立つと思われるキーワードを詰め込んでいます。 明らかに、これは通常、Webサイトの訪問者にとって優れた読書体験にはなりません。また、Webサイトにアクセスできるようにするために、これを避けたいと考えています。

誰かがスクリーンリーダーを介してWebサイトにアクセスしていて、Webサイトのビジュアルコンテンツにaltタグが追加されていない場合、スクリーンリーダーは画像の内容をリーダーに説明できません。 altタグは、スクリーンリーダーソフトウェアに画像の内容と周囲のコンテンツとの関連性を伝えるものです。

サイトの画像に代替タグを追加するには、編集者の右側にある[代替テキスト]フィールドに移動して、画像を説明する短い文を書く必要があります。

5.リンクをわかりやすくする

一部のユーザーは、視覚的な制限のため、音声コマンド技術を使用してサイトをナビゲートする予定です。 サイトの訪問者のこのセグメントはスクリーンリーダーを使用してサイトのコンテンツにアクセスするため、リンクはよりコンテキストに沿ったものにする必要があります。

「続きを読む」などの漠然としたことを言う代わりに、リンクがどこにつながるかをユーザーが正確に把握できるように、リンクをコンテキスト化するための詳細を追加することをお勧めします。 したがって、「もっと読む」のではなく、「詳細を追加して、「ここをクリックして、私たちのチームがどのようにあなたを助けることができるかについてもっと読む」のようなものを読んでもらうこともできます。 このように、スクリーンリーダーを使用しているユーザーは、提供されたリンクをクリックするように求められます。

6.さまざまな画面でフォントサイズをテストします

現在のサイズを変更しないでください。たとえば、パソコン(PC)や携帯電話でテキストがどのように表示されるかをテストするなど、さまざまな画面サイズのさまざまなデバイスからサイトにアクセスして、最適化されていることを確認する必要があります。大画面と小画面の両方に対応。

7.メインコンテンツリンクを追加する

それについて何もしなければ、スクリーンリーダーを使用しているユーザーは、リーダーがWebサイトを一番上から下に向かって読み始めるという理由だけで、サイトで非常に長い時間を費やします。ユーザーが必要とするコンテンツを読み始めるまでに時間がかかる場合があります。読む。

これを解決するには、WordPressサイトを作成するときに、スクリーンリーダーがページのメインコンテンツにスキップできるようにするリンクを挿入する必要があります。 このリンクは、ハイパーテキストマークアップ言語(HTML)の最初の列に追加できます。

8.ビジュアルおよびオーディオコンテンツに代わるテキストを提供する

コンテンツにキャプションを追加すると、聴覚障害のある人がコンテンツにアクセスするのに役立ちます。 サイトでビデオ、ポッドキャスト、またはオーディオブックを公開するときは、誰もが理解できるように、そのコンテンツに代わりにテキストを追加していることを確認してください。

9.タブインデックスを有効にする

一部のユーザー、特に運動能力が限られているユーザーは、トラックパッドやマウスを使用してサイトをナビゲートする代わりに、キーボードのタブキーで返信することがよくあります。

これらのユーザーに対応するには、サイトがタブインデックスに登録されていることを確認してください。 これは、コンテンツの要素の順序を確立することにより、すべてのユーザーが意図した順序でコンテンツにアクセスできるようにする場合です。

9.タブインデックスを有効にする

10.低速インターネット速度用のサイトの設計

平均的なユーザーはサイトにアクセスするときにインターネットの速度が平均的に高くなりますが、一部のユーザーは通常のインターネットの速度よりも遅くなります。

さらに、一般的にインターネットの速度が速いユーザーでさえ、時々むらのある接続を経験するかもしれません。 これを念頭に置いてWebサイトを設計すると、いつでも誰でもWebサイトにアクセスできるようになります。

あなたはそれがあなたのウェブサイトがHTMLテキストだけで書かれるべきであることを意味すると思うかもしれません、しかしそれはそれからほど遠いです。 フローする標準には、次のものが含まれます。

  • ページが25kb以下であることを確認してください。 あなたの目標は、約15秒以内にウェブサイトのデータをロードすることです。
  • カスケードスタイルシート(CSS)を使用して、サイトの画像を減らし、サイトの構造をきれいに保ちます。
  • サイトのページをキャッシュできることを確認してください。これにより、サイトに頻繁にアクセスする訪問者の読み込み時間が短縮されます。
  • PDFなどの大きなファイルへのリンクは避けてください。ただし、そのようなリンクが必要な場合は必ず確認してください。 ファイルサイズを表示します。
  • サイトに最初に読み込まれるコンテンツは、他の情報が読み込まれるまで読者がさらに数秒待つように動機付けるため、非常に重要である必要があります。 したがって、貴重な情報を最初に置くようにしてください。

結論

Webサイトにアクセスできるようにするためには、多くの計画が必要です。 これは、サイトを最初から作成する場合でも、現在のサイトを調整する場合でも当てはまります。 さまざまな制限のあるユーザーがWebサイトをどのように操作するか、およびエクスペリエンスを向上させる方法について、時間をかけて考えてください。