PageSpeedの改善は早めに取り組みましょう

Google Adsenseから収益アップのためにPageSpeedの改善提案のメールが届きました。HTMLメールにはPageSpeedの重要性を語っているページへのリンクがありました。（上記はリンク先キャプチャー画像）

▼Why is mobile speed important?
https://www.doubleclickbygoogle.com/articles/mobile-speed-adds-up/

上記ページの内容をGoogle翻訳で翻訳しました。

なぜ、移動速度が重要なのですか？
私たちのモバイル第一世代では、世界のすべての情報を手に入れただけではなく、探している瞬間にそれを得ることが期待されます。
残念ながら、ほとんどのモバイルサイトは、ネットワーク速度の大幅な向上にもかかわらず、この期待に応えられません。 サイトの読み込みが遅いと、ユーザーエクスペリエンスの悪いユーザーが迷惑を掛け、サイト運営者の収益が低下します。
あなたは例外的なことができます – 慎重な計画で、あなたはモバイル速度のためにあなたのサイトを最適化することができます。 以下のモバイルウェブ収入計算機は、モバイルウェブサイトのスピードを最適化することで収入を増やす方法を探るのに役立ちます。

（Google翻訳結果より）

上記リンクと共に、Googleは「スクロールせずに見える範囲のコンテンツを 1 秒で読み込んで表示しましょう」というメッセージと以下3点の改善を勧めていました。

1. 遅延読み込み
   ユーザーがスクロールした場合にのみページを読み込みます
2. インライン CSS
   CSS を 2 つに分け、インライン CSS をスクロールせずに見える範囲に使用します
3. 画像サイズの圧縮
   ウェブページの画像を圧縮します

遅延読み込みは使い方によりますが、URL遷移なしで読み込み続けるのはユーザビリティに難があるので必ずしも同意しません。タブレットのYahoo!検索は「もっと見る」ボタンでページ遷移なしで次の検索結果を読み込みますが、ウェブページから戻ると検索結果を保持してくれません。URLごとに表示内容を一定にする方がユーザビリティは良いと考えます。

後者2つ「インライン CSS」と「画像サイズの圧縮」はPageSpeed InsightsでもGoogleが推しています。そして手間がかかるので、ウェブデザイナーとしてはやりたがらないだろうないようです。私のチームでも浸透させるのに少し時間がかかりました。作り手の意識を変えないと実現できないことです。PageSpeed Insightsの攻略法についてはこちらをご覧ください。

▼PageSpeed Insightsで100点を取る方法
https://www.web-ma.co.jp/column/crawlability/98.html

モバイル速度改善に取り組むこと

2017年はモバイルファーストインデックス導入が注目されています。モバイルページの評価がデスクトップ含めてGoogle検索のランキング基準になります。モバイルのランキング評価基準にはウェブページの表示速度があり、Googleは速度チェックのツールを提供しています。

▼PageSpeed Insights
https://developers.google.com/speed/pagespeed/insights/

PageSpeed Insightsに取り組むと分かりますが、普通にHTMLコーディングをしても合格点にはなりません。PageSpeed Insightsでスコアを獲得するためにわざわざ取り組む必要があります。特に画像は常に圧縮しないといけません。一度対応したらOK、という訳ではありません。普段の運用を一手間かけないといけないのです。

今回はGoogle Adsenseからのメールなのですが、GoogleがイチオシなのでPageSpeedなんだろうなあと改めて感じました。