【簡単】WordPressで設定できる画像の代替テキストの効果的な使い方

「記事の装飾や、説明を分かりやすくするために、画像を投稿しよう」
と、ブログを投稿する時、何気なく使っている画像。
その画像、1枚1枚に名前だけではなく、少し手間がかかりますが、検索キーワード に引っかかる言葉を入れることが可能です。

ただ、この手間のかかる作業が割と重要で、あるブロガーさんの例をご紹介します。

投稿した渾身の記事が、数ヶ月経っても狙ったキーワードで圏外だったそうです。
「渾身の記事だったので、すごくショックだった」と言っていました。
しかし、挿入している画像をちゃんと設定したところ、通常の検索では圏外だったのが、画像検索での掲載順位は1位になったそうです。
そして、画像検索から流入が結構あると話していました。

競合が強いジャンルのブログジャンルで、ライバルよりも一歩前に出るためには、画像の1つ1つの設定にもこだわっていく必要があります。

今回は、画像に入力できる項目について、1つ1つ丁寧にご紹介していきます。
この記事を最後まで読めば、画像検索においてライバルに差をつけるノウハウを身に付けられるでしょう。

それでは早速ご説明していきます。

画像に入力できる項目を整理

まずはじめに、画像に入力できる項目について整理していきます。

ワードプレスに挿入した画像を選択すると、画面の右側に以下のような入力欄が出てきます。上から順々にどんな意味合いを持つのか表にまとめてみました。

代替テキスト画像に名前をつけることで、Google検索に引っかかるようになります。SEO対策をする場合は、大切な部分になりますのでしっかり設定するようにしましょう。
タイトル検索結果にそこまで影響はありませんが、WordPress内で画像検索する際に必要になります。作業効率のためにも入力しておいた方がいいでしょう。
キャプション挿入した画像を文字で表現するときに使います。良質な画像を入れたら、文字で補足するとイメージが膨らむのでテクニックとして使っていきましょう。
説明説明文になります。あまり使わないかもです。

代替テキストに関しては、投稿画面からも変更をすることができます。

赤枠で囲ってある部分が、画像の代替テキストを変更できる枠になります。
画像を表現したい内容と違ったら、ここで簡単に変更が可能です。

そして、画像に入力する項目の中で、一番大切なのはこの代替テキストになります。なぜ大切なのかについて、もう少し詳しく説明していきますね。

代替テキストについてもう少し詳しく説明

代替テキストは別名をalt属性と言います。

このalt属性がどんな意味があるかというと、画像の代わりとなる文章情報になります。

つまり、Googleはこの画像が何を表すものなのかをalt属性を読み取るのです。一方で、代替テキストに何も入っていないとただの装飾とみなされてしまいます。

Googleに「この画像にはこういう情報が入っていますよ」と、教えてインデックス(検索に掲載)してもらうためには入力することは必須です。

おさらいしますと、Googleに読み取って欲しい場合は、alt属性を入力しましょう。

一方で、特に読み取って欲しいわけではなく装飾として追加したのであれば、未入力で問題ありません。

続いてGoogleに正しく読み取ってもらい、検索結果に良い効果を与えるためには、どのように設定すればいいのかについて説明していきますね。

画像をGoogleに読み込んでもらうために大切なこと

Googleが推奨する代替テキストの入力方法によると、

・画像を表現した文字であること
・キーワードを乱用していないこと
・ページの内容にあった内容を入力すること

以上の3点になります。

代替テキスト(画像について説明するテキスト)は、
スクリーン リーダーを使用するユーザーや、低帯域幅のネットワークを使用しているユーザーなど、
ウェブページの画像を確認できないユーザー向けの補助機能として役立ちます。

Google では、代替テキストに加えて、
コンピュータ ビジョン アルゴリズムやページのコンテンツを使用して、画像のテーマを理解します。

また、画像の代替テキストは、画像をリンクとして使用する場合にアンカー テキストとして使用できます。
代替テキストを設定するときは、キーワードを適切に使用して、ページのコンテンツのコンテキストに沿った、情報に富む、有用なコンテンツを作成するようにしてください。
alt 属性にキーワードを羅列すること(キーワードの乱用)は避けてください。
これによって、ユーザー エクスペリエンスが低下し、サイトがスパムとみなされる場合があります。

悪い例(代替テキストがありません):  <img src=”puppy.jpg”/>
悪い例(キーワードの乱用):<img src=”puppy.jpg” alt=”puppy dog baby dog pup pups puppies doggies pups litter puppies dog retriever labrador wolfhound setter pointer puppy jack russell terrier puppies dog food cheap dogfood puppy food”/>

良い例: <img src=”puppy.jpg” alt=”puppy”/>
最も良い例:<img src=”puppy.jpg” alt=”Dalmatian puppy playing fetch”/>

アクセシビリティを監査し、低速ネットワーク接続エミュレータを使用して、コンテンツをテストすることをおすすめします。
Google に画像を検出されやすくするには 画像にセマンティック マークアップを使用する Google ではページの HTML を解析して画像をインデックスに登録しますが、CSS の画像はインデックスに登録しません。

良い例: <img src=”puppy.jpg” alt=”A golden retriever puppy” />
悪い例:<div style=”background-image:url(puppy.jpg)”>A golden retriever puppy</div>

以下引用:Google公式ページ

代替テキストは英語で書く必要はなく、以下のような画像であれば、例えば、代替テキストに”ブログに使うため、良い写真を撮ろうとしている少年”このような文字列の方が具体的でわかりやすいのです。

まとめ

あまり意識することなく画像を挿入して、そのまま投稿してるのであれば、リライト時にその部分を修正するようにしましょう。

代替テキストであれば、投稿画面から修正ができるので、そこまで手間がなく変更することができると思いますので、ぜひその一手間に労力を使いましょうね。