どうも、そいる塾長です。
前回書いたこちらの記事。
ひょんなことから再度計測することに。
再度サイトのスピードが問題に
ここまでは本当にCocoonのに標準機能で出来ることをやってたんですが、ここからさらに手を入れました。単なる自己満足ですがタイトル通り遊んでいます(笑)
その辺はまた詳しく書くとして、新たに入れたプラグイン、アニメーションを簡単に設定できるプラグインなのですがこれがきっかけで再度サイトスピードが気になることに。
今このサイトを開いてもらうと上からヘッダーとグローバルメニューがスライドインしてきます。あとふわっと記事が下からフェイドインしてきます。これはCSSで。もちろんほとんどコピペですが。
これで楽しくなってしまってもっといろいろ動かしたくなってしまったわけです。だって男の子だもん(中2感)
ということでアニメーションを簡単に設定できるプラグインを入れてしまったんですね。初心者がすべてCSSで書くのはめんどいし難しいので。それがこれ。
しかしネットでの評判を見るとこれがなんでもとっても重たいとのこと。でもやりたいことを実現するにはこのプラグインを入れるととっても楽ちん。ということで試しに入れてみたわけです。ダメなら削除すればいいですしね。
結果、そんなに重たくなったという感覚はなかったので安心していたんですがやはり少し気になって久々にこのサイトで計測を。これで沼に足を突っ込んでしまうことに…(-_-;)
前も紹介したこちらね。前回はこんな感じでした。
頑張った結果PCとモバイルの両方いい感じに持って行けたわけです。特にモバイルは99点ですよ!
ところが今回再度同じサイトですると計測すると衝撃の結果が…。
マジですか…こないだ99点よ?( ;∀;)
この数カ月でおれは何をしたというんだ…(いやそのプラグイン外せよという突っ込みはやめてください。簡単に認めたくないことってあるじゃないですか…男の子だから)ということで再度高速化に挑むことに。
ただ一つ気になる点が…。
こちらはPCサイト。え?なんで?めっちゃ健康そうな色と数字。
どうやらモバイルサイトだけに問題があるようです。
こんなことってあるんですね…う~ん、なんでだろう…(*_*; ※これがフラグです。
といことでPageSpeed Insightsさんに
こういうことですね。簡単に言えば…
画像が重いんだよ!
ということです。そりゃあれから記事を100くらい書きましたしいろいろ画像もアップロードしましたし。
てことでいろいろやってみますね。
とりあえずこれまで使っていたプラグイン
こいつを停止。代わりにこいつ↓を投入。
このCompress JPEG & PNG imagesの問題は圧縮できる画像の上限が500個/月という点。
今画像が900個くらいなので最初の一括圧縮で困るわけですね(;’∀’)
しかしとりあえず全画像EWWW Image Optimizerで一旦全体は圧縮しているのでできる限りでいいやということで早速使ってみるとこんな感じ。
画像が900個くらいあったので残念ながら上限の500個で引っかかり途中で止まってしまいましたがほとんどの画像でまだまだ圧縮できました。
てかこれ見て気が付いたのが私があげている画像がでかすぎるんですね(;’∀’)
jpgであげりゃあいいものをpngでサイズも気にせずバンバン挙げてたわけです。
EWWW Image Optimizerさんは弱いといっても一応圧縮してくれてたわけで、その結果MB級の画像を毎日挙げてたらそりゃ重いわなと。
初心者にはこんな当たり前のことを知らなかった自分が情けない( ;∀;)
調べてもなかなかアップロードした画像をpngからjpgに変換するのは面倒そうなので忘れよう。これから気を付けることに。
ちなみにCompress JPEG & PNG imagesはこちらのサイトのプラグインバージョン。
こちらのサイトで気楽に画像を圧縮できます。
ただなんせプラグインは圧縮できる上限に達したので一旦停止して再度EWWW Image Optimizerに戻しました^^;
いや圧縮もなにもそもそも画像がでかすぎる問題
そもそも画像サイズがデカすぎるんですよね。ポスターにするわけではないですからね。
これもなんも考えずにアップロードしてたな~…(;’∀’)ということで画像サイズ自体を小さくします。
ということで大きな画像を縮小してくれるプラグインを導入。
https://ja.wordpress.org/plugins/regenerate-thumbnails/Regenerate Thumbnails
こちらでこれからアップロードする画像は自動で指定サイズにしてくれます。そしてすでに使用している画像も一括で縮小。楽ちんですね。
そしてもう一つ。こちらは「フルサイズ画像の制限と過去画像のリサイズ」をしてくれるプラグイン。