altタグ(オルトタグ・代替テキスト)の重要性とSEO効果について

記述のポイントまで解説!altタグ(オルトタグ・代替テキスト)の重要性とSEO効果について

Webサイトを運用する上で、画像の扱いは重要な要素の一つです。特に、画像に設定する「altタグ(オルトタグ・代替テキスト)」は、見た目には分からない部分でありながら、ユーザビリティやSEOにおいて大きな役割を果たしています。

本記事では、altタグとは何か、なぜ重要なのか、そしてどのように設定すべきかについて、初心者の方にも分かりやすく解説いたします。サイトを運用されている方にとって、日常的な更新作業でも活用できる実践的な内容をお届けします。

目次

altタグ(オルトタグ・代替テキスト)とは

altタグは、画像が表示されない状況や、画像を視覚的に確認できないユーザーに対して、「その画像がどういう内容なのか」「どのようなことを表現した画像なのか」を文字情報として伝える役割を担っています。

WordPressでいうと、下記の場所がaltタグの設定箇所に該当します。

  • 左側のメニュー「メディア」で画像の詳細情報を表示した時の「代替テキスト」欄
  • 記事の作成画面で画像を選択した際に右側に出てくる「代替テキスト」欄
WordPress画像情報の詳細
「メディア」から画像の詳細を表示
WordPress記事作成画面
記事作成画面で画像を選択

ではこのaltタグ、何のために設定するのか、分かりやすい事例を2つ挙げてみます。

例えば、視覚に障がいをお持ちの方がWebサイトを利用する際、スクリーンリーダーという音声読み上げ機能を使用されることがあります。この場合、画像の内容を直接確認することはできませんが、altタグが適切に設定されていることで、読み上げ機能によってその画像がどのような内容であるかを理解することができます。

また、電波状況が悪い環境や通信速度が遅い状況では、画像の読み込みに時間がかかったり、読み込みが完了しなかったりする場合があります。そのような状況でも、altタグが設定されていれば、画像の代わりにテキストが表示されるため、ユーザーはその画像がどのような内容であるかを推測することができます。

すなわち、このaltタグを設定することによって、ユーザビリティが高まり、様々なユーザーにとって利用しやすいサイトになることがなんとなくご理解いただけたでしょうか?

altタグ(オルトタグ・代替テキスト)のSEOへの効果

altタグを設定により、ユーザビリティが高まるとお伝えしましたが、そして、このユーザビリティの向上は、SEOにも効果があります。

Googleなどの検索エンジンは、ユーザーにとって使いやすく、質の良いサイトを高く評価する傾向があります。なぜなら、検索結果で出てきたサイトを通じて、ユーザーの求める情報が得られたり、疑問や調べたいことを解消して満足いただくことで、多くの人に自社の検索エンジンの利用を促したいからです。

そのため、画像に適切なaltタグを設定していると、検索エンジンのクローラー・ボットは「様々な方に配慮された、ユーザーフレンドリーなサイト」として認識し、サイトの評価を向上させます。この結果、サイトの検索順位の向上につながり、SEOの対策にもなるというわけですね。

また、検索エンジンのクローラーが画像の内容を理解することで、画像検索の検索結果表示にも役立つため、より多くのユーザーにサイトを見てもらえる可能性が高まるという側面もあります。

サイトの評価には、altタグだけではなく、他にも色々な評価項目があるため、記述したからといってすぐに検索順位が上がったり、アクセス数が増えたりするようなことは期待できません。しかし、ユーザー目線でコンテンツを作っているかどうかを、検索エンジンはきちんと評価します。

もし、画像にaltタグが設定されていくても、大多数のユーザーにとってはサイトの見た目や機能に変化はありませんし、閲覧も問題なくできます。しかし、検索エンジンからの評価は下がってしまうため、SEOの観点では不利になります。

altタグ(オルトタグ・代替テキスト)の記述のポイント

記事の投稿でサムネイル画像を設定するために画像を適用するケースは頻繁にあると思いますが、新たに追加する画像については、都度altタグの設定が必要となります。画像を追加する際は、その画像がどのような内容を表現しているかを簡潔に文字で表現し、代替テキストとして設定することをお勧めします。

では、具体的にどのように書けばいいのでしょうか?

実際の書き方には、いくつかのポイントがあります。altタグの効果を最大限発揮させるために、以下の3つのポイントを参考にしてみてください。今回は、下記の画像を例にして解説してきます。

グリーンを配した現代的なワークスペース空間

①:適度なキーワード使用を心がける

altタグ内でのキーワード使用は、2~3個程度に留めておきましょう。過度にキーワードを詰め込むと、画像と記事内容の関連性が不明確になってしまい、評価が下がるリスクが生じます。

②:画像の内容を自然な文章で記述する

単語の羅列ではなく、画像の内容を自然な文章で表現しましょう。検索エンジンは単語の羅列は理解できないため、意味のある文章として記述することが効果的です。

③:簡潔で分かりやすい長さに調整する

altタグのテキストは、厳密な文字数の決まりはありませんが、20文字程度、長くても30文字程度を目安とし、簡潔に要点を伝えることが大切です。長すぎる記述は、かえって画像の内容が検索エンジンへ伝わらないという可能性もあります。

以上のポイントを踏まえると、先ほどの画像は下記のようなaltタグが設定できそうです。

OK例:

  • 「木材と大窓を活かしたモダンなオープンオフィス」
  • 「グリーンを配した現代的なワークスペース空間」

NG例:

  • 「画像」「写真」「イメージ」(画像の内容を説明していない)
  • 「オフィス おしゃれ インテリア 会社 ワークスペース 現代的」(単語の羅列)
  • 「大きな窓から自然光がたっぷりと差し込む開放的で現代的なデザインが施された木材を基調とした温かみのあるオープンオフィス空間」(キーワードの詰め込み・長すぎる)

Webサイトにおいては、画像をページの装飾に使ったり背景画像などに設定する場合もあります。このようにサイトの内容と直接的に関連しない装飾的な画像については、alt属性を記述する必要はありません。
しかし、一般的な「お知らせ」や「ブログ」などの記事で設定する画像については、記事の内容に関連する画像が多いかと思いますので、altタグの記述は必要です。

まとめ

altタグは、見た目には分からない部分でありながら、アクセシビリティの向上とSEO効果の両面で重要な役割を果たします。日常的な更新作業において、画像を追加する際は代替テキストの設定を習慣化することで、より多くのユーザーに優しく、検索エンジンからも評価されるサイト運営が実現できます。

重要なのは、altタグの設定は単なる技術的な作業ではなく、「ユーザーへの配慮」であるという点です。altタグは、特定の状況下で画像を閲覧できないユーザーから検索エンジンのクローラーまで、全てに対して有益な情報を提供することができます。

また、altタグの設定は一度行えば終わりではありません。定期的にサイト内の画像を見直し、適切なaltタグが設定されているかをチェックすることも大切です。新しく追加した画像はもちろん、既存の画像についても、より適切な表現があれば改善していくという継続的な取り組みが、長期的なSEO効果とユーザビリティの向上につながります。

記事をシェアする
目次