GoogleSearchConsoleでCLSに関する問題：0.25超ってエラーの解決策

Google Search Console で大量のエラーが出ているので調べてみると、

となっていました。

Google様は、SEO対策で次から次へと難しい問題を出してくれます。

無視するとどんどん相手にされずに検索にも引っかかり難くなることが言われているので対応してみました。

CLSって何？

5月になったらGoogleSearchConsoleでウェブに関する指標が突然悪くなりＰＶも表示回数も激減

 前回の記事では、Google様が5月から、Googleコアアップデートを行ったことでブログサイトのページビューも表示回数も激減したことを書きましたが、 たまたま見たGoogleSearchConsoleのウェブに関する主...

ma2n2n.jp

2020.05.29

以前にも調べたことがありますが、今一つよくわかりません。

CLS（Cumulative Layout Shift）: 
読み込みフェーズにおけるページ レイアウトの移動量

推測ですが、ページが重いってことですかね？

PageSpeed Insightで調べる

たぶん、非常に悪い数値だと思いますが、下の方を見てみると

改善できる項目

というのが具体的にでていました。

この内容を見ると、

ってことですかね。

でも、EWWW Image Optimizerというプラグインを入れているんですけどね。

どうしたらいいの！？

EWWW Image Optimizer でWebPの設定（失敗）

また、新しいのが出て来たぞWebP

なにそれ！？

ウェブサイトのトラフィック量軽減と表示速度短縮を目的としており、インターネットのWebページで広く使われている非可逆圧縮のJPEGや可逆圧縮のGIF、PNGの置き換えを意図する規格である。JPEGとは異なり、非可逆圧縮でもアルファチャンネルを扱える。（引用：WiKi）

【画像で解説】EWWW Image OptimizerでWebPを設定する方法 | ブログ1つで週末起業家に。

この記事では自動的に画像を圧縮をしてくれるプラグインであるEWWW Image Optimizerのインストール方法と設定方法をご紹介します。 また、記事の後半では応用編としてGoogleも推奨している次世代の画像フォー

re-lifework.com

画像を「EWWW Image Optimizer」でWebPに変換する方法

WordPressプラグイン「EWWW Image Optimizer」を使い、次世代画像フォーマット「WebP（ウェッピー）」に変換する方法を解説します。

bokuafi.work

.htaccessまでいじってコードを追加してみました。

結果は、WebPにできませんでした。

ちゃんと動いているように見えてWebPにできないという何とも悔しい結果

WebP Express でWebP化

もうヤケになって、何でもやってみろ！って感じで、WebP Expressっていうプラグインを突っ込んで下記のような設定にしました。

有効前と有効後のPageSpeed Insightの結果が下記のようになりました。

次世代フォーマット配信での改善が消えた

PageSpeed Insightの結果を見ると、WebP Expressのプラグインを入れただけで次世代フォーマットの配信での改善項目がきえました。

また、ページの検証でどうなっているのか？を確認すると、画像がWebpに変更されているようです。

たぶんですが、WebP Expressのプラグインは、画像をWebpに変換している訳じゃなく、タグで画像形式のタイプをWebpに変更しているだけじゃないかと思うのです。

後々、本当の事が分かったらブログを更新します。