WordPress高速化!~画像を圧縮して一瞬でページ表示する方法~

WordPress

ページの表示が遅くなる原因は?

普段ネットで調べ物をしている時、ホームページに訪問したページの表示が遅くてイライラしたことありませんか?

サイト運営者にとってユーザーのイライラを無くす事も仕事の一つになります。
表示が遅ければユーザーは記事を読むことなく離脱してしまいます。

ある調査ではページの読み込みが遅ければ41%のユーザーが離脱しているとのデータがあります。
半分近くが離脱してしまうサイト…
早急に対処しないといけません。

ページの読み込みの原因は色々ありますが、
画像などのメディア容量が大きすぎる
という事が一番の原因です。

 

画像容量はどれくらいあるの?

一般的なスマホで撮影された写真の容量は2M(2メガバイト)ほどになります。
これはかなり容量が大きいです。
この写真をそのままホームページに載せてしまうと読み込むのに相当な時間がかかってしまいます。

なぜ、スマホで撮影された写真はこんなにも容量が大きいのでしょうか?

画像の大きさが問題

スマホで撮影された写真の大きさは「約4,000px」ほどあります。
今ご覧になられているページの最大幅は「1140px」です。
単純に3~4倍ほどの大きさなのです。

ホームページで表示される写真などは画面の大きさによって大きさが変わっていきます。
しかし、これらは見た目の大きさが変わっているだけで、容量は変わっていません。
最大幅が決まっているホームページの関して言うと最大幅以上の画像は必要ないという事になります。

そんな画像を軽くし、ページの表示速度を劇的に改善する方法を説明します。

 

画像の大きさを変更する

ここではWindowsを例にご紹介します。
Windowsに標準搭載されているペイントソフトを開きます。

ペイントアイコン

ソフトが起動すれば大きさを変更したい画像をドラッグ&ドロップします。

元画像が22.5MBあります

メニューバーの「サイズ変更」をクリックします。
「サイズ変更」欄の単位で「ピクセル」を選択します。
次に水平方向の数字を適正なサイズにします。(900以下に抑えると良いでしょう)

ペイントサイズ変更

完了するとOKをクリックして画像を保存してください。

右クリックのプロパティで画像の容量を確認してみてください。
容量が大幅に減少したことが分かると思います。

例の場合だと最初22.5MBだった画像が227KB(約100分の1)までサイズダウンできました。

プロパティサイズ

 

圧縮ツールでさらに圧縮

画像のサイズを変更しただけでも十分容量を減らすことができました。
ここからさらに圧縮ツールを使って圧縮していきます。

JPEG圧縮というサイト
http://compressjpeg.com/ja/

JPEG圧縮サイト

このサイトを使うと、画像をドラッグ&ドロップするだけで簡単に圧縮する事が出来ます。
例で使用している写真を圧縮してみます。

圧縮率

結果は…38%圧縮する事が出来ます。
最終的に22.5MBだった写真が140KBまで圧縮できました。
つまり160分の1にまで容量を減らすことができました。

後はいつも通りホームページにアップするだけ。
見た目も変わらず高速でページを表示する事が出来ます。

 

まとめ

画像圧縮に必要な手順は
「縮小」→「圧縮」です。
この手順は慣れれば1分もかかりません。

ユーザーの離脱を減らしホームページの集客を増やす為にこの方法は必ず覚えてください。