工務店の画像をWebP・圧縮で軽くして表示速度を上げる手順

9月に入っても静岡はまだ残暑が厳しく、現場を終えてから事務所に戻ると汗が引かない——そんな時期が続いていると思います。社長も体調管理しながらお疲れさまです。

さて、今日は「画像の話」をします。

工務店のホームページには、施工写真・外観・内装・家族の笑顔……と、たくさんの画像が使われていますよね。それ自体はとても良いことです。でも、その画像が重すぎると、ホームページが遅くなり、訪問者がページを開く前に離脱してしまいます。

Googleのデータによると、モバイルページの読み込みが3秒を超えると離脱率が急増することが確認されています。注文住宅を検討しているお客様は、スマートフォンでいくつかの工務店を比較しながら見ています。「なんか重いな」と感じた瞬間、次の工務店のサイトに移ってしまう。これは、問い合わせになる前に検討から外れるということです。

今回の記事では、画像をWebP形式に変換し、ファイルサイズを圧縮して、ホームページの表示速度を改善する手順を具体的にお伝えします。難しそうに聞こえるかもしれませんが、順番通りに進めれば社長一人でも対応できます。

📋 この記事でわかること

1. なぜ画像の重さが問い合わせ件数に直結するのか
2. WebP変換と画像圧縮の具体的な手順
3. WordPressで自動化する方法と注意点
4. 表示速度改善が売上・利益にどうつながるか

こんな方におすすめ

• ✅ ホームページはあるのに問い合わせがほとんど来ない方
• ✅ 施工写真をたくさん載せているが表示が重いと指摘されたことがある方
• ✅ Googleの検索順位を上げてWeb集客を強化したい方
• ✅ 社長一人で対応できる改善策を探している工務店・リフォーム会社の経営者
• ✅ ポータルサイト依存から脱却して自社HPからの問い合わせを増やしたい方

なぜ「画像が重い」と問い合わせを逃すのか

工務店のホームページで最も多い「表示速度の重さ」の原因は、ほぼ画像です。デジタルカメラやスマートフォンで撮影した写真は、何も処理しなければ1枚あたり3MB〜8MBになることもあります。トップページに10枚の施工写真を載せれば、それだけで30〜80MBのデータを訪問者に読み込ませることになります。

Googleは2021年以降、Core Web Vitals（コアウェブバイタル）と呼ばれる表示速度・操作感に関する指標を検索順位の評価に組み込んでいます。つまり、画像が重いとSEOの評価が下がり、検索で上位に出にくくなるという問題も起きます。

問い合わせが増えない理由を「コンテンツが少ないから」「エリアの競合が強いから」と思っていた工務店の社長が、画像を軽くしただけで問い合わせが動き出すケースは実際にあります。なぜなら、Googleの評価が上がると検索での露出が増え、訪問者が増え、ページをちゃんと最後まで読んでくれるようになるからです。

「ホームページの内容より先に、そもそも見てもらえる状態になっているかを確認することが必要です。どんなに良いことを書いていても、ページが開かれなければゼロです」

ハワードジョイマン（中小企業診断士・増益繁盛メソッド提唱者）

まずは「見てもらえる状態をつくる」こと。その第一歩が画像の最適化です。関連して、工務店のコアウェブバイタル（表示速度指標）を改善する具体策も参考にしながら、全体像を把握しておくと対応がスムーズです。

画像最適化の全体手順を把握する

画像を軽くするには、大きく2つのアプローチがあります。①ファイル形式をWebPに変換する、②ファイルサイズを圧縮する、です。この2つを組み合わせると、同じ見た目の画像でも容量を元の30〜70%削減できることがあります。

画像最適化 STEP 1

現状の確認：どのページが重いかを把握する

Googleが無料で提供している「PageSpeed Insights（ページスピードインサイツ）」にホームページのURLを入力すると、モバイル・PC別にスコアと改善提案が表示されます。「適切なサイズの画像を使用する」「次世代フォーマットでの画像の提供」といった項目が出てきたら、画像の最適化が最優先です。トップページ・施工事例ページ・会社案内ページの3つを最初に確認しましょう。

⚠️ よくある失敗：スコアを見ただけで満足してしまい、具体的にどの画像が問題かを特定しないまま終わるケース。レポートの「診断」欄に出てくる画像ファイル名を必ず確認すること。

画像最適化 STEP 2

新規アップロード分：WebP形式で保存・変換する

これから新しく追加する施工写真については、アップロード前にWebP形式に変換しておきます。Squoosh（スクーシュ）はGoogleが提供する無料ツールで、ブラウザ上で画像をドラッグ&ドロップするだけでWebPに変換・圧縮できます。変換時の品質設定は75〜85程度が目視での劣化がわかりにくく、かつ軽量化の効果が高い範囲です。1枚あたり2〜3分で作業できます。

⚠️ よくある失敗：品質を下げすぎて、施工写真がぼやけて見える状態でアップしてしまうこと。変換後は必ずPC・スマートフォンの両方で見栄えを確認すること。

画像最適化 STEP 3

既存の画像：WordPressプラグインで一括変換・圧縮する

すでにホームページに上がっている画像が大量にある場合、1枚ずつ手作業で変換するのは現実的ではありません。WordPressを使っているなら、「EWWW Image Optimizer」または「Converter for Media」といったプラグインを使うと、既存のメディアライブラリの画像を一括でWebP変換・圧縮できます。プラグインをインストールして有効化後、設定画面から「一括最適化」を実行するだけです。

