1. 「うちのサイト、重いって言われたんです」

中小企業の経営者の方とお話していて、こんな言葉をよく聞きます。

「取引先の若い人に、御社のホームページちょっと重いですねって言われまして。そんなに古いサイトでもないんですけど、やっぱり作り直したほうがいいんでしょうか」

このご相談は本当に多いです。そして、ほとんどの場合、答えは同じです。作り直す必要はありません

私が現場で見てきた限り、表示が遅いサイトの原因は、9割方が画像です。写真の容量が大きすぎるだけで、設計が悪いわけでも、古いから遅いわけでもありません。だから、画像を入れ替えるだけで、体感が変わることがほとんどです。

この記事では、遅さの原因をどう見つけて、どの順番で手を打つかを整理します。先にお伝えしておくと、費用をかけずにできることが3つあります。画像を軽くする、埋め込みを減らす、読み込みの順番を変える。この3つで解決しなければ、そのときに初めてサーバーや作り直しの話が出てきます。

スマートフォンでの見え方全般は スマートフォンで見たときに、人が離れる7つのこと に、作り直すかどうかの判断は リニューアルすべきか、直すだけで足りるか にまとめてあります。この記事は、その中の「速さ」だけを深く掘ったものだとお考えください。

2. 遅いと、実際に何が起きているのか

速さの話が軽く扱われがちなのは、遅さで失った人が、数字に残らないからです。ここを先に共有させてください。

読まれる前に閉じられている

サイトが遅いとき、訪れた人は「遅いな」と思って待ってくれるわけではありません。画面が白いまま数秒経つと、内容を見る前に戻ります。このとき、その人は貴社のサービスを見ていないので、良いとも悪いとも判断していません。比較されて負けたのではなく、土俵に上がる前に終わっているということです。

一般に言われている目安として、表示までに数秒かかると離脱が目に見えて増えるとされます。ただ、この数字を厳密に覚える必要はありません。大事なのは、遅さで失う人は問い合わせフォームまで到達しないので、アクセス解析を見ても「来なかった人」としか映らないことです。

とくに、電波の弱い場所で差が出る

貴社の事務所は、たいてい光回線とWi-Fiが通っています。そこで見る限り、多少重いサイトでもすぐ開きます。問題は、お客様が見ている場所です

  • 移動中の電車の中、地下鉄のホーム
  • 車を停めた駐車場、建物の奥まった場所
  • 昼休みの混雑した時間帯
  • 古い機種のスマートフォン

こうした環境では、事務所で1秒だったものが10秒近くかかることがあります。来店型や訪問型の商売ほど、外で調べられる回数が多いので、ここの差がそのまま機会損失になります。

検索でも、まったく無関係ではない

検索エンジンは、ページの表示速度や操作のしやすさを評価の材料の一つにしていると公表しています。ただし、速さだけで順位が決まるわけではありません。内容が薄いページを速くしても順位は上がりませんし、逆に、内容が充実していて多少重いページが上位にいることも普通にあります。

ですから、速さの改善は「順位対策」としてではなく、来てくれた人を取りこぼさないための手当てとして考えるほうが、判断を間違えません。

3. まず測る ― 点数ではなく、秒数を見る

原因を推測する前に、一度測ってください。無料で、登録も不要です。

PageSpeed Insights の使い方

Googleが公開している「PageSpeed Insights」という無料の計測ページがあります。検索して開き、自社のURLを入れて実行するだけです。数十秒で結果が出ます。

見るページは、トップページだけでは足りません。トップ/サービス紹介/実績/お問い合わせの4ページを測ってください。重いのはトップだけで、他は軽いということもあれば、その逆もあります。

結果には「モバイル」と「デスクトップ」の2つのタブがあります。必ずモバイルのほうを見てください。デスクトップは点数が高く出やすく、実態と離れます。訪問の大半はスマートフォンです。

点数に振り回されない

結果の一番上に、0から100までの点数が大きく出ます。ここで多くの方がつまずきます。この点数は、そのまま実感と一致しません

点数は複数の項目を合成したもので、専門的な指標が含まれます。60点でも体感は十分速いサイトもあれば、80点でも遅く感じるサイトもあります。点数を90にすることを目標に置くと、効果の小さい細かい調整に時間とお金を使うことになります。

見るべきなのは「表示までの秒数」

点数の下に、いくつかの項目が秒数で並んでいます。ここを見てください。専門用語が並んでいますが、覚えるのは1つだけで構いません。

