ブログ運営をしてたら必ず耳にする『ＳＥＯ（サーチエンジン最適化）』。それに少なからず影響するのが「表示速度」です。
表示速度が遅いと見てくれているユーザーに「イライラ」を与えてしまい「もういいや」とブログから離脱～となってしまいます。
逆に表示速度が速いと見たいのもをサクサク見れるのでストレスを軽減できます。
そのため比較的重要度が高い項目の一つとなっています。
表示速度を調べる場合「 PageSpeed Insights – Google Developers」で調べることができます。
残念なことに当ブログは「そんなの関係ね～」と放置状態だったため表示速度がこの通りでした・・・・・・
ＰＣの表示速度スコア
モバイルの表示測度スコア
はい、この通り大重症・・・
では、ここから
①「テーマ変更」と「プラグイン」を最少化
まず最初に取り掛かったのはワードプレスで使用している「プラグイン」を最小限に減らしました。その時まで使用していたプラグインは以下のものです。
・Jetpack
・Akismet Anti-Spam (アンチスパム)
・All In One SEO Pack
・AMP
・Gutenberg
・Classic Editor
・Contact Form 7
・EWWW Image Optimizer
・Google XML Sitemaps
・Twenty20 Image Before-After
・WP Multibyte Patch
・WP Retina 2x
・WP Fastest Cache
・AddQuickTag
・ TinyMCE Advanced
・Word Balloon
あまり何も考えずに入れていった結果、結構な量・・・
ここからいらないものを減らしていくんですが、その前にプラグインを最少化で運営できるワードプレステーマに変更することにしました。
色々と検索すると候補として位以下のものに
・THE THOR（ザ・トール）
・SANGO
・JIN
・Genesis
・Luxeritas
僕自身の選択条件は、
・ＳＥＯの設定ができること（All In One SEO Pack機能が備わっている）。・カスタムに時間をとられたくない（デザイン性もある）。
・多機能性（細かい設定が可能）。
・ビジュアル的にかっこいいもの。
・回遊率を高めたい。
などなど、、、きりがなかったのでこの辺までに。
そして決定したのが「THE THOR（ザ・トール）」でした。このテーマの詳細はそのうち記事にするかも・・いやしないかも。
詳細は公式ページで。
「THE THOR（ザ・トール）」の設定は今回の記事では省略。
導入後のプラグインは
・Akismet Anti-Spam (アンチスパム)・Contact Form 7
・EWWW Image Optimizer
・Twenty20 Image Before-After
・Word Balloon
・WP Multibyte Patch
・Akismet Anti-Spam (アンチスパム)
・Classic Editor
・AMP
ここまで減らすことができました。
この結果表示速度は、
ＰＣの表示速度スコア
モバイルの表示測度スコア
おお～～、イイ感じになってきましたね。でもまだまだ改善できそうなのでさらに続く。
正直まだいらなそうなもの「Contact Form 7」「Classic Editor」あたりは、今後検討していきます。
「JPG」「PNG」画像を「WebP」化にする
WebP化
にするにあたり導入しているプラグイン「EWWW Image Optimizer」でできるのでいざ実行へ。
【ダッシュボード】から【設定】から【EWWW Image Optimizer】を選択。
【WebP】タグを開き【JPG, PNG から WebP】内の
にチェックをいれ【設定を保存】。
するとコードが表示され「htaccess」ファイルに記載してくれと。
そのまま【リライトルールを挿入】。
右隅の赤い【ＰＮＧ】表記が緑色の【ＷＥＢＰ】に表示されれば大丈夫です。
これでうまく挿入できる場合と、うまくいかない場合があるようです。理由はよくわからないですが使用しているサーバーによってなどの意見もチラホラありました。
上手くいかなかった場合「htaccess」ファイル直接記述します。
エックスサーバー「wpX Speed」の場合、管理画面から【設定】を選択。
「.htaccess」の【編集】を選択します。
ファイル内の最初のほうに先ほどのコードをコピペし設定を保存します。
これで緑色の【ＷＥＢＰ】に表示されます。
「EWWW Image Optimizer」でいざＷｅｂＰ化
ワードプレスのダッシュボードから【メディア】内の【一括最適化】を選択。
にチェックをいれ最適化を開始します。
これでWebP、最適化が実行されます。後は待つのみ！
ブログで使用している画像の枚数によって非常に時間がかかります。等ブログではなんと「６４６０５」の画像数。時間にして２４時間は軽くかかりました。
完了したら確認したいブログ画面を見ている状態で【F１２】キーを押すと確認できます。
変換されていない画像もありますが、これは広告の画像であったりテーマに入っている画像であったりなのでメディアにアップロードした「ＪＰＧ」「ＰＮＧ」画像以外なので気にせずに。もしまばらでWebP化されていないようなら何度か試みてください。
実際３回ほど最適化してみました・・・一週間くらいかかっています・・・・
「第三者コードの影響を抑えてください」を解消
「PageSpeed Insights」で確認すると「第三者コードの影響を抑えてください」という項目がありその中に「google/doubleclick ads」が一番表示速度の低下に貢献していました。
これは「アドセンス広告」のようです・・・
色々調べた結果「アドセンス広告」を遅延読み込みすればＯＫだよ。ってことみたいなので早速やってみました。
この項目については非常にわかりやすく解説されているサイトがあったので紹介しておきます。なので手順は当ブログでは省力です。
「サイトの読み込み速度が遅い」「Page Speed Insightsの第三者コードの影響」って何？という悩みを解決しま…
今回行った項目はここまでです。そしてその結果は、
ＰＣの表示速度
モバイルの表示速度
まとめ
サーバー環境は、
「WordPress専用の高速クラウド型レンタルサーバー『wpX Speed』」
今回行ったのは、
①ワードプレステーマの変更
②プラグインの最小化
③画像のＷｅｂＰ化
④「第三者コードの影響を抑えてください」を解消（アドセンス広告の遅延読み込み）
以上４つの項目です。
モバイルの項目はまだまだ改善の余地がありそうなので引き続き行っていくよていです。
また今回なぜ改善を試みたかというと最近頻繁に起こっているGoogleのアップデート。これによって当ブログも少なからず検索結果、アクセス数に影響がありました。
このことからブロガーの方々の中には「オワコンだ！」と叫ぶ人もいますが、逆に言えば今しっかりやっていればライバルに少しでも差をつけていける、ピンチはチャンスだと思います。
僕にとってはGoogleからの「しっかりやれよ」というアドバイスで「見直す」きっかけとなり良かったなと感じています。
また、第二段改善の全容を書き留めていくので参考になればと。
