<上級編>ページ表示速度改善の施策をお見せします

この記事を読むべき人

  • より深い上級者向けページ速度改善方法を知りたい人
  • 基本的な改善は終えている人
  • html,javascriptが多少分かる

 

この記事のポイント

 

 

こんにちは、T社長です。

この記事は上級編になるので、基本施策がまだ完了していない人は以下の記事から↓↓

 

実際にSEO対策のページ速度改善としてクライアントに提供している施策を公開・解説いたします。

多少コードの話も出てきてしまいますがご了承ください。

Page Speed Insightsのラボデータについて

おそらく多くの方がPageSpeed Insightsのツールを使ってページ速度の改善案を探すと思います。

ラボデータ

この画像見たことあるかと思いますが、なんぞやって感じですよね。

  • First Contentful Paint(FCP)
  • Largest Contentful Paint(LCP)
  • Cumulative Layout Shift(CLS)

取り急ぎはこの辺に絞って理解してもらえたら大丈夫かなと。

First Contentful Paint(FCP)

ユーザーが URL をクリックしてから、サイトを表示させるための要素をレンダリングするまでの時間を指します。

速度の分類については、0~1 秒未満の場合は「高速」、1以上~2.5 秒の場合は「平均」、2.5 秒以上の場合は「低速」とされています。

FCPとFMPの違い

Largest Contentful Paint(LCP)

ユーザーがページ内にアクセスしてから、メインコンテンツを見ることができるようになるまでの時間を指し、ユーザーの認識としての「ページ表示速度を測る指標」のこと。

メインコンテンツとは、ユーザーや運営者によって依存する部分があるので、はっきりと「どのようなコンテンツがメインコンテンツである」とは定義することが難しいのが現状です。

ページ読み込みから2.5秒未満なら「良い」、4秒以下なら「要改善」、4秒を超えると「不十分」と判断されます。

 

Cumulative Layout Shift(CLS)

読み込み時にページレイアウトの移動量を示しています。

ページの読み込まれていくと下にどんどんズレていくページを見たことはありませんか?
無限スクロールができるページなどはこれに当たってしまうので相性が悪いです。

あとブログでTwitterを埋め込みしていたりすると低い点数になりますね。

評価スコアの範囲は 0~1 で、0 は移動なし、1 は移動量が最大を意味します。つまり0に近い方がいいということです。

項目についてはこのくらいの理解でOKです。

 

ページ速度改善項目について

パフォーマンス改善できる項目

今回具体的な施策としては多くのサイトに当てはまる以下について具体的に作業をしていきます。

  • 使用していないJavaScriptの削減
  • レンダリングを妨げるリソースの除外
  • 使用していないCSSの削減

レンダリングの仕組みについて

作業に入る前にレンダリングの仕組み、サイトがどうやって読み込まれていくのかを知っておくと納得いくのではないかと思います。

 


以下についてお困りの方ご依頼お待ちしています

SEO対策コンサルティング

SEOの課題、改善点のアドバイスをさせていただきます。

アフィリエイト・広告運用

アフィリエイトのご依頼、web広告、sns広告の運用代行など可能です。

インフルエンサー キャスティング

インフルエンサーマーケの独自のノウハウを構築しています。
ご相談ください。

WordPressの構築・カスタマイズ

ワードプレスの完全オリジナル構築や既にあるサイトの改修が可能です。

webデザイン & web構築

webサイトデザイン設計〜コーディングまで一貫してお受けできます。

ご相談はこちら

    お名前 (必須)

    会社名

    メールアドレス (必須)

    電話番号

    題名

    メッセージ本文