SEOが向上するウェブアクセシビリティ8つの施策と、放置した場合の法的リスク（中編）

アクセシビリティでSEOを強化する8つの施策

検索順位に直接影響を与える主なアクセシビリティの機能を具体的に見ていこう。ポイントはぜんぶで8つある。

施策1画像の代替テキスト

代替テキスト（alt属性テキスト）は、視覚障害や弱視の人でスクリーンリーダーを使っているユーザーのために画像の内容を説明するものだ。だが、実はアクセシビリティだけが目的ではない。代替テキストは検索エンジンが画像の内容を理解するうえでも役立つため、サイトのSEOが強化され、コンテンツが発見されやすくなる。

代替テキストのHTMLの例：

<img src="golden-retriever-fetch.jpg" alt="ゴールデンレトリーバーが公園でボール遊びをしている。">

施策2色のコントラストと読みやすさ

テキストのコントラストが低いと（文字と背景の色の差が小さいと）、単に「見えにくい」だけでなく、視覚障害や失読症の人を含め多くのユーザーにとっては「読めない」状態になることもある。

それに、困るのはユーザーだけではない。検索エンジンも明瞭でコントラストの高いテキストを好む。ユーザーをより長くエンゲージさせておけるほか、直帰率も下がるからだ（それによって検索結果の上位に表示されやすくなる）。

重要なヒント

コントラストチェックツールを使って、誰にとっても読みやすいテキストになっているか確認しよう（後編（9/9公開予定）でツールを紹介する）。

さらにカラーパレットガイドを作成することで、チーム全体で一貫性を保ち、偶発的な読みやすさの問題を回避できればさらに良い。たとえば、あるクライアントのために当社は次のようなカラーパレットガイドを作って提供した。

施策3説明的なアンカーテキスト

「ここをクリック」――そろそろそんなアンカーテキストは卒業しよう。こういう曖昧なリンクは誰の役にも立たない。そうではなく、リンクのアンカーテキストは「SEO戦略を最適化する方法について知る」のように明確で具体的なものにしよう。

そうすれば、スクリーンリーダーのユーザーにとって理解しやすく、ナビゲーションしやすくなり、検索エンジンにもコンテンツに関する貴重なコンテキストを提供できる。

アンカーテキストのHTMLの例：

<a href="https://moz.com/learn/seo/seo-strategy" title="SEO戦略を最適化する方法について知る">SEO戦略を最適化する方法について知る</a>

施策4ARIA属性

ARIA（Accessible Rich Internet Applications）属性の指定は、動的なコンテンツや複雑なユーザーインターフェイスのアクセシビリティを向上させるために不可欠な手段だ。

障害のあるユーザーに対し、スクリーンリーダーなどの支援技術がコンテンツを効率的に解釈して表示できるようにするのに役立つ。

ARIAラベルのHTMLの例：

<button aria-label="閉じる" onclick="closeWindow()">X</button>

上記のaria-labelがARIA属性の1つ。メニューやダイアログボックスの「閉じる」ボタンだが、ボタンの中身としては「X」という文字しかないUIを想像してみてほしい。

目で見てマウスを使うユーザーならば、このボタンが右上にあれば閉じるボタンだとわかるだろう。しかし、スクリーンリーダーを使っている人には「X」という情報しかない。

そこで、HTML内でこのボタンの属性に「aria-label="閉じる"」と記載しておくことで、スクリーンリーダーを使っている人にも、これが閉じるボタンなのだとわかるという仕組みだ。

施策5アクセシブルな動画コンテンツ

あなたのサイトに動画はあるだろうか？（ない場合は用意するべきだ！）

ただし、動画には字幕と文字起こしを追加して、アクセシブルにしておこう。聴覚障害者や難聴者だけでなく、ミュートで視聴している人にも役立つほか、多くのキーワードが含まれる追加のコンテンツを検索エンジンにクロールしてもらえる。

施策6レスポンシブデザイン

誰もがスマートフォンで閲覧しているため、サイトのモバイル対応は任意ではなく必須だ。ただし、モバイル対応サイトでのアクセシビリティは単に「小さな画面に収めればいい」というものではない。

真にアクセシブルなモバイルサイトとは、次のようなものだ：

• スクリーンリーダーとスムーズに連動する
• 表示サイズを変更しても、コンテンツの正しい順番が維持される
• 文字の大きさを変更してもレイアウトが崩れない

