SEOで有利になるブログへの写真・画像の貼り付け方

こんにちは、hirokiです。

ブログ記事を書く為に必要不可欠なのが「写真や画像」ですよね。

効果的に画像をブログに挿入していくことで、文字だけの記事よりも視覚的に読み進めやすくなったり、文字だけでは伝えづらいようなことも画像があればわかりやすく伝えることもできます。

「光るピックが凄いんですよ~」と、文字だけで表現するよりも、

見て下さい、この光るピック!
光るピック凄いですよね~!

と、画像を付けてあげた方が圧倒的に読者に伝わりますよね。

なので、ブログにはできるだけたくさん画像を使っていきたい所ですが、「よくわからないけどとりあえずそのまま画像をブログに挿入してる」という人も多いのではないでしょうか?

実はブログに画像を貼り付ける際には「2つのポイント」をしっかり意識するとSEOで有利にすることができます。ブログに画像をたくさん使っていきたいと思っている方はこの2つのポイントを意識して画像を使っていくと更にSEOで有利になっていくと思いますので、是非参考にしてみて下さい。

おすすめ記事
初心者必見!ブログを月間10万PVまで増やす為の全手法
 WordPressでブログサイトを作成する方法と使い方まとめ

1.ブログに使う画像はできるだけ容量を小さくして軽くしよう

ファイルサイズを小さくする

ブログに画像を載せたいと思って、何も考えずに「撮った写真をそのまま」ブログにアップロードしてしまったりしていませんか?これだと、多くの場合で容量が大きく画像の読み込みに時間がかかってしまいます。いわゆる「重い」状態です。

ページの読み込みが遅くなり重い状態ではGoogleからサイトの評価も下がりSEO上マイナスになるだけでなく、読者のストレスにもなってしまいます。いちいち読み込みに時間がかかるような記事をいくつも見たいとは思わないですよね。

もちろん、画質にこだわった写真をメインコンテンツにしているサイトの場合はその限りではありませんが、一般的な個人ブログ等の場合は基本的に画像を圧縮して容量を小さくして「軽くしてから」アップロードしていくことが大切です。

画像の容量を小さくして軽くするということは「多少画質を落とす」ということにはなるのですが、それでもパッと見では画質が落ちている事はほとんどわからないですし、今ではスマホなどの小さなデバイスからの閲覧が多いので、そこまで画質にこだわる必要もありません。

パッと見ではわからないようなわずかな画質の違いにこだわるよりは、容量を軽くしてページの表示速度にこだわったほうがブログ運営としては圧倒的に合理的です。

画像を圧縮する方法

画像を圧縮する方法はいくつかあります。画像の加工ができるようなソフトを使ってもいいですし、ネット上にある圧縮サービスなどを使ってもいいと思います。

ここではネット上でできる圧縮サービスを紹介していきたいと思います。

ポイント

圧縮する前に知っておくといいのが「JPEGファイルとPNGファイルの違い」です。ここを理解することでより効率よく綺麗な画像を軽く使うことができます。JPEGとPNGの詳しい違いについては『JPEGとPNGの違いを理解して効率良くブログに画像を貼り付ける方法』を参考にしてみて下さい。

JPEGファイル圧縮におすすめのサイト

PNGファイル圧縮におすすめのサイト

このようにファイルを圧縮できるサイトもたくさんあります。基本的にはしっかり圧縮ができればどのサイトでも問題ありません。

これらの無料オンラインサービスを使えば、特に特別なソフトなどがなくても簡単に画像を圧縮することができます。自分で使いやすいと思ったサイトを使ってみて下さい。

2.写真や画像には「ALT属性」を記述しよう

海辺の草原に停まる1台のミニバン

ブログに使う写真や画像には適切にALT属性を記述していくことが大切です。

ALT属性(オルト属性)とは、HTMLの画像の中に記述される画像の代替となるテキスト情報のこと。

例えば、犬の写真をブログに使った場合、人間であれば写真を見ればそれが「犬である」と認識することができます。しかし、Googleのクローラーはその画像ファイルを何かの画像であることは認識できても、それが犬であるとは認識できません。