⚠️ よくある失敗：プラグインを複数インストールして競合が起きるケース。類似機能のプラグインは1つに絞ること。また、処理中はバックアップを事前に取っておくことを強くすすめます。

画像最適化 STEP 4

画像の「表示サイズ」と「ファイルサイズ」を合わせる

よくあるのが、実際には横幅400pxで表示するエリアに、3000px幅の画像をそのまま埋め込んでいるケースです。ブラウザが縮小して表示するだけで、データ量は3000px分まるごとダウンロードされています。Squooshや「縮小専用」などのツールで、あらかじめ表示サイズに合わせた解像度にリサイズしてからアップロードする習慣をつけてください。目安として、トップページのメイン画像は横1200〜1600px、施工事例のサムネイルは横600〜800pxで十分です。

⚠️ よくある失敗：スマートフォンでの表示サイズを確認せず、PC向けの大きいサイズのまま設定してしまうこと。モバイル表示を必ず確認すること。

画像最適化 STEP 5

改善後のスコアを再確認し、次の手を考える

STEP 1〜4を実施したら、再度PageSpeed Insightsでスコアを計測します。モバイルのスコアが50点台だったものが70〜80点台に改善されると、実際の検索順位に変化が出始めることがあります。スコアだけでなく、Googleサーチコンソールで「コアウェブバイタル」レポートを確認し、「不良」「改善が必要」のURLが減っているかも合わせて見てください。

⚠️ よくある失敗：画像を改善しただけで満足して、その後の数値変化を追わないこと。集客の改善は「施策→計測→次の手」のサイクルで進めることが重要です。工務店がアクセス解析から改善点を見つける手順も参照して、数値の読み方を身につけておきましょう。

✓ ここまでのポイント

• 画像が重いと離脱率が上がり、SEO評価も下がるため問い合わせ機会を逃す原因になる
• PageSpeed InsightsでまずURLごとに現状スコアを確認することが最初の一手
• 新規画像はSquooshでWebP変換・リサイズ、既存画像はWordPressプラグインで一括対応が現実的

表示速度の改善が「売上・利益」にどう直結するか

「画像を軽くしても、それで家が売れるの？」と感じる社長もいるかもしれません。正直に言います。画像の最適化だけで棟数が増えるわけではありません。でも、問い合わせの入り口を塞いでいる原因を一つ一つ取り除くことが、月5件以上のHP問い合わせという目標に確実に近づく道です。

ホームページからの問い合わせが増えると何が変わるか。紹介・OBだけに依存しない状態になります。年間の受注が読めるようになります。値引き交渉を断っても次の問い合わせが来る状態になります。これが利益を守ることに直結します。

「集客の仕組みをつくると言うと、広告費の話だと思われがちです。でも実際は、今あるホームページが正しく機能していない状態を直すだけで、問い合わせが動き始めることが多い。画像の最適化はその中でも即効性のある取り組みの一つです」

ハワードジョイマン（中小企業診断士・増益繁盛メソッド提唱者）

私がご支援した工務店では、こんな声をいただいています。

「HPからの問い合わせが月0件から5件以上になった」

注文住宅工務店の経営者

この変化は、コンテンツを一気に増やしたからではなく、「そもそも見てもらえる状態」をつくることから始めた結果です。表示速度の改善はその土台の一つです。

なお、画像の最適化と並行して取り組むと効果が高まるのが、工務店のホームページのLCP・CLSを改善して検索評価を上げる方法です。LCP（最大コンテンツの表示時間）はトップ画像の表示速度に直結する指標で、画像最適化と組み合わせることでスコアが大きく改善するケースがあります。

この改善を「続く仕組み」にするために

施工写真は毎回の現場ごとに増えていきます。1回だけ画像を最適化しても、また重い画像をアップし続けると元に戻ります。だからこそ「仕組み化」が必要です。

具体的には、①スタッフや社長が写真を撮ったらSquooshで変換・リサイズしてからアップする、②WordPressのプラグインで自動最適化をオンにしておく、という2つをルール化するだけで、日常業務の中で画像が自動的に最適化された状態を維持できます。

「毎回やること」ではなく「一度設定すれば自動でできる状態」をつくる。これが、現場・営業・経営を兼務している工務店の社長が実際に続けられるやり方です。

まとめ：画像の最適化は集客力を上げる地味だが確実な一手

今回の内容を整理します。

工務店のホームページに施工写真を多く載せることは集客に有効ですが、画像が重すぎると離脱・SEO評価低下・問い合わせ損失につながります。対策の手順は以下の5ステップです。

1. PageSpeed Insightsで現状スコアと問題画像を確認する
2. 新規画像はSquooshでWebP変換・品質75〜85で圧縮する
3. 既存画像はWordPressプラグインで一括変換・圧縮する
4. 画像の解像度を表示サイズに合わせてリサイズする
5. 改善後にスコアを再計測してサーチコンソールで効果を確認する

「いい家を建てているのに、なぜ選ばれないのか」——その答えの一つは、ホームページが正しく機能していないことにあります。画像の最適化は地味な作業に見えますが、見てもらえる状態をつくるための確実な土台です。まずPageSpeed Insightsでスコアを確認することから始めてみてください。