【 SEO 】 画像サイズによるブログ表示速度の変化を検証してみた

こんにちは、HARU（ @HARU ）です。

ブログの表示速度が SEO に影響を及ぼすことは、以下の記事で説明しました。

それでは実際に、画像サイズによってどの程度、表示速度に違いが出るのか気になりませんか？

ということで今回は、画像サイズの違いによるブログの表示速度の変化を検証します。

わざわざ検証するからには、少しでも差が出てほしいところです。

検証条件

検証するにあたって以下のとおりに条件を決めました。

まっさらなブログを使う

画像サイズの違いによる表示速度の比較をしたいので、他の要素をなるべく削ります。

そこで検証用のブログを用意しました。

ブログサービス		Blogger
テンプレート		QooQ
表示時間	モバイル	3.0 秒
	PC	0.8 秒

ブログサービスはもちろん Blogger 、テンプレートも一押しの QooQ を使用します。

表示速度に関してはモバイルと PC から計測できる PageSpeed Insights を使い測定します。

比較対象は 3 種類用意

比較対象として「 無加工 」、「 サイズを変更したもの 」、「 サイズ変更＋圧縮したもの 」を準備しました。

違いはなんと言ってもファイルサイズ。これが表示速度にどう影響するか楽しみです。

	幅 ( px )	ファイルサイズ
無加工	4,460	2,373 KB
サイズ変更	900	598 KB
サイズ変更＋圧縮	900	126 KB

ちなみに私はいつもサイズ変更＋圧縮をしてブログに載せています。

画像枚数は 20 枚

表示させる画像は 20 枚とします。

枚数的に差が出づらいかもしれませんので、あまりに差が出ない場合、増やす予定です。

検証結果

	幅 ( px )	ファイルサイズ	表示時間 （ 秒 ）
			モバイル	PC
画像なし			3.0	0.8
無加工	4,460	2,373 KB	6.1	1.5
サイズ変更	900	598 KB	4.7	1.5
サイズ変更＋圧縮	900	126 KB	4.5	1.3

モバイルでの表示時間に関して「 無加工 」と「 サイズ変更 」で 1.4 秒の差がありました。

さらに圧縮をかけた場合、4.5 秒となり「 無加工 」と「 サイズ変更＋圧縮 」で 1.6 秒の差があります。

PC での表示時間の差は大きくありませんが、少なからず違いが見受けられます。

また多少ではありますが、圧縮によるファイルサイズの減少により、表示速度の上昇が見られます。

まとめ

画像サイズの違いが、ブログの表示速度に影響することが確認できました。

SEO に直接影響がないと考えられているブログの表示速度ですが、画像サイズの変更くらいは、自分のブログに合わせてやるべきでしょう。

もちろんベストなのは画像サイズ変更＋圧縮に間違いありません。