「最も大きなコンテンツの表示時間」(LCP)という項目です。これは、画面の中でいちばん大きな要素、たいていはトップの写真が出るまでの時間を指します。訪問者が「開いた」と感じる瞬間にほぼ一致します。

一般に言われている目安では、この時間が2.5秒以内なら良好、4秒を超えると改善が必要とされています。ただし、これはあくまで目安です。大切なのは、他社と比べることでも、基準に合わせることでもなく、今の秒数を記録して、手を打った後にもう一度測ることです

測ったら、数字を書き留めておく

紙でもメモアプリでも構いません。日付/ページ/モバイルの点数/表示までの秒数の4項目だけ残してください。これがないと、直した後に「良くなった気がする」という感想しか残りません。

4. 原因のほとんどは画像

ここからが本題です。私が見てきた範囲では、遅いサイトの原因はほぼこれ1つに集約されます。

デジカメやスマートフォンの写真を、そのまま載せている

最近のスマートフォンで撮った写真は、1枚で3MBから5MB程度あります。一眼レフならもっと大きくなります。この写真を縮小せずにサイトに載せると、そのままの容量が訪問者の回線を通ります

1枚5MBの写真が10枚あるページは、単純計算で50MBです。動画を1本ダウンロードしているのと変わりません。事務所のWi-Fiなら数秒でも、外の電波では数十秒かかります。

しかも、画面に表示されるときには縮小されて出るので、訪問者はその大きさの恩恵をまったく受けていません。重さだけを負担している状態です。

実績ページと商品ページに溜まりやすい

重い写真が溜まる場所は、だいたい決まっています。

  • 施工実績や事例のページ ― 現場で撮った写真を、そのまま何十枚も並べている
  • 商品の一覧ページ ― 1商品1枚でも、50商品あれば50枚になる
  • スタッフ紹介 ― 人数が増えるたびに増える
  • お知らせやブログ ― 更新のたびに、確認されないまま追加されていく

とくに最後の1つが厄介です。公開時は軽かったサイトが、更新を続けるうちに少しずつ重くなるという形は、よくあります。

画像でやることは、4つだけ

順に説明します。専門知識は要りません。

① 長辺2000px程度に縮める。パソコンの大きな画面で全幅に表示する写真でも、長辺2000pxあれば十分きれいに見えます。記事中の写真なら1200px程度でも構いません。縮めるだけで、容量は数分の一から数十分の一になります。無料の画像縮小サービスでも、パソコンに最初から入っている画像編集ソフトでもできます。

② JPEGで書き出す。写真はJPEG、ロゴや図はPNGというのが基本の使い分けです。写真をPNGで保存していると、容量が何倍にもなります。実績写真がPNGで並んでいるサイトは、これだけで一気に軽くなります

③ WebPは、制作会社に頼めばよい。WebPというJPEGより軽い新しい形式があります。効果は確かにありますが、変換の手間と、古い環境への配慮が要ります。自分で無理にやる必要はなく、制作会社に「WebPに対応できますか」と聞けば十分です。①と②を先にやれば、WebPまで踏み込まなくても体感は変わります。

④ 読み込みを後回しにする。画面の下のほうにある写真を、最初から全部読み込む必要はありません。スクロールして近づいてから読み込む指定(lazy)を入れると、最初に表示されるまでの時間が短くなります。これも制作会社に「画像の遅延読み込みを入れてください」と伝えるだけです。多くのCMSでは標準で入っています。

目安は1枚200KB

数字を1つだけ覚えるなら、これです。1枚あたり200KB以下に収まっていれば、まず問題ありません。トップの大きな写真でも500KBを超えるなら、縮める余地があります。

自社の写真の容量は、パソコンでファイルを右クリックすれば確認できます。5MBと出たなら、そのままでは載せないというだけの話です。

5. 次に多いのは「載せすぎ」

画像を軽くしてもまだ重い場合、次に疑うのはこれです。

1つずつは小さくても、呼び出す先が増えている

サイトの中には、外部のサービスから読み込んでいるものがあります。代表的なのは次のものです。

  • 動くスライド ― トップで写真が自動で切り替わるもの
  • 埋め込み動画 ― YouTubeなどをページ内に置いているもの
  • SNSのタイムライン ― XやInstagramの投稿を流し込んでいるもの
  • チャットの窓 ― 右下に出る問い合わせ用の吹き出し
  • 地図の埋め込み ― Googleマップをページ内に表示しているもの
  • アクセス解析や広告のタグ ― 見た目には出ないが動いている

