CLS– tag –

はじめに 「WordPress高速化」シリーズの第8回です。XとInstagramの埋め込みは、記事のずっと下にあっても、ページを開いた直後に合わせて約1.1〜1.6MBを読み込みます。 この記事では、【WordPress高速化】YouTube埋め込みを遅延読み込み（以下「第3回」）...

はじめに 「WordPress高速化」シリーズの第6回です。【WordPress高速化】目次の高さを見出しの数で自動設定（以下「第5回の記事」）では、PHPで見出しを数えてCSS変数に渡し、SWELLの目次の高さを記事ごとに自動で確保しました。 ただ、第5回の記事の式は...

はじめに 「WordPress高速化」シリーズの第5回です。【WordPress高速化】SWELLのCLSをCSSで改善（以下「第2回の記事」）では、SWELLの目次に min-height で高さを確保して、ページのずれ（CLS）を減らしました。 ただ、この方法では目次の高さをどの記事で...

はじめに 「WordPress高速化」シリーズの第2回です。【WordPress高速化】CLSの原因を検証ツールで探す方法（以下「前回の記事」）では、Chromeの検証ツールで、ずれた場所を見つけて高さを測る方法を紹介しました。 今回は、その続きです。当サイト（WordP...

はじめに 今回から、WordPressブログの表示速度や見やすさを改善する「WordPress高速化」シリーズを始めます。第1回は、ページの表示がガタッとずれるCLSの原因を、Google Chromeの検証ツール（DevTools）で見つける方法です。 きっかけは、当サイトで実際...

CLS（Cumulative Layout Shift/累積レイアウトシフト）に対する指摘は2月5日に無事合格しました。 ウェブに関する指標で「要改善」と指摘されている「Interaction to Next Paint (INP)」というものがまだ一つ残っています。INPの改善に向けてどうしていけ...

CLS（Cumulative Layout Shift/累積レイアウトシフト）に対する改善の継続メモです。今回は、Google Adsense の広告で発生しているCLSを改善したいと思います。 アンカー広告のレイアウトシフトを改善したい レイアウトシフトが発生している原因は、ページ...

CLS（Cumulative Layout Shift/累積レイアウトシフト）に対する改善メモです。今回は、The Moneytizer の広告で発生しているCLSを改善したいと思います。 グループの「累積CLS」が改善しない Google Search Console の「ウェブに関する主な指標」（モバイ...

Google Search Console の「ウェブに関する主な指標」（モバイル）でCLS に関する問題: 0.1 超 「改善が必要」という状況が突然が発生しました。11/13から現在も継続しています。 グループの CLS 改善が反映されない 「画像要素で width と ...