サイトが遅い、なんて思っていませんでした。
デザインはきれいにしました。文章もちゃんと書きました。Googleに見つけてもらうための設定も、ひと通りやりました。問題なんてないはずだ、そう思っていました。
ところが、Googleが無料で公開しているサイトの採点ツールで計測してみたところ、スコアは74点でした。
Googleの基準では、90点以上が「良好（緑）」です。50〜89点は「もっと良くしてください（黄色）」。わたしのサイトは、黄色でした。
LP（ランディングページ）を作ってお客様の集客を手伝っている立場なのに、自分のサイトが黄色だったというのは、正直恥ずかしかったです。そこから実際に改善した記録が、この記事です。
使ったのは無料の追加機能が1つだけ。設定は3つオンにしました。かかった時間は10分以内。それだけで74点が91点になりました。何をどうやったか、全部このまま書きます。
あなたのサイト、今何点ですか？Googleが無料で教えてくれる「通知表」の読み方
PageSpeed Insightsは、Googleが作った無料のサイト採点ツールです
「PageSpeed Insights（ページスピードインサイツ）」とは、Googleが無料で公開しているサイトの採点ツールです。
URLを1つ入れてボタンを押すだけで、そのページが「どれだけ速くて、使いやすくて、Googleに見つけてもらいやすいか」を0〜100点で教えてくれます。アカウントの登録も不要です。
URLはこちら：pagespeed.web.dev
スマートフォンとパソコン、それぞれのスコアが数十秒で表示されます。これはGoogleが実際の検索に使っている基準と同じなので、サイトを持っているなら必ず一度は確認してほしいツールです。
4つのスコアが意味すること
採点結果には4つのスコアが表示されます。
「パフォーマンス」は、サイトがどれだけ速く表示されるかです。これが今回改善したスコアです。
「ユーザー補助」は、文字が読みやすいか、ボタンが押しやすいか、誰でも使いやすいサイトかどうかです。
「おすすめの方法」は、安全な作り方で作られているかどうかです。
「SEO」は、Googleがそのページをきちんと読み取れるかどうかです。検索結果に表示されるために必要な設定が揃っているかを採点しています。
「スコアが低いと検索順位が落ちる」は本当か？正直に答えます
「採点が上がれば検索順位も上がる」と思っている方が多いですが、それは半分本当で半分違います。
Googleは2021年から、サイトの速さも検索順位を決める要因の一つとして使っています。
だからスコアはまったく関係ないとは言えません。ただ、検索順位に一番影響するのは、記事の内容と量です。速くても内容がなければ上位には来ません。
正確に言うと、「遅いことがマイナスになる」ということです。今回の改善は「マイナスをゼロに戻す」作業でした。それだけでも、やる意味は十分あります。
次の章では、わたしのサイトが74点だった原因を、数字ごと全部お見せします。
74点の正体。「なぜ遅いのか」を数字で解剖したら、原因は1つだった
ページが表示されるまでの時間が、9.0秒だった
採点結果のページには、スコアの内訳として細かい数字が表示されます。その中で一番目を引いたのが「LCP」という数値でした。
LCPとは、ページを開いてから「一番大きなもの（多くの場合は画像）」が画面に表示されるまでの時間のことです。ユーザーが「あ、ページが出た」と感じる瞬間と考えてもらうとわかりやすいです。
わたしのサイトのLCPは、9.0秒でした。
つまりスマートフォンでわたしのサイトを開いた人は、最初の画像が見えるまで9秒間、真っ白な画面を見続けていたことになります。
基準は2.5秒以下。わたしのサイトは3.6倍遅かった
Googleが「速い」と認める基準は2.5秒以下です。2.5〜4.0秒は「もう少し」、4.0秒を超えると「遅い」と判定されます。
わたしのサイトは9.0秒でした。「速い」基準の3.6倍です。
どれだけ良い文章を書いていても、読み込みに9秒かかるページをスマートフォンで待てる人はほとんどいません。
犯人はほぼ「画像の重さ」だけだった
なぜ9秒もかかっていたのか。採点ツールの詳細を見ると、「画像を軽くするだけで約1.2MB減らせます」という赤い警告が出ていました。
WordPressは、画像をアップロードしても自動では軽くしてくれません。そのままの重さでユーザーのスマートフォンに届きます。わたしのサイトには画像が190枚ありました。それが全部、重いまま置かれていたわけです。
次の章では、この問題を10分で解決した手順をそのまま書きます。
追加機能1本・設定3つ・10分以内。EWWW Image Optimizerの全手順を公開します
インストールから有効化まで（手順そのまま）
使ったのは「EWWW Image Optimizer（イーダブリュー イメージ オプティマイザー）」という無料の追加機能です。世界中の600万以上のWordPressサイトで使われている、定番の画像軽量化ツールです。
WordPressの管理画面から「プラグイン」→「新規追加」を開いて、「EWWW Image Optimizer」と検索します。出てきたら「今すぐインストール」→「有効化」を押します。これだけです。
有効化すると設定の画面が始まります。「サイトを高速化」にチェックを入れて、「今は無料のままにする」を選んで「次」を押します。
ONにするのは3つだけ
次の画面に推奨の設定が3つ並びます。
「メタデータを削除」は、画像の中に隠れている余分な情報（撮影した日付やカメラの機種など、表示には関係ないデータ）を消して、画像を軽くする設定です。
「遅延読み込み」は、今画面に見えていない画像は後回しにして、見えている部分だけ先に表示する設定です。最初の表示がグッと速くなります。
「WebP変換」が一番効果の大きい設定です。JPEGやPNGという昔からの形式の画像を、「WebP（ウェブピー）」という新しい軽い形式に自動で変換します。見た目はほぼ変わらないのに、ファイルサイズが25〜35%ほど小さくなります。
この3つをオンにして「設定を保存」を押します。
190枚を一括で軽くした実際の結果
設定を変えただけでは、すでにアップロードしてある画像には何も変わりません。「メディア」→「一括最適化」を開いて、「最適化されていない画像をスキャン」をクリックします。
わたしのサイトでは190枚が対象として出てきました。「最適化を開始」を押すと自動で処理が始まります。完了するまで画面はそのままにしておくだけです。数分で「190/190完了」と表示されました。
Before / After。74点が91点になるまでの全数値を見せます
パフォーマンス：74点→91点（+17点）
作業が終わった後、もう一度採点ツールで計測しました。
結果は91点でした。
74点から91点。17点の上昇です。数字だけ見ると小さく感じるかもしれませんが、74点は「黄色（要改善）」で、91点は「緑（良好）」です。色のゾーンそのものが変わりました。追加機能を1つ入れて、設定を3つオンにして、10分以内でこの変化です。
スマートフォンのスコアが黄色から緑になったことで、スマートフォンで見ている人への体験が大きく改善されました。
SEO・おすすめの方法は100点のまま変わらなかった
改善作業でSEOのスコアが下がっていないか、気になる方もいると思います。
結論から言うと、SEOは100点のまま、おすすめの方法も100点のままでした。
EWWW Image Optimizerは「画像を軽くするだけ」で、ページの骨組みには一切手をつけません。だから他のスコアに影響しないのです。
作業の前後で、サイトの見た目に変化はありませんでした。ユーザーから見ると、ただ「速くなった」だけです。
今日中にできる3つのアクション。あなたのサイトも今日変わります
①まず採点する（2分）
まず今のスコアを知ることから始めます。
ブラウザで「pagespeed.web.dev」を開いて、自分のサイトのURLを入れて「分析」を押すだけです。アカウント登録は不要です。
スコアが90点以上なら今のままで大丈夫です。90点未満なら、今日中に改善できます。
②EWWWを入れて一括で軽くする（10分）
スコアが90点未満だったら、EWWW Image Optimizerをインストールしてください。手順は前の章に書いたとおりです。WebP変換・遅延読み込み・メタデータ削除の3つをオンにして保存→一括最適化を実行、これだけです。
終わったら再度採点してみてください。
③Cocoonを使っているなら速度設定も確認する（5分）
WordPressのテーマにCocoonを使っているなら、管理画面の「Cocoon設定」→「高速化」タブも確認してください。キャッシュや遅延読み込みの設定がいくつかあります。これをオンにするだけで、さらにスコアが上がる場合があります。
設定を変えたら必ず再採点して、スコアの変化を確認してください。
おわりに：「自分で試したことしか、お客様には使わない」
自分でやってみて初めてわかること
今回の作業を通じて、一つ気づいたことがあります。
「知っている」と「自分でやってみた」は、全然違うということです。
74点という数字を見るまで、わたしのサイトが遅いとは思っていませんでした。
ページが表示されるまで9秒かかっていたこと、画像の重さが原因だったこと、追加機能1つで直せること——これは実際に自分でやってみて初めて、本当の意味でわかりました。
お客様のLP制作を行う上で、「これは効く」と自信を持って伝えられるのは、自分でやって数字が変わったものだけだと思っています。
今日やったことは、すべてお客様のLPにも反映しています
今回の画像の軽量化、お問い合わせフォームの設置、ブログの記事——これらはすべて、fufumumu_designが制作するLPにも同じように対応しています。
「速くて、使いやすくて、Googleに評価される」ページをお客様に提供するためには、自分のサイトが先にその基準を満たしていなければ、説得力がありません。自分で試した手順を、そのままお客様に還元できる。それが、fufumumu_designの方針です。
【サイトを持っている事業主の方へ】
自分のサイトのスコアが気になった方、LP制作を検討している方は、info@fufumumu-design.com まで連絡してください。メールでお答えします。
コメント