通信環境が良くなったからなのか、かなり多くのWebページで巨大な画像が使用されている。これらを最適化する為の基本知識と方法について。

画像が大きい → データ量が大きい → 表示に時間がかかる。
これって、検索からの評価も良くないのです!

そもそもなのですが、画像の型式についても、制作会社さん自体が理解していないケースがあります。写真画像をすべてpng24ビットで作成して使用しいてるケースを何度も経験してきました。昨今のデータ通信環境がよくなってきましたので、大きなデータでも普通に表示されてしまうため、画像データが不必要に大きい、ということに気がつきにくいてす。スマートフォンで撮影したデータをそのまま使用するケースも多いので、どうしても画像データが不必要に大きくなる傾向があります。

Xperiaで撮影

(ウェブマスター向け公式ブログ)ページの読み込み速度をモバイル検索のランキング要素に使用します(2018年1月18日)より抜粋

読み込み速度はこれまでもランキング シグナルとして使用されていましたが、それはデスクトップ検索を対象としていました。 そこで 2018 年 7 月よりページの読み込み速度をモバイル検索のランキング要素として使用することを本日みなさんにお伝えしたいと思います。

Webサイトの読み込みスピードを最適にする一つの方法が「データ量を最少にする」かと捉えます。データ量で影響が大きいのが動画や画像です。なので、動画や画像のデータ量を最適にするというアクションがサイト表示スピード改善に重要なのです。

画像の最適化のポイント3つ

1)どの画像型式は最適なのか?
2)画像サイズは最適なのか?
3)画像は圧縮できるものなのか?

1)画像型式について

(基本知識)画像型式とは?種類や特徴。
(最適化の方法)写真はjpg。

Webで使用される画像の型式について

2)画像サイズについて

(基本知識)最適なサイズとはどんなサイズなのか?
(最適化方法)スマホとPC両方で良い感じに見えるサイズを見つける。

Webページで使用する画像サイズの最適化

3)画像の圧縮について

(基本知識)画像圧縮とは
(圧縮方法)種類や圧縮率

Webページで使用する画像の圧縮について