WordPressで画像を挿入するとき、代替テキストを入力していますか。
代替テキストは、画像の情報をユーザーや検索エンジンに伝えるためのテキスト(説明文)です。SEO強化につながるため、適切に設定することが大切です。
代替テキストの効果的な設定方法や注意点を理解して、画像の価値を高めましょう。
代替テキストとは画像の説明文
代替テキストとは、画像のテキスト(説明文)です。画像が表示されなかった場合や音声ブラウザを使用している場合など画像の代わり利用されます。また、検索エンジンに画像の意味を正確に伝えるためのテキストでもあります。
効果的な代替テキストの設定方法
- ユーザーに画像の意味を伝えるために設定する
- 検索エンジンに画像の意味が伝わるように設定する
ユーザーに画像の意味を伝えるために設定する
代替テキストは、ユーザーに画像の意味を正しく伝えるように設定することが大切です。
1つは、何らかの原因で画像が読み込まれなかった場合です。代替テキストを設定しておくことで、画像の代わりに代替テキストに入力した文字が画面に表示されます。画像が表示されなくても、画像と同じ価値がある内容のテキストであれば、ユーザーは画像を見なくても問題なく読み進めていくことができます。
もう1つは、音声ブラウザを使用しているユーザーに音声で画像の意味を伝えるためです。視覚から画像を認識できない場合などにも代替テキストを設定しておくことで、音声ブラウザが画像の意味を読み上げてくれます。
検索エンジンに画像の意味が伝わるように設定する
検索エンジンは、ページの内容や画像付近のテキストから画像の意味を理解しようとします。しかし、画像を完全に理解することはできません。そのため、代替テキストから画像の意味を正しく理解します。
Googleに正しい情報を伝えることはSEO強化に役立ちます。また、Googleの画像検索にも利用されます。検索エンジンが画像の意味を判断できるように設定しましょう。
代替テキストの注意点
- 画像の意味が正しく伝わるテキストを簡潔に入力する
- 画像に意味を持たない場合は入力しない
画像の意味を簡潔に入力する
代替テキストは、画像を説明するテキストですが、すべての情報を詰め込むわけではありません。キーワードを適切に使用した文章を簡潔に入力することが大切です。
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 検索セントラル
良い例は:puppy(子犬)
最も良い例:Dalmatian puppy playing fetch(ダルメシアンの子犬が遊んでいる)
翻訳すると上記のような文章になりました。「ダルメシアンの子犬が遊んでいる」とテキストがあれば、画像を見なくても意味が伝わってきますね。
※代替テキストは日本語で入力して問題ありません。
代替テキストが不要な場合
代替テキストを入力する必要がない画像もあります。それは、装飾目的や背景画像など、画像に意味を持たない場合です。意味をもたない画像をユーザーに伝えても役に立たないからです。
代替テキストとのまとめ
代替テキストは、ユーザーのために設定していることを忘れてはいけません。どうすれば画像の意味が正確に伝わるかを考え、分かりやすい表現方法であることが大切です。また、キーワードは必ず含めましょう。
- ユーザーに画像の意味を伝えるために設定する
- 検索エンジンに画像の意味が伝わるように
- 画像の意味が正しく伝わるテキストを簡潔に入力する
- 画像に意味を持たない場合は入力しない
≫≫画像ファイルの詳細(代替テキスト・タイトル・キャプション・説明)のそれぞれの役割についての記事はこちらの記事
>>加工や編集、商用利用も可能!おすすめのフリー素材サイト
コメント