代替テキスト: 概要と書き方

このガイドでは、代替テキスト (alt text) について学びます: 代替テキストとは何か、なぜ SEO にとって重要なのか、それを正しく使用する方法など!

これは、Web サイトのイメージ SEO とアクセシビリティを改善するためにすぐに使用できるヒントとアドバイスが含まれている、非常に実用的で要点を絞ったガイドです。

代替テキストとは

Alt テキスト (または代替テキスト) は、alt 属性または alt タグ (タグではないため技術的に正しくありません) とも呼ばれ、HTML コードで画像を説明する単なるテキストです。

代替テキストの用途は何ですか?

代替テキストの最初の機能は、ロードできなかった画像を説明することでした。

何年も前、インターネットがはるかに遅かったとき、代替テキストは、重すぎてブラウザにロードできない画像の内容を知るのに役立ちました.

現在、画像の読み込みに失敗することはめったにありませんが、失敗した場合、画像の代わりに表示されるのは代替テキストです。

現在、代替テキストは、検索エンジン ボットとスクリーン リーダーを使用している人々の両方に対して役割を果たし始めています。

• 代替テキストは、障碍のあるユーザー (スクリーン リーダーの使用など) が画像の内容を理解するのに役立ちます。
• 代替テキストは、検索エンジン ボットが画像のコンテンツとコンテキストを理解するのにも役立ちます。

もちろん、SEO のすべての要素と同様に、SEO はしばしば誤用されたり、場合によっては悪用されることさえあります。

なぜ代替テキストが重要なのかを詳しく見てみましょう。

代替テキストが重要な理由

Web と Web サイトは非常に視覚的な体験です。 画像やグラフィック要素のない Web サイトを見つけるのは困難です。

そのため、代替テキストは非常に重要です。

代替テキストは、画像のコンテンツを言葉に変換するのに役立ちます。したがって、障害のある人や、すべての画像、そのコンテキスト、およびその意味を完全に理解するほど賢くない検索エンジン ボットを含む、より多くのユーザーが画像にアクセスできるようになります。

Alt テキストが SEO にとって重要な理由

代替テキストは、ページ上の SEO 最適化の重要な要素です。

適切な代替テキストの最適化により、Web サイトが Google 画像検索で上位に表示される可能性が高くなります。

はい、代替テキストは Google 画像検索のランキング要素です。

ウェブサイトのニッチと特異性によっては、Google 画像検索トラフィックがウェブサイトの全体的な成功に大きな役割を果たす可能性があります。

たとえば、e コマース Web サイトの場合、ユーザーは製品名を標準の Google 検索に入力する代わりに、Google 画像検索で製品の検索を開始することがよくあります。

代替テキストの最適化を怠ると、Google やその他の検索エンジンで表示される商品画像が少なくなる (またはまったく表示されない) 場合があります。

画像を適切に最適化しないと、多くの潜在的なトラフィックと顧客を失う可能性があります。

代替テキストがアクセシビリティにとって重要な理由

Google 画像検索での可視性は非常に重要ですが、さらに重要な考慮事項があります。アクセシビリティです。

幸いなことに、近年、アクセシビリティ (つまり、障害のある人やスクリーン リーダーの使用者を含むすべての人が Web にアクセスできるようにすること) に、より多くの焦点と重点が置かれています。

画像の代替テキストが、たとえばキーワードを詰め込むのではなく、実際にコンテンツを説明しているとします。 その場合、この画像を見ることができない人々が、この画像と Web ページ全体の内容をよりよく理解するのに役立ちます。

Web ページの 1 つが、さまざまなクロール ツールのスクリーンショットを含む SEO 監査ガイドであるとします。

「SEO監査」という同じ代替テキストをすべての画像に配置するのではなく、各スクリーンショットの内容を説明する方がよいのではないでしょうか?

いくつかの例を見てみましょう。

代替テキストの例

代替テキストの良い例と悪い例をたくさん見つけることは難しくありません。 SEO監査ガイドを使用して上記の例に固​​執して、いくつかをお見せしましょう.

良い代替テキストの例

そのため、サンプルの SEO ガイドには、Google Search Console や Screaming Frog などのツールのスクリーンショットが含まれています。

代替テキストの良い例には、次のようなものがあります。

 <img src=”google-search-console-coverage-report.jpg” alt=”インデックスに登録されたページと除外されたページの数を示す Google Search Console のカバレッジ レポート”>