これらは、それぞれが別のサーバーを呼び出しています。貴社のサーバーが速くても、呼び出した先が遅ければ、その分だけ待ち時間が生まれます。しかも、こちらでは速くできません。

埋め込みを1つ減らすだけで、体感が変わる

とくに重いのが、動画の埋め込みとSNSのタイムラインです。動画は再生していなくても、プレーヤーの部品を読み込みます。SNSのタイムラインは、投稿を取りに行くたびに通信が発生します。

トップページから埋め込みを1つ外すだけで、はっきり軽くなることがあります。動画なら、サムネイル画像を置いて、押したら再生ページに飛ぶ形に変える。SNSなら、タイムラインをやめてアイコンのリンクだけにする。それで失うものは、思っているより少ないはずです

地図とチャットは、置く場所を考える

地図の埋め込みは、来店型の商売では必要です。ただし、トップページに置く必要があるかどうかは別の話です。会社概要やアクセスのページに移すだけで、トップの表示は軽くなります。

チャットの窓も同じです。実際に使われている件数と、全ページで読み込む重さが釣り合っているかを一度考えてみてください。月に数件しか来ていないなら、問い合わせフォームへの導線を強くするほうが早いこともあります。

減らす基準は「去年使ったか」

判断に迷ったら、この基準で構いません。去年1年間、その機能から何か成果が出ましたか。答えられないものは、いったん外してみる。外して困ったら戻せばいいだけです。

6. サーバー側の問題である場合の見分け方

画像を軽くして、埋め込みも整理した。それでも遅い。このときに初めて、サーバーを疑います。

見分け方は「最初の反応が遅いかどうか」

判断の仕方は、思ったより単純です。

画像も軽く、埋め込みも減らしたのに、開いた直後の真っ白な時間が長い。この状態なら、サーバー側が原因の可能性が高いと考えてください。画像が重いときは「文字は出ているのに写真が後から出てくる」形になりますが、サーバーが遅いときはそもそも何も出てこない時間が長くなります

PageSpeed Insights の結果でいうと、「サーバーの初期応答時間」という項目が該当します。ここに指摘が出ているなら、サーバー側です。

サーバーが遅くなる理由

いくつかありますが、中小企業のサイトで実際に起きるのは次のあたりです。

  • 共用サーバーで、同居している他のサイトが混んでいる ― 安いプランほど起きやすい
  • サーバーのプランが、古い契約のまま何年も更新されていない ― 同じ料金でも新しいプランのほうが速いことがある
  • WordPressのプラグインが増えすぎている ― 表示のたびに処理が走る
  • データベースが肥大している ― 記事や商品が数千件ある場合

対処は、順番を守れば安く済む

サーバーの乗り換えは、費用も手間もかかります。その前に、無料でできることが残っています

WordPressを使っている場合、使っていないプラグインを止めるだけで改善することがあります。過去に試しただけのもの、機能が重複しているもの。管理画面を開いて、心当たりのないものを止めてみてください。

それでも変わらないなら、契約中のサーバー会社に現在のプランを確認するのが次です。同じ会社の新しいプランへ移るだけなら、乗り換えより手続きが軽く済みます。サーバーごと引っ越すのは、ここまでやってからで十分です

7. 費用をかけずにできる順番と、作り直しの境目

手を打つ順番を、上から並べます。上にあるものほど、安くて効きます

図:表示が遅いときに、手を付ける順番
① まず測って、記録する(0円・30分)

PageSpeed Insights で主要4ページをモバイルで測ります。点数ではなく、表示までの秒数を紙に控えます。ここを飛ばすと、直したあとに効果が分からなくなります。

費用はかかりません。必要なのは、測った日と秒数のメモだけです
② 画像を軽くする(0円・半日)

長辺2000px程度に縮め、写真はJPEGで書き出し、1枚200KB以下を目安にします。実績ページと商品一覧から始めると効果が大きく出ます。ここで大半が解決します。

遅さの原因の多くは、この段階でなくなります
③ 埋め込みを整理する(0円・1時間)

動画・SNSのタイムライン・チャット・地図を数えて、去年成果が出たか答えられないものを1つ外します。トップページから1つ減らすだけでも体感が変わります。

外して困ったら戻せるので、試す費用はゼロです
④ 読み込みの順番を変える(制作会社に依頼)

画像の遅延読み込み、不要なプラグインの停止といった調整です。専門的ですが作業量は小さく、保守契約の範囲で対応してもらえることが多い部分です。

依頼の言葉は「画像の遅延読み込みを入れてください」で通じます
⑤ サーバーを見直す(費用と手間が発生)

