JetTheme v2.9 にアップデート。ページエクスペリエンスの改善を期待

JetTheme v2.9 にアップデート。ページエクスペリエンスの改善を期待

JetTheme v2.9 にアップデート。ページエクスペリエンスの改善を期待

重い腰を上げて、ようやく JetTheme v2.9 にアップデートしました。

旧版テンプレートにはすでに多くのカスタマイズを施していたので、修正は大変そうだなと先延ばしにしていて、そのうちに「現状で不都合もないし面倒だし、アップデートはしなくても良いかも」と思い始めてたんですが。

ついにアップデートした理由は、Google Search Console のページエクスペリエンスの低下。

詳細を見ると LCP に問題が出ているとのことでした。

LCPの問題

とりあえず PageSpeed Insights を見てみると、確かに LCP は悪くてどのページも 2.5 を超えていました。

しかし、これといった原因が特定できず。

モバイルのスコアは 90 〜 95 くらいでそんなに悪くないし、指摘されるのは Bootstrap の CSS ファイルの「レンダリングを妨げるリソースの除外」と、「最初のサーバー応答時間を速くしてください」という対処不能のやつ。

「最初のサーバー応答時間」については前々から指摘は出ていましたが、最近やたら画像表示が遅いのは気になっています。でもこちらとしてはどうしようもできません。

Bootstrap に関しては、アップデート版の v2.9 テンプレートを見てみると CSS ファイルの箇所が非同期処理をする記述に変わっていました。

じゃあとりあえずということで、Bootstrap の箇所だけ変えてみたところ今度は別の指摘が。。一部だけ変えても最適化されないようだったので、この機会にアップデートしようと決めました。

アップデートでページエクスペリエンスが改善されるなら原因探しをしなくて良いので。。

あの急降下グラフを見たら急に危機感が出ましたね。

※追記(2022/4/1)
結局、LCP の悪化は JetTheme のバージョンの問題ではありませんでした。別の場所に原因があり、現在修正中です。

アップデートはまぁまぁ大変でした。

Bootstrap の良さが裏目に出たというのか、カスタマイズの際に CSS だけじゃなく HTML 側にも結構クラスを追記したり書き換えたりしちゃってたんですよね。

できれば既存のテンプレートにアップデート分のみ追記したかったんですが、カスタマイズしすぎてて差分すらよくわからないという状態。

追記で済ませるのはほぼ無理っぽかったので諦めて、ほかの JetTheme ユーザーの方のように v2.9 テンプレートに再度カスタマイズを施す形になりました。

作業としては、テストブログに v2.9 を反映させてカスタマイズしてから、本番ブログに反映して最終調整。現在はまだ、修正漏れなどの不備がないかブログ全体を見て回っているところです(気晴らしにこの記事を書いてます)。

カスタマイズは何をどうやってやったんだっけーと思い出すところからでしたが、自分が前に書いた JetTheme のカスタマイズ記事がおおいに役立ちました。

今回のアップデート、修正はまぁまぁ大変でしたがカスタマイズを整理する良い機会だったと言えるかもしれません。

JetTheme 導入時は細かい部分もいろいろカスタマイズした気がしますが、今回は面倒だし大差ないし別にいっか、となる箇所も多数。今後またアップデートがあるかもしれないので、適度に適当に終わらせました。

ついでにデザインやブログロゴも変えました。

ブログロゴは再び Inkscape を使って SVG で作り直しましたが、2回目だったので20分くらいでできました。

ページスピードに関しては、Bootstrap の CSS ファイルの指摘は出なくなってました。よかった。

あとは、ページエクスペリエンスが改善されるのを待つだけです。

※追記:2カ月経って、ようやく改善されました。

ページエクスペリエンスの改善に2カ月かかった

ページエクスペリエンスの改善に2カ月かかった

「LCP の問題: 2.5秒 超(モバイル)」が出たため、改善策を実施して LCP はほとんどのページで改善できました。が! PageSpeed Insights では LCP は改善できているにも関わらず、ページエクスペリエンスが戻らない。

こちらの記事もよく読まれています
ブログを1カラムに変更した理由と、変更した結果(直帰率・平均ページ滞在時間)

ブログを1カラムに変更した理由と、変更した結果(直帰率・平均ページ滞在時間)

ブログのレイアウトを2カラムから1カラムに変更しました。この記事ではレイアウトの変更理由と、その結果直帰率がどうなったかなどを紹介したいと思います。

記事へのコメント・ご質問は こちら まで
NEXT PREV