検索エンジンはレスポンシブでアクセシブルなサイトを優先するため、これを適切に実装すれば検索順位を上げられる。

施策7明快な言葉遣い

「明快で平易な言葉遣い」をすることは誰にとっても有益だが、特に学習障害のある人や情報処理の仕方が異なる人、または英語が母語ではない人に役立つ（注： 日本の場合は日本語が母語ではない人）。

英国の成人の大多数は読解力が11歳～14歳程度のため、シンプルな内容にしておくことで、多くの人にとってコンテンツのアクセシビリティやエンゲージメントが向上する。

コンテンツを読みやすくしていけば、ユーザー体験を高め、直帰率を下げ、エンゲージメントを増やせる。いずれも検索エンジンが評価する要素だ。

施策8一貫性のあるをナビゲーション

ナビゲーションが予測可能で一貫していれば、必要な情報を誰もが見つけやすくなる（いいね！）。

特に「学習障害」「情報処理の問題」「記憶障害」のある人にとっては、ナビゲーションが一貫していれば混乱や苛立ちを抑えられ、有益だ。

それに、明確で論理的なナビゲーションは、検索エンジンがより効率的にサイトをクロールしてインデックス化するのに役立つため、検索順位も向上できる（さらにいいね！）。

アクセシビリティに関する法的要件

ここまで説明したように、ウェブサイトをアクセシブルにすれば、より多くの適切なユーザーにリーチし、より良い体験をもたらす助けになる。

ただしそれは、単に温かく穏やかな気持ちになるためではない。サイトをアクセシブルにすることは、法的責任でもある。

ウェブアクセシビリティに関しては、特に英国や米国で事業を展開している場合、重要な法的基準を考慮する必要がある。英国では2010年平等法が「障害のある人に合理的な配慮をすること」を企業に求めており、これにはウェブサイトをアクセシブルにすることも含まれる。

米国では、特に一般の人に開放されている公共の場でのビジネスを対象に、障害を持つアメリカ人法（ADA）が「障害のある人もウェブサイトを利用できるようにすること」を義務付けている。

単に正しいことをするというだけの話ではなく、法的問題のリスクを回避する必要もある。Accessibility.comの調査によると、ウェブサイトのアクセシビリティをめぐっては、2023年だけで2281件の訴訟が起こされており、そのうち26%は過去に訴えられたことのある企業を相手取って起こされたものだった（かっこわる！）。

ウェブサイトをアクセシブルにするのは、「その方が望ましい」からではない。法的義務であり、ビジネス上の必須要件だ。

先に述べたどちらの法律も、ウェブコンテンツアクセシビリティガイドライン（WCAG）2.1にほぼ沿っている。WCAGは、能力に関係なく、あらゆる人にとってデジタルコンテンツをアクセシブルにするためのガイドラインだ。

ウェブコンテンツアクセシビリティガイドライン（WCAG）

では、その「WCAG」とはどんなものだろうか？ このガイドラインは、次の3つのレベルに分類されている：

• A（基本）
• AA（適合）
• AAA（最高）

ほとんどの法的要件はAAに準拠することに焦点が当てられている。ウェブサイトが基準に達していない場合は、「法的問題」「罰金」または「評判への打撃」が生じるおそれがある。そのため、ウェブサイトをアクセシブルにすることは、単に親切であるというだけでなく、ビジネスを保護し、法律を守ることでもあるのだ。

WCAGのウェブアクセシビリティ原則

WCAGで定めている「ウェブアクセシビリティの原則」は、次のようなものだ：

• 知覚可能： すべてのユーザーがウェブサイトのコンテンツを正確に見て読めるようにする必要がある。つまり「視覚障害」「聴覚障害」「その他の障害がある人」を排除してはならない。

• 操作可能： ウェブサイトのコンテンツは、すべてのユーザーにとってレスポンシブで、簡単にナビゲートできるものでなければならない。たとえば、マウスではなくキーボードだけを使ってウェブサイトのナビゲーションを操作可能にすることなどが挙げられる。

• 理解可能： ウェブサイトのインターフェイスと情報は、使いやすく、ナビゲーションが予測可能で、すべてのユーザーが理解できる言語を含めて構成する必要がある。

• 堅牢： ウェブサイトは、障害のあるユーザーがよく使う支援技術ツールを含め、さまざまな技術に対応させる必要がある。