①〜④をやっても最初の反応が遅い場合だけ、ここに進みます。まず同じ会社の新しいプランを確認し、それでも改善しないときに引っ越しを検討します。

移転作業が必要になり、設定を誤ると一時的にサイトが止まります

読み方は上から順です。①から④までは費用がかからないか、ごく小さい範囲で収まります。いきなり⑤やサイトの作り直しから入ると、原因が画像だった場合に費用の大半が無駄になります。順番を守ることが、そのまま節約になります。

作り直しを検討する境目

では、どこまで来たら作り直しを考えるのか。私たちが目安にしているのは、次の3つです。

① スマートフォン用の設計になっていない。パソコン用のページを縮めて表示しているだけのサイトは、画像を軽くしても根本が変わりません。この場合は作り直しのほうが早く、結果も良くなります。

② 使っているCMSが、もう更新されていない。何年も前のバージョンで止まっていて、更新すると壊れる。この状態では、速さ以前に安全面の心配があります。

③ 手を入れられる人が、どこにもいない。作った会社と連絡が取れず、管理画面のパスワードも分からない。この場合、直そうにも直せません。

逆に言えば、この3つに当てはまらないなら、直すほうが安くて早いです。判断の詳細は リニューアルすべきか、直すだけで足りるか に書きました。

点数を上げること自体が目的にならないように

最後に一つだけ。PageSpeed Insights の点数を90点にすることは、事業の目標ではありません

点数を上げるためだけの細かい調整には、費用も時間もかかります。そして、検索順位は速さだけで決まりませんし、問い合わせの数も速さだけでは増えません。書いてあることが伝わるか、連絡先がすぐ見つかるか、そちらのほうが効きます。

速さの改善は、「開かないから帰る」という取りこぼしを無くすためのものです。取りこぼしが無くなった時点で、次の課題に移ってください。

8. 雄喜晃の伴走:測って、順番に手を打つところからご一緒します

私たち雄喜晃には、「重いと言われたが、どこから見ればいいか分からない」というご相談も来ます。まずやるのは、一緒に測ることです。主要なページをモバイルで測って、秒数を並べて、原因が画像なのか埋め込みなのかサーバーなのかを切り分けます。この時点で、作り直しが要らないと分かることがほとんどです

私たちがお作りするサイトでは、お預かりした写真をそのまま置くことはしません。長辺を落とし、容量を落として、外出先の電波でも開ける状態にしてから並べます。公開後に追加する写真も、月5回までの更新代行の中で同じ処理をしてから載せます。制作費は0円で、月額8,800円(税別)にサーバー・独自ドメイン・SSL・保守までを含めています。

一方で、しないことも書いておきます。計測の点数を上げることだけを目的にした作業はお受けしていません。90点を保証するようなお約束もしません。数字を追うより、外の電波で開くかどうかを優先します。また、遅いという理由だけで作り直しをお勧めすることもありません。画像を入れ替えれば済む話に、制作費をいただく理由がないからです。動きの多い演出を重ねたサイトをご希望であれば、そこを得意とする制作会社のほうが合います。

「重いのは分かっているが、直すべきか作り直すべきか判断がつかない」という会社には、私たちは間違いなくお役に立てます。今のサイトを一緒に測るところからで構いません。実際にお作りしたサイトは 制作実績 に、料金と条件は ホームページ制作のページ に載せてあります。

9. まとめ:作り直す前に、無料でできる3つを試す

ホームページが重いと言われたときにやることは、3つです。

  • 測って、点数ではなく秒数を記録する ― モバイルで、主要な4ページを
  • 画像を軽くする ― 長辺2000px程度、写真はJPEG、1枚200KB以下が目安
  • 埋め込みを1つ減らす ― 動画・SNS・チャット・地図。去年の成果を答えられないものから

この3つは、どれも費用がかかりません。そして、遅さの原因の大半は、ここまでで解決します。サーバーの見直しや作り直しは、ここまでやっても最初の反応が遅いときに初めて出てくる選択肢です。

順番を逆にしている会社が、本当に多いと感じます。いきなり作り直しの見積もりを取ってしまうと、原因が写真の容量だった場合、かかった費用の大半が無駄になります

まずは今、ご自身のスマートフォンで、Wi-Fiを切った状態で自社のサイトを開いてみてください。そこで感じた時間が、お客様が感じている時間です

ぜひ一度、お話を聞かせてください。今のサイトを一緒に測って、どこから手を付けるかを並べるところからご一緒します。