そこで、Googleのクローラーにもしっかりとその画像が犬であることを認識させる為に必要になるのがALT属性(代替えテキスト情報)です。画像の中に代替えテキストで「犬」という記述を書き加えることで、「この画像は犬である」とGoogleのクローラーも認識することができるのです。

そして何を隠そう、このALT属性を正しく記述することを推奨しているのは検索順位を決定しているGoogleです。GoogleはこのALT属性を正しく記述することによるメリットを以下のように述べています。

  • Google にとって代替テキストは、画像の題材についての有用な情報です。Google はこの情報を使用して、ユーザーのクエリに最適な画像を判断します。
  • 視覚障害がある、スクリーン リーダーを使用する、接続速度が遅いなどの理由から、ウェブページの画像を見ることができないユーザーも多くいます。代替テキストはこのようなユーザーに重要な情報を提供できます。

引用元:Google Search Console ヘルプ

要するに、ALT属性の情報を元に検索結果にも反映させているということです。

例えば、ブログに数百枚、数千枚の画像を貼り付けている場合、それらすべてにALT属性が記述されているのかされていないのかはサイト自体の評価としても大きな違いになるはずです。

画像一つ一つに面倒くさがらずにALT属性を記述していくことが結果的にはブログの評価にも繋がります。

ALT属性の記述方法

ALT属性を記述するには画像をHTML表記にした際にaltという個所を加えればOKです。

例えば、下に犬の画像があります。

こちらを見つめる犬

この画像をHTMLで表記すると<img src=”dog.jpg” alt=”こちらを見つめる犬”/>のようになります。

この中の赤字の部分がALT属性です。ここではこの写真のALT属性は「こちらを見つめる犬」と記述しています。これによってGoolgeもこの写真はこちらを見つめる犬であることを認識できるようになるわけです。

つまりALT属性を記述するにはHTMLの<img src=”dog.jpg” alt=”●●”/>赤字の部分を適切に追加すればいいということです。

WordPressの場合はメディアを追加したら、鉛筆マークの[編集]をクリックして

ファイルを編集

[代替テキスト]という項目にその写真の説明を記述して[更新]を押せばOKです。

代替テキスト

これでALT属性を記述したことになります。

ALT属性には正しい情報を記述しよう

ALT属性には「なるべく具体的で正しい情報」を記述する必要があります。

こちらを見つめる犬

例えばこの犬の画像でのNG例と正しい記述方法は以下のようになります。

NG例

  • <img src=”dog.jpg” alt=”犬”/
  • <img src=”dog.jpg” alt=”犬 dog 見つめる 子犬 ドッグフード 安い ブリーダー ペット かわいい”/

「犬」のように漠然としすぎていてもダメですし、キーワードを乱用しすぎてもダメです。特に画像に直接関係の無いようなキーワードを乱用すると、Googleにスパム判定されてしまう可能性がありますので絶対にやらないようにしましょう。

正しい記述方法

  • <img src=”dog.jpg” alt=”こちらを見つめる犬”/

ALT属性の正しい記述方法は、なるべく具体的にその画像の内容をわかりやすくテキストで表現してあげることです。

ギターを弾く後ろ姿の男性

なので、この画像だったら<img src=”man.jpg” alt=”ギターを弾く後ろ姿の男性”/>などになるでしょうし、

海辺の草原に停まる1台のミニバン

この画像だったら<img src=”mini.jpg” alt=”海辺の草原に停まる1台のミニバン”/>などになります。

その画像をなるべく具体的にわかりやすいテキストで表現してあげればOKです。

まとめ

ブログに画像を挿入する際は以下の2点をしっかり意識すると、SEOで有利になります。

  1. 画像はできるだけ容量を小さくしてからアップロードする
  2. 画像には適切なALT属性を記述する

これをひとつひとつ丁寧にやっていくことで、画像が数百枚、数千枚とブログに積み重なった時には大きな違いとなります。ブログに画像をたくさん使いたいという方は今のうちからしっかり対策をしておきましょう。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

ABOUTこの記事をかいた人

hiroki

月間20万PVのメディアを運営したりなんやかんやしたりしてます。サッカーと音楽とトイプードルが好き。主な著書に「ブログに書くことがない!と思った時に読む本」など