・ブログ表示が遅い理由
・ブログ表示を高速にする方法（50％以上改善）
おはようございます。じぇいかわさきです。
サイト表示が遅くてイライラする、途中だけど切って他に行こうっと
あなたもこんな経験をしたことありませんか？
理由は画像が重すぎて、サイトデータをロードしてくるのに時間がかかっているからですね。
あなたの運営するサイトは大丈夫ですか？
今回は、あなたのサイトスピードを改善するための方法を紹介します。
要は、サイト表示スピードに大きく影響する画像容量を圧縮させる方法です。
これを実施すれば表示スピードに効果が期待できます。実際にサチコで実施する速度計測で、スコア30だったものが74まで改善出来ました。
効果の期待ができるので、是非試してみてください
wordpress画像圧縮の方法は
ところで画像圧縮方法って何が有るの？
一般的にはプラグインを使用するのが簡単だね。
それじゃあ基本は自動でやってくれるんだね
それ以外にも、Webサイトで画像圧縮サービスを実施しているところもあるよ。
そうです、画像圧縮と簡単に言っても基本的にはサイトにアップロードする前に実施する方法とサイトにアップロードする際に一緒に実施する方法の大きくは2種類があるんです。
性格に言うと、前者のサイトにアップロードする前に実施する方法には、専用のアプリを使用して自分のPC内で実施するものと、Webサービスを使用するものの更に2つに分かれます。
前者は、Webサービスで実施されておりいろいろな物が有りますので、自分の趣旨に有った物を選ぶと良いですね。
圧縮する前の画像の書式によってもサイトが分かれており、専門に実施しているサイトもあるみたいです。
以下が割と有名みたいね
また、自分のPCで画像圧縮するアプリは、もともと圧縮されている画像を更に圧縮すると言う事になりますので、なかなか良いアプリは無いようですね。
これは、使用するOSによって多分異なると思われます。
こいつはネットに接続していなくても使用できるらしい。
それに対して、サイトにアップロードする際に行うのはプラグインと言われるものですね。
wordpressの場合には、前者も後者も使用することができますが、一般の無料ブログを使用している場合には、専用のアプリで圧縮をするか、Webサービスで実施するかしか選択肢はありませんね。
でも、実際に圧縮した場合に注意していただきたいのは、あまり圧縮しすぎないと言う事です。
どうしてもスピード重視になり、画像を思い切り圧縮して容量を下げて、サイトスピード表示に優位にしようとすると、今度は画質が荒くなり見た目が悪くなる事です。
この画像圧縮と描画スピードはトレードオフの関係になりますので、あるところでの妥協点が必要になるのです。
ここも、使用するあなたのさじ加減一つで変わってきてしまう所なんですね。
wordpress画像圧縮のプラグインは？
それでは、wordpressにはどんなプラグインが有るのでしょうか？
過去に何回か紹介しているのですが、一番有名なのがEWWW Image Optimizerと言うプラグインでしょう。
https://daini-no-jinsei.jp/blog/wp-plugin/
EWWW Image Optimizer
このプラグインが、多分最もポピュラーで使用されているものだと思います。
実際にはインストールして、基本設定を実施するだけで自動で行ってくれますので、ユーザーはあまり意識しなくても良いです。
また、既にアップロードされている過去の画像も一括効率化できる機能も有りますので、過去画像も含めて対応が可能。
しかも、無料ですので過去の画像を一気に処理しても、追加費用は掛からないところが優れております。
但し、欠点と言う欠点ではないですが、思ったほど画像が圧縮されないと言う事です。実質3～5%の圧縮のようですが、この数値をどうとるのかはあなた次第だと思います。
一方、3～5%の圧縮率に対して劇的な改善を実現してくれるのがImagifyと言うプラグインになります。
Imagify
wordpressの画像自動圧縮プラグインとしては、先のEWWW Image Optimizerがあまりにも有名なので、知っている人は少ないかもしれません。
そしてもう一つ、このプラグインは月の使用料が無料の場合には20MBと極めて少ないので、画像を沢山使用するブログの人や、過去画像を一気に圧縮しようと考えている人にはちょっと向きません。
こちらも基本的にはEWWW Image Optimizerに機能は準じていると思いますが、無料で使用できる容量が設定されている事くらいが違いでしょう。
おっと、忘れていました画像圧縮率は3段階で選択でき、圧縮率はEWWW Image Optimizerとは比べ物にならないほど高効率でした。
それではImagifyのできる事を表記してみます。
- 画像の圧縮度合いを三段階で選べる
- 圧縮レベルを画像ごとに変更可能
- すでに投稿済の画像も圧縮可能
- 圧縮のやり直しができる
- 毎月20MBまで無料、超えると圧縮できず（来月迄待つ）
- jpg、png、gif形式の画像に対応
実際には、まずプラグインの新規インストールでImagifyをインストールします。
EWWW Image Optimizerと共存できないので、Imagifyを使う場合はEWWW Image Optimizerを無効にする必要があるよ。
もし、EWWW Image Optimizerを使用していたならば、EWWW Image Optimizerを無効かしてからImagifyを有効にしてください。
単に有効化しただけでは、Imagifyは未だ使用できません。APIキーを入手して登録する必要があるんです。
まずはメアドを登録すると、そのメアドにAPIキーが送られてきます。送られてきたAPIキーを入力し、設定する事で完了となります。以下の流れですね。
登録が完了すると、初めて設定画面に進むことができます。
General Settings
この画面では、圧縮率とその他のオプションが選択できます。
圧縮は「NORMAL」「AGGRESSIVE」「ULTRA」の３つから選択することができ、凡その圧縮率としては以下になります。
- NORMAL 5%前後
- AGGRESSIVE 60%前後
- ULTRA 80%前後
NORMALと言われているのが、EWWW Image Optimizerと同じくらいですかね。やはり初期値のAGGRESSIVEで使用することをおススメします。
この項目でのオプションは3つ
- Auto-Optimize images on upload
- Backup original images
- Keep all EXIF data from your images
となります。
１．Auto-Optimize images on upload
ここにチェックをいれておけば、画像をアップロードする際に自動的に圧縮してくれますので、このオプションは必須項目ですね。
２．Backup original images
これは、過去にアップロードされた画像を選択し圧縮させるためのオプションです。
メディアからライブラリーを選択すると、既にアップロードされた一覧が出てきますので、そこから圧縮したい画像を選択し、圧縮をかけます。
こんな感じで、過去の画像も圧縮が可能なんです。また、右側を見ていただくと分かるのですが、圧縮率の変更やオリジナル画像を保存するなのどの設定もできるのです。
公開しないように、オリジナルは保管した方が良さそうね。
３．Keep all EXIF data from your images
このオプションは、写真の中にデータとして入っているカメラの機種や撮影場所など撮影時の情報のEXIFデータを消去するオプションです。
個人情報の漏洩を防ぐためにも外しておきましょう。
Optimizationの設定
次がOptimazationの設定になります。
最初はWebPと言われる画像にするかどうかの選択です。
WebPはGoogleが開発した画像のファイル形式で、データ容量を小さくできるのが特徴ですから、チェックは入れておきましょう。
最近のテーマで高速化オプションが有るものは、かならずWebPの設定が入っていますね。
次のMEDIA LIBRARYはアップロードする際に、大きな画像は所定の大きさに自動サイズ変更をするオプションです。
当然、画像が小さい方が容量は節約されますので入れておきましょう。
次がFile Optimizationです。これは、圧縮対象となるファイルを設定するもので、あまり小さなサイズを圧縮しようとしても、大きな効果は得られずに圧縮用の作業領域を減らすだけになりますので、小さい画像はチェックを外すことをお勧めします。
Display Option
最後がDisplay Optionです。このオプションにチェックを入れておくと上部のツールバーにショートカットが表示されるようになります。
こんな感じで、無料容量の消費状態も確認出来ます。非常に便利です。
wordpress画像圧縮のプラグインImagifyを使ってみて
実際にEWWW Image OptimizerからImagifyに切り替えて使ってみた感想です。
まず、途中で出したタイトル画像は元々2M程度有りました。それを手動でImagifyを使用して圧縮してみたところ、84.22%節約できて377KBになったのです。驚異的ですよね。
驚異の圧縮率でこれなら効果ありそうね
この結果、サイト表示スピードで今まで一番問題になっていた、画像表示速度の影響が殆ど無くなり、今度は実際に使用しているレンタルサーバーのレスポンス自体が問題になるようになってきました。
このプラグインを使用した結果により、Googleのサチコで実施する速度測定判定では、このプラグインを使用する前と後では速度が2倍以上高速化されました。
従って、サイト表示が遅いなって思っている方は是非試してみるとよいかもしれませんね。
迷わず効果確認をしてみよう！
wordpress画像圧縮の最適化のまとめ
今回は、サイト表示に大きく影響する画像描画速度を改善するためのプラグイン記事を書きました。
サイト表示速度はGoogleのサイト判定でもユーザー利便性と言う意味からもチェックが入っているようです。
確かに表示速度の遅いサイトは離脱率が高いと思いますので、改善は必須です。
今回、そのサイト表示スピード改善で一番効果が有る画像圧縮について書いたポイントは以下になります。
- 使用する画像はアップロードする前に圧縮処理をする
- 使用する画像はアップロードしながら圧縮処理をする
- 利便性を考えると、wordpressのプラグインが最適
- wordpress出ない場合は、Webサービスを使用する
- wordpressプラグインはImagifyが最高
この内容を理解していただき、サイト運営に反映させていただければ、サイト品質向上に対して効果が見込めると思われます。
迷ったらプラグインを入れてみよう
