Javascript アクセシビリティ 要素をふさわしい目的に使う

HTMLのアクセシビリティ

HTMLのアクセシビリティは、
結論から言うと、
「できる限りふさわしい HTML 要素をふさわしい目的に使う」のが一番良さそうです。
意味的 (セマンティックな) HTML を使うことが重要です。
こうすることで、
アクセシビリティ以外の他の利点も出てきます。
1．理解しやすいので、より開発しやすい。
2．レスポンスが良くなることで、モバイル機器に関してより優れている。
3．見出しやリンクなどの中のキーワードに重みがあるので、SEO に関しても良くなります。

良い見出しや段落やリストなどの、
適切なコンテンツ構造の例は、
次の様になります。

<h1>見出し1</h1> <p>段落1</p> <p>段落2</p> <ol> <li>リスト1</li> <li>リスト2</li> <li>リスト3</li> </ol> <h2>下位見出し1</h2> <p>段落1</p> <h2>下位見出し2</h2> <p>段落1</p>

こういった記述のスクリーンリーダーとっての利点は、
1．どれが見出しでどれが段落なのかといったことを知らせてくれる。
2．各要素の後で停止くれる。
3．次の見出し / 前の見出しへとジャンプできる。
4．すべての見出しの一覧を取り出せる。
などが挙げられます。

段落はpタグで区切るのは意外でした。
気を付けたいと思います。

明確な言葉使い

スクリーンリーダーにとっては、
読み上げ出来るような明確な言葉使いが必要です。

スクリーンリーダーを使うと分かりますが、
日本語では、
句読点を入れる事も忘れずに気を付けるべきです。
句読点では、スピーチを止まってくれるので、聞きやすくなります。
スクリーンリーダーがどこまで対応してくれるか分からないので、
難しい漢字も避けるのが良いでしょう。

いずれにしてもスクリーンリーダーでテストするのが一番確かです。

明確な言葉使いの例は次の様になります。
1．過度に複雑ではない、明確な言葉を使う。
2、不必要な専門用語 (ジャーゴン) や俗語を使わないようにする。
3、明確に読み上げられない言い回しや文字を使うことを避ける。
4、ダッシュを使わない、
例えば、2–6は、2 から 6へ変える。
5、略語を使わず、展開する。
何回も使うときは最初の方は展開するのが良いと思います。
Feb-->February
HTML-->Hypertext Markup Language