SEO的に正しくimgタグでWebページに画像ファイルを置く(HTML5)
HTML5においても、画像ファイルをWebページに置く方法はimgタグ(要素)を利用するしかありません。
img要素とsrc属性にてファイルのpath(パス)を指定してやるだけなのですが、SEO的にはそれだけだと不十分であるため、以下でまとめます。
imgタグをSEO的に正しく使うには、画像の説明をalt属性に記述することを忘れない
imgタグのSEO的に正しい使い方は以下です。
<img src="image.jpg" alt="ここに画像の説明を記述する">
Googleなどの検索エンジンは画像の内容がalt属性の記述であると解釈する
最近は画像解析が進んでおり、昔ほどは重要視されていないことは確かですが、それでもalt属性に画像の要約を記述しておく必要がSEO的にはあります。
最近では「MFI=Mobile First Index(モバイルファーストインデックス)」という、Googleの推奨しているモバイルページの条件として、imgタグのalt属性の設定が必須となっています。
モバイル向けページの画像にはalt属性を必ず設定すること。MFIへの切り替えで検索順位に悪影響が出る可能性あり
また、ユーザビリティの観点でも「目の見えない方へ画像の説明としてalt属性の中身を読み上げる機能」がブラウザには備わっているため、良いのです。
h要素(見出しタグ)に画像を利用する場合、検索エンジンにはalt属性に記述した内容がhタグの中身として解釈されるので絶対に必要
あまり無い例ではありますが、h要素(見出しタグ)に画像を利用することも可能ですが、その際にalt属性に見出しの内容を記述しておけばSEO的に問題はありません。(検索エンジンにはきちんと見出しタグの存在を示せます。)
もし見出しに画像を利用しているサイトがあれば、必ずalt属性を記述しておきましょう。