Googleが表示速度の速いサイトを高い評価にしているのはご承知のとおり。
ウェブを見るユーザーのお客様ご自身が、速く表示されるサイトのほうがうれしいと思うはずだからね。
だから、表示速度を速くする改善をやってます。しょっちゅうじゃないけど。そのメモ帳です。
１．Googleのページスピードインサイト
表示速度の測定は、Googleが提供しているページスピードインサイトというサイトで調べることが可能です。
速度を調べるだけでなく、改善すべきポイントも表示してくれます。
まあ、Googleにしてみれば、
わたしたちはあなたのサイトの表示速度について、この部分がこんな風に遅いから、改善したほうがいいよ。そしたら評価を高くしてあげるよ
てなもんでしょうか。
２．まず、このはてなブログ
このはてなブログの測定結果は
モバイル ５８（Poor：はよ改善せえ！）
パソコン ６５（Needs Work：ちったあ）
です。
数字（スコア。１００店満点）と英文が表示されます。日本語訳（お下品ですみません）はわたしのオリジナルの補足説明です。
この記事の主役はWordPressのブログなのでさっと通り過ぎます。
３．WordPressのブログ
WordPressのブログについて、これまで表示速度を高める策を打ってきているので、ご紹介しますね。
（１）最初の測定値
いろいろ手を打つ前に測定した結果です。
モバイル ５６
パソコン ６５
このはてなブログとほぼ同程度のスコアですね。
（２）最初にやったこと、画像の圧縮
ページスピードインサイトで測定すると、こんな画面が出てきます。
スコアと、スコアを改善するための対策が表示されます。
いろいろあるんですけど、この中で最もやりやすいのが「画像を最適化する」です。
要は、画像の容量を少なくしなさい、ということですね。
画像の容量を少なくするには、
- 画像のサイズを小さくする
- 画像の質を下げる
があります。
Macのデフォルトのアプリ「プレビュー」で言えば、画像を保存・書き出しする際、「品質」をどの程度に設定するかを変更できます。
最低（容量小）←→高品質（容量大）
可能な限り容量を小さくなるよう設定して保存・書き出しするといいですね。
素敵な写真を紹介する記事でなければ、品質を落としましょう。
わたしの場合、画像の容量を小さくして記事に貼り直す、というのを３枚ほどやって、スコアが１ずつ改善しました。つまり、
モバイル ５６→５７
パソコン ６５→６７
となりました。
画像の最適化は、確実にスコアが改善する作業です。
（３）画像の圧縮には、こんな方法も「EWWW Image Optimizer」
画像の圧縮には、プラグインを使うという方法もあります。
WordPressで活躍するプラグイン。機能を付加する部品みたいなものですね。
画像の圧縮のためのプラグイン、EWWW Image Optimizer。
これは、あらたに画像をアップロードする際に圧縮する（容量を小さくする）機能と、すでにアップロードした画像の圧縮もできるすぐれものです。
まだこのプラグインを入れてない方はぜひ入れてください。
使い方は、こちらのサイトでも詳しく紹介されてます。
EWWW Image Optimizerの設定方法と使い方を完全マスター【2017年版】
でも、プラグインは逆に注意しなくてはならないこともあります。
「スクロールせずに見えるコンテンツのレンダリングをブロックしている JavaScript/CSS を排除する」
という改善策が表示される場合がありますが、そこにはプラグインが関係していると思われるものが含まれてる場合があります。
わたしの経験上、「Ptengine」というプラグインを外したことで、スコアが２ポイントくらい改善したこともありますので。
なんでもかんでもプラグイン突っ込むと遅くなることがあります。
（４）最も効果が大きかった方法、テーマの変更
WordPressの魅力の１つが、テーマです。
はてなブログにも「テーマ」がありますね。
ブログの見た目を変えることができる機能です。
わたしの、現時点での高速表示のための取り組みで最も効果があったのが、テーマを「Luxeritas」に変更したことです。
結論から先に言います。
モバイルが２、パソコンが９、スコアが改善しました。（前項の画像圧縮との時系列的なつながりはないので、改善前のスコアは気にしないでください）
パソコン ６０→６９
モバイル ５５→５７
このテーマ「Luxeritas」（ルクセリタスと読むそうです）に出合ったのは、NAEさんの以下のブログ記事です。
この力強い記事に触れたら、もうLuxeritasに変えないではいられません。
こちらのテーマ開発者ご自身のサイトをご覧いただき、あなたのサイトも改善してください。
過去のWordPress関連記事
