SEO検索からの流入が絶賛激減中の当ブログ。
手をつくしているのだけど、なかなか浮上せず。
今回は、SEOランキングにも影響するサイトの高速化をおこないます。
スピードはランキングに影響する
AMP であるかどうかが直接 Google 検索のランキングに影響することはありませんが、スピードはランキングに影響します。
AMP が検索結果にどのように作用するかを理解する
Google検索セントラル AMP項目の記載にあるようにサイトの表示スピードは、SEOランキングに影響を与えています。
ページの読み込み速度をモバイル検索のランキング要素に使用します Google検索セントラル
https://developers.google.com/search/blog/2018/01/using-page-speed-in-mobile-search?hl=ja
デスクトップ検索にもスピード要素を取り入れていたものが、2018年7月よりモバイルにも適応されることになりました。
５G時代の現在では、よっぽど重たいサイト以外は影響を受けないでしょうが、高速道路が渋滞していたらイライラするのと同じ。
スイスイとページ表示されたほうがユーザエクスペリエンス的には良いです。
どちらにせよページ表速度は早いにこしたことはないです。
高速化してみます。
Autoptimizeの使い方
WordPressの高速化のためのプラグインはたくさんあります。
アクセスがあってからページ生成をするWordPressの動的なレスポンスを、ページをすでに作っておいて返答するキャッシュプラグイン「 WP Super Cache」などが有名。
今回は、比較的お手軽につかえる高速化プラグイン「Autoptimize」を使ってみます。
「Autoptimize」は、Javascript、CSSなどのコードを圧縮してページの反応速度を高速化させるWordPressプラグインです。
記事ページ全体をキャッシュするというよりは、JavascriptファイルやCSSファイルなど、記事ページのヘッダ内読み込みを高速化させる動きをします。
JINだけでなくどのテーマでも有効なプラグインです。
Autoptimize インストール
「プラグイン」＞「新規追加」から Autoptimize で検索。
「今すぐインストール」からAutoptimizeをインストールします。
Autoptimize 設定
インストール後は、左サイドメニューの「設定」＞「Autoptimize」から。
JS、CSS＆HTML
Javascript、CSS、htmlファイルの高速化設定を行います。
Jacascript
- JavaScript コードの最適化 にチェック
- 連結しないで遅延 にチェック
- インライン JS にチェック
CSSオプション
- CSSコードを最適化 にチェック
HTMLオプション
- HTML コードを最適化 にチェック
上記の設定がおわったら 「変更の保存とキャッシュの削除」ボタンから変更します。
古いキャッシュを削除して新しい設定を反映させないと、JavascriptファイルやCSSファイルの応答が古いキャッシュを見に行く可能性があります。
「変更の保存とキャッシュの削除」ボタンを押して更新してください。
画像
- 画像の遅延読み込み（Lazy-load）を利用 にチェック
画像を画面スクロールに応じて読み込んでいくLazy-load機能をONにします。
サイトスピードを確認
サイトのスピード測定には、Google公式プラグインである「SiteKit」を利用。
「SiteKit」は、WordPress内で、アナリティクスやアドセンスなどの状況がリアルタイムで確認できるプラグインです。
PageSpeedInsightでのパフォーマンス結果をみてみましょう。
PC
Autoptimize 適応前
Autoptimize 適応後
| PC | 適応前 | 適応後 |
| Largest Contentful Paint | 1.4秒 Needs improvement | 0.8秒 Good |
| Cumulative Layout Shift | 0.001 Good | 0.02 Good |
| Total Blocking Time | 120ミリ秒 Good | 70ミリ秒 Good |
スマホ
Autoptimize 適応前
Autoptimize 適応後
| スマホ | 適応前 | 適応後 |
| Largest Contentful Paint | 3.4秒 Needs improvement | 3.1秒 Needs improvement |
| Cumulative Layout Shift | 0 Good | 0 Good |
| Total Blocking Time | 2,100ミリ秒 Poor | 3,480ミリ秒 Poor |
大幅な改善は得られず
「Autoptimize」を適応させる前と後とでスピード計測した結果、それほど大幅な改善はありませんでした。
計測は、トップページでの数字になります。PCは、3項目ともGoodになりましたが、モバイルはむしろ時間かかってる項目も。
モバイルの場合 「Autoptimize」を適応する前から、ページ読み込みに3.4秒もかかってます。
そこでモバイルのトップページを2列から1列に変更してみましたが、あまり変換ナシ。
おそらく記事内の写真など、なにかの読み込みに時間がかかっているのでしょう。
これはもう、ページ全体をキャッシュさせて高速化してみるか。
今回導入した「Autoptimize」プラグインは、Jacascriptファイル、CSSファイルを圧縮して読み込み高速化を目的としたもの。
ネットワーク速度改善につながります。
「Autoptimize」は、全てのWordPressユーザーにおすすめのプラグインです。
戻ってこいオレのSEO！