<img src=”google-search-console.jpg” alt=”Google の Google Search Console ツール”>
<img src=”screaming-frog-html-pages.jpg” alt=”Screaming Frog の HTML ページのリスト”>
<img src=”screaming-frog” alt=”Screaming Frog のクロール中”>

ヒント: ファイルの名前に注意することもお勧めします。 わかりやすいファイル名を使用することはランキング要因ではありませんが、SEO の良い実践としてこれをお勧めします。

不適切またはスパム的な代替テキストの例

また、キーワードの詰め込みやスパムなど、代替テキストの不適切な使用例も数多く見てきました。

上記の良い例を悪い例に変える方法は次のとおりです。

 <img src=”google-search-console-coverage-report.jpg”alt=”seo 監査無料、seo 監査格安、seo 監査スペシャリスト、seo 監査、seo 監査”>
<img src=”google-search-console.jpg” alt=”google seo,seo google, google, seo, google サーチコンソール seo”>
<img src=”screaming-frog-html-pages.jpg” alt=”seo 監査人、seo 監査、seo 監査”>
<img src="screaming-frog" alt="seo audit">

ご覧のとおり、上記の例は、これらの画像が実際に何を示しているかについての情報を実際には提供していません。

また、Google 検索セントラルで例やさらに多くの画像 SEO のヒントを見つけることができます。

よくある代替テキストの間違い

代替テキストにキーワードを詰め込むことだけが間違いではありません。

よくある代替テキストの間違いの例をいくつか示します。

• 代替テキストを使用していないか、空の代替テキストを使用しています。
• 異なる画像に同じ代替テキストを使用する。
• 実際には画像を説明していない非常に一般的な代替テキストを使用します。 たとえば、犬の写真に「犬」という代替テキストを使用して、犬の色、行動、品種などを詳細に説明するのではなく.
• ファイルの名前を代替テキストとして自動的に使用します。ファイルの名前によっては、「googleseachconsole」、「google-search-console」、「photo2323」など、非常に不親切な代替テキストになる可能性があります。

代替テキスト作成のヒント

そして最後に、実際にその目的を達成するために正しい代替テキストを作成する方法に関するヒントを次に示します。

• 代替テキストにキーワードを詰め込まないでください。 これらの詰め込まれたキーワードで Web ページがランク付けされるのには役立ちません。
• 画像を詳細に説明しますが、比較的短くします。 代替テキストに複数の文を追加しないでください。
• 画像の説明の一部として、ターゲット キーワードを自然な方法で使用します。 ターゲット キーワードが画像の説明に適合しない場合は、使用しないでください。
• 画像にテキストを使用しないでください。 すべてのテキストは、HTML コードの形式で追加する必要があります。
• 「これはイメージです」と書かないでください。 Google とユーザーは、これが画像であることを認識しています。 その内容を説明するだけです。
• 代替テキストを読むだけで、画像の内容を視覚化できることを確認してください。 これは、代替テキストが適切であることを確認するための最善の方法です。

ページが代替テキストを使用しているかどうかを確認する方法

これで、代替テキストのベスト プラクティスとよくある間違いをすべて理解できました。 しかし、Web サイトの画像の代替テキストの内容を実際に確認するにはどうすればよいでしょうか。

次の方法で代替テキストを分析できます。

要素の検査 (画像の上にカーソルを置いて右クリックし、[検査] を選択) は、特定の画像に代替テキストがあるかどうかを確認する良い方法です。

ただし、一括で確認したい場合は、以下の2つの方法のいずれかをお勧めします。

Web Developer Chrome 拡張機能をインストールします。

次に、監査する画像のページを開きます。

Web Developerをクリックし、 Images > Display Alt Attributesに移動します。 このようにして、特定の Web ページ上のすべての画像の代替テキストの内容を確認できます。

Web サイト全体の画像の代替テキストを確認するには、Screaming Frog や Sitebulb などのクローラーを使用します。

サイトをクロールし、画像レポートに移動して、すべての Web サイト画像の代替テキストを確認します。

その他のリソース:

• Alt テキストは Google のランキング要因ですか?
• 代替テキストの SEO ベスト プラクティス
• オンページ SEO の完全ガイド

---

主な画像: Khosro/Shutterstock