PageSpeed Insights(ページスピードインサイト)2018年11月仕様変更への最適化について
2ヶ月ほど前に「2018年Speed Update対応版」としてPageSpeed Insights(ページスピードインサイト)の最適化について記事を掲載しました。
http://blogs.itmedia.co.jp/webnoma/2018/09/10.html
その後PageSpeed Insightsの仕様変更があり、2018年11月からスコア付が厳しくなりました。弊社サイトの点数はこちら。
以前はモバイルで98点だったのでかなりの減点となりました。なのでリカバリーのために対処したところ以前の点数に戻りました。
パソコンはこちら。モバイルファーストインデックス導入済みなのでSEOとしてはスコアは関係ありませんが、ユーザー体験としてはスコアは高い方が良いです。体感速度も変わりました。
2018年11月仕様変更への最適化対策
以前のPageSpeed Insightsは検証項目が10項目しかありませんでした。2018年11月より項目が増えて22項目となりました。スコアが98点とはいえ合格した監査は22項目中19項目です。今回調査した結果、以下の点で以前よりもスコア付が厳しくなっています。
- オフスクリーン画像の遅延読み込み
- 適切なサイズの画像
- 過大な DOM サイズの回避
画像に対する処理と外部の埋め込みファイルが該当します。画像は表示に対して適切なサイズで用意することを求めています(特にファーストビュー)。また、表示領域以外の画像は後から読み込むことを推奨しております。最近はスマホで縦に長いページも多いのでユーザー体験からも実施すべきといえます。
「過大な DOM サイズの回避」というのは簡単に言うとHTMLのノード(オブジェクト)数を多くし過ぎないようにすべきということです。2018年11月現在、PageSpeed Insightsでの記述によると以下のように記述があります。
ページに含まれる DOM のノード数が 1,500 個を超えないようにすることを推奨しています。ツリーの深さは 32 要素まで、子や親の要素数は 60 個までにするのが最適です。
ノード数が増える原因としては外部の埋め込みファイルの読み込みです(適切にコーディングをしていると仮定して)。YouTubeの動画やSNSのタイムライン表示を入れるとノード数が跳ね上がります(同時に他の項目にも影響があります)。
このようにサイトの作り方やコンテンツの選択によってSEOに影響があることを意識しておく必要があります(少なくともPageSpeed Insightsスコアに影響する)。