alt属性は書いたほうがいいのか？事例を交えて書き方を解説
記事の著者：ワイエスウェブテック代表者
画像のalt属性<img src=”abcdef.jpg” alt=”何を書けばいい？？“>と悩んでいる方が多いそうです。
img要素のalt属性は、Googleなどの検索エンジンで大変厳しい目で見られています。
書いたほうがいいのか、空白のほうがいいのかお伝えします。
さらには、書く場合の注意点を把握するために、事例を交えてimg要素のalt属性について解説していきます。
本件img要素（画像）のalt属性の説明に使用する素材として、弊所トップページ上部に設置している以下の画像を使用します。
alt属性とは何かを知ろう
alt属性の難しい話
難しい話になります。こんなのいいや！という場合には、次の引用内容の簡潔な説明に進んでください。
img要素を使用するときは、簡潔なテキストによる代替をalt属性に指定する。注記: この属性の値は「ALT テキスト」ともいう。
画像がコンテンツを理解するために重要な文字を含むとき、代替テキストにはそれらの文字を含めなくてはならない。これにより、代替テキストはページ上で画像と同じ役割を果たすことができる。 代替テキストは、画像自体の視覚的な特徴を説明する必要はないが、画像と同じ意味を伝えなければらないことに注意する。
引用内容の簡潔な説明
alt属性は、使用用途が定義されており、画像の意味を知るために、画像と同じ意味を持つ文字（代替テキスト）で説明することにより、代替テキストは画像と同じ役割を果たすことができるということです。
Googleの画像認識レベルについて
GoogleはAIによる画像認識レベルが非常に向上しています。
例えば、新型コロナウィルスの画像は認識しており、『新型 コロナ』などのテキストで表示できるくらいすごいレベルに達していると言えます。
一方、弊所トップページの画像をGoogle検索をすると、『happy』とでます。
このことから、一般的によく見かけるようになった画像は検索エンジンでも認識するが、ほとんどのケースは画像認識ができないので、基本的にはW3CやWCAG2.0の基準などに準じて、alk属性に記述したほうが良いということになります。
弊所ホームページ、トップページのアイキャッチ画像は、Google・Bingどちらの検索エンジンも加工画像の意味を認識できていませんので、alt属性にテキストを書いています。
alt属性に記述するか空白か
alt属性はSEO対策目的ではない
まず、alt属性は、画像が表示されないときに画像に代わって文字で画像を説明し（代替テキスト）、かかる目的は、ユーザーのためであって、SEO効果を上げるためのものではないことを認識しておきましょう。
書いたほうが良い or 空白が良いのか
では、alt属性は書いたほうがいいのか、空白のほうがいいのか。
回答は、W3Cなどの趣旨・そしてユーザビリティの観点から考えるなら、すべて書いたほうがいいということになります。
個別具体的には、画像とalt属性（代替テキスト=画像の簡潔な説明）に関連性が高い場合は書いたほうが良いです。
関連性はあるけど、関連性が低い画像なら空白のままでも良いでしょう。
空白でも特に問題はありません。
正しい書き方の事例
alt属性とは何かを知ろうでお話ししたように、alt属性は正しく記述する必要があります。
以下は弊所トップページの画像のimg要素のalt属性になります。
正しい書き方の一例です。
➀画像（視覚的認識）と➁alt属性(代替テキスト)が➂おおよそ一致しており、④簡潔な説明になっています。
➀➁➂④でW3CやWCAG2.0の基準に沿っており、これが本来のalt属性の使用用途になります。
誤った書き方の事例
次によくある、alt属性の誤った書き方について解説していきます。
1,画像とalt属性が一致しない
急にシウマイが食べたくなったのでこのテキストで説明します(笑)
画像とalt属性が一致しておらず、alt属性の機能を果たせていません。
画像とalt属性の説明を一致させましょう！
2,簡潔な説明になっていない
長文になっていますので、簡潔な説明と言えません。
簡潔な説明に変更する必要があります。
3,文字の羅列になっている
この書き方は、ひと昔前に合ったSEO対策の手法で、地域名の羅列です。
様々な地域で集客したいのは共感しますが、現代においてこのような書き方をするとコンテンツ（画像やウェブページ、深刻な場合はホームページ全体）に悪影響を及ぼします。
画像とalt属性の一致と簡潔な説明文になるように記述しなおす必要があります。
4，キーワードの過剰詰込み
非常に悪い誤った書き方であり、過剰最適化といいます。
これは、SEO対策として大問題となりますので、すぐにやめましょう。
参考ブログ記事:コアアップデートを初心者でもわかりやすいように解説/ペンギンアップデート
まとめ
ツイッターを徘徊して、いろんなホームページを見ていますが、こんなに露骨ではありませんが、2～4のように、画像と関係ないのに地域名を入れたり、とにかく文字数を増やしたり、画像に表示してほしいキーワードを何度も詰め込む書き方は結構見かけます。
だいたい2～4全部取り入れてることが多いです。
alt属性の誤った書き方を客観的に見直し、排除することで、低品質ページになることを防ぎ、alt属性は正しい方法で書きましょう。
