本文へスキップ
ホームページ作成

サロンのホームページが重い原因と直し方|写真の扱いで表示速度が決まる

公開: 2026年7月28日最終更新: 2026年8月1日

ホームページを開くのに3秒かかると、その間に離脱する人が出ます。とくにスマートフォンからの閲覧では、電波の状態によってさらに時間がかかるためです。

サロンのサイトが重くなる原因は、ほぼ画像です。デザインでもコードでもなく、写真の扱いで決まります。

写真の状態別データ量と、許容される表示時間
写真の状態別データ量と、許容される表示時間

遅い原因のほとんどは画像

スマートフォンで撮った写真は、1枚あたり3MBから8MBほどになります。これを10枚並べれば、それだけで数十MBです。

閲覧する側は、その全部を通信で受け取ります。ですから電波が弱い場所なら、表示までに10秒以上かかることもあります。

一方でホームページに必要な大きさは、ずっと小さいものです。スマートフォンの画面幅は、多くの機種で400ピクセル前後。高精細な表示を考慮しても、横1200ピクセルあれば足ります。

つまり撮ったままの写真をそのまま載せると、必要な10倍以上のデータを送っていることになります。

状態1枚あたりの目安
スマートフォンで撮ったまま3〜8MB
横1200ピクセルに縮小300〜800KB
さらに形式を変換100〜300KB

10枚で比べると、40MBが2MBになります。この差がそのまま、表示の速さに表れます。

まずやること

技術的な知識がなくてもできる対処を、効果の大きい順に挙げます。

第一に、写真の大きさを縮めること。横1200ピクセル程度に、縮小します。スマートフォンの写真アプリでも、無料のツールでもできます。

第二に、枚数を減らすこと。10枚も20枚も並べる必要は、ありません。見せたいものを絞ることで、速くなるだけでなく伝わりやすくもなります。

第三に、形式を変えること。同じ見た目でも、データ量の少ない形式があります。使っているサービスが対応しているなら、その形式で保存してください。

第四に、動画の自動再生をやめること。トップページで動画が自動で流れる作りは、見栄えは良くても読み込みが重くなるためです。

表示を速くする4つの手順
表示を速くする4つの手順

何秒なら許容されるか

明確な基準はありませんが、目安として次のように考えてください。

1秒以内に何かが表示されれば、待たされている感覚は薄くなります。逆に真っ白な画面が続くと、壊れていると思われます。

2秒から3秒で主要な内容が見える状態なら、多くの人は待ちます。

しかし5秒を超えると、離脱が増えます。とくに検索結果から来た人は、他の店に移りやすくなるためです。

自分のサイトが何秒かかっているかは、実際に測ってみてください。Googleが提供する測定ツールで、モバイルとパソコンそれぞれの速度と改善点が確認できます。数値だけでなく、何が重いのかも示されます。

測るときは、自分のスマートフォンで店の外から開いてみてください。店内の通信環境で見ていると、実際の閲覧者の体感と違うことがあるためです。

写真の質を落とさずに軽くする

縮小すると画質が落ちるのでは、と心配になるかもしれません。しかし画面に表示される大きさに合わせて縮めるなら、見た目はほとんど変わりません。

質を保つための要点を、挙げます。

まず、元の写真は残しておいてください。縮小した画像だけにすると、後から大きく使いたいときに戻せないためです。

次に、明るさを調整してから縮小します。暗い写真を後から明るくすると、粗さが出るためです。撮影時に明るさを確保するのが、最も確実になります。

過度な圧縮も、避けてください。データ量を減らそうとしすぎると、輪郭がにじむためです。数値を下げながら見た目を確認して、劣化が分かる手前で止めます。

なお施術の仕上がりを見せる写真は、色の再現が重要になります。圧縮しすぎると色味が変わることがあるため、この種の写真は他より丁寧に扱ってください。

表示以外の速さも見る

ページの表示だけでなく、操作の速さも体験に影響します。

まず予約ボタンを押してから画面が変わるまでの時間を、測ってみてください。ここが遅いと、押したことに気づかず何度も押されるためです。

入力の項目が多いフォームも、体感として重くなります。予約に必要な情報だけを求めて、それ以外は後から聞く形にしてください。

読み込み中であることが分かる表示があるかも、確認してください。何も起きていないように見えると、待っている人は不安になるためです。

スマートフォンでの見え方を確かめる

サロンのサイトを見る人の多くは、スマートフォンからです。パソコンで作って確認もパソコンで済ませると、実際の見え方とずれます。

確認する点を、挙げます。

まず、文字が読める大きさか。パソコンでちょうどよく見える文字が、スマートフォンでは小さすぎることもあります。

次に、横に切れていないか。表や画像がはみ出して、横スクロールが必要になっていないか。

そして、押しやすい大きさか。予約ボタンやリンクが小さいと、指で押しにくくなります。隣の要素と近すぎると、誤って別のものを押すためです。

電話番号が押せるかも、見てください。スマートフォンで番号を押したときに、そのまま電話がかけられる形になっているか。

最後に、営業時間と住所がすぐ見つかるか。来店前に確認したい情報がスクロールしないと出てこない作りは、不便です。

自分のスマートフォンで実際に予約まで進めてみるのが、最も確実な確認方法になります。途中で迷う箇所があれば、閲覧者も同じところで迷うためです。

画像以外で重くなる要因

画像を軽くしても遅い場合は、次を確認してください。

一つは、外部のサービスを埋め込みすぎていないか。地図、SNSの投稿、アクセス解析、チャット。それぞれが、別の通信を発生させるためです。必要なものだけに、絞ってください。

二つ目は、装飾のための仕掛けが多すぎないか。スクロールに応じた動き、切り替わる画像。見栄えは良くても、処理の負担になります。

そして、古い写真が残っていないか。ページから外したつもりでも、実際には読み込まれていることがあります。

画像以外で重くなる要因と、写真掲載前の確認
画像以外で重くなる要因と、写真掲載前の確認

撮り方で後の手間が変わる

軽くする作業は、撮る段階で減らせます。

まず、明るい時間に撮ってください。暗い場所で撮った写真は、後から明るくすると粗さが出るためです。窓際や照明を追加した状態で撮るほうが、後の調整が少なくて済みます。

次に、同じ場所・同じ明るさで撮ります。1枚ごとに条件が違うと、並べたときにばらつくためです。撮る位置に印を付けておくことで、次回も同じ条件で撮れます。

余計なものは、写さないでください。散らかった背景、写り込んだ他のお客様。撮り直すか、あらかじめ片付けてから撮ります。後から消す加工は、手間がかかるためです。

向きも、掲載先に合わせてください。掲載する場所が横長なら横で、縦長なら縦で撮ります。後から切り抜くと、見せたい部分が入らないことがあるためです。

そして、まとめて撮ってください。1枚ずつ撮って都度アップロードするより、まとめて撮って一度に処理するほうが全体の時間は短くなります。

速さと見た目のどちらを取るか

速さを追いすぎて、写真が少なく味気ないサイトになっては本末転倒です。サロンのサイトは、雰囲気が伝わることに価値があるためです。

考え方としては、見てもらいたい写真に絞ってその写真を適切な大きさで載せる、という方向になります。枚数を減らして1枚あたりの質を保つほうが、たくさん載せて全部が粗いより伝わります。

トップページは軽くして、詳しい写真は別のページに分ける方法もあります。最初に開くページが速ければ、離脱は減るためです。

直した後に測り直す

手を入れたら、必ず測り直してください。感覚では「速くなった気がする」で終わるためです。

比較しやすくするため、直す前の数値を記録しておいてください。測定ツールの結果を控えるか、画面を保存しておきます。

測る条件も、揃えてください。同じ端末、同じ通信環境、同じページで比較します。条件が違うと、直した効果なのか環境の差なのか分からないためです。

改善が見られなければ、原因は別のところにあります。画像を軽くしたのに変わらないなら、外部サービスの読み込みか、そもそも通信の環境が原因かもしれません。

なお数値が良くなっても、実際の体感が変わらないこともあります。最後は自分のスマートフォンで開いて、待たされる感覚があるかどうかを確かめてください。数値は手段であって、目的ではありません。

作る仕組みによって手間が変わる

写真の縮小や形式の変換を、毎回手作業でやるのは負担です。使っている仕組みが自動でやってくれるなら、その手間は不要になります。

VANNAでは、写真をアップロードすると表示に適した形へ自動で変換されます。撮ったままの写真を上げても、閲覧する側には軽い状態で届きます。ですから縮小や形式変換の作業は、必要ありません。

ホームページと予約ページは同じ管理画面から編集でき、メニューや料金を変更すると両方に反映されます。掲載場所ごとに直す必要がないため、更新の手間も減ります。カレンダー予約はMaxプランの機能で、来店前のメールリマインドは全プランで使えます。

なお載せる写真の枚数や構成は、自分で決めることになります。自動で最適な枚数に絞ってくれるわけではないため、見せたいものを選ぶ判断は必要です。

料金はPro月額3,300円、Max月額5,500円、Max+月額11,000円で、いずれも税込です。初期費用は0円、予約や販売に対するVANNA側の手数料も0円です。決済を使う場合のStripe決済手数料は店舗負担で別途かかります。現在はプレオープン期間として、2026年7月31日までの申し込みで2か月無料、以降の申し込みは1か月無料です。条件は変更される場合があるため、最新の内容はVANNA公式 料金でご確認ください。

どのページを優先して直すか

すべてのページを同時に直す必要は、ありません。効果の大きいページから、手をつけてください。

最優先は、トップページ。検索や広告から最初に開かれる場所のため、ここが遅いと他のページに進んでもらえません。

次に、予約のページ。予約しようとしている人が離脱するのは、最も損失が大きい場面だからです。

そして、メニューと料金のページ。来店を検討している人が、必ず見る場所になります。

その他のページは、後回しで構いません。スタッフ紹介やブログはそこまで到達している時点で関心が高い人のため、多少の遅さは許容されます。

どのページがよく見られているかは、アクセスの記録で確認できます。見られていないページを丁寧に直しても、効果は出ないためです。

優先度ページ理由
トップ最初に開かれる。ここで離脱すると先がない
予約離脱の損失が最も大きい
メニューと料金検討している人が必ず見る
スタッフ紹介、ブログ到達時点で関心が高い

写真を載せる前の確認

速さとは別に、掲載の前に確認すべきこともあります。

まずお客様が写っている写真は、本人の同意を得てください。顔が分からない角度でも、特定できる可能性があるためです。同意は口頭ではなく、書面かメッセージなど記録が残る形で取ります。

施術の前後を並べる写真は、業態によって表現の制約があります。効果を保証すると受け取られる見せ方は、避けてください。加工や補正で実際より良く見せることも、実際のものより著しく優良と誤認させる表示にあたるおそれがあります。

他店の写真や素材サイトの画像を、無断で使わないでください。権利の問題になるためです。素材を使う場合は、商用利用が認められているかを確認します。

スタッフの写真を載せる場合も、本人の同意が必要になります。退職後にどうするかも、あらかじめ決めておいてください。

よくある質問

写真の縮小はどのツールを使えばよいですか

スマートフォンの写真アプリにも編集機能があり、そこで縮小できます。パソコンなら標準の画像編集ソフトで足ります。専用のツールを入れる必要はありません。

横1200ピクセルは大きすぎませんか

高精細な画面での表示を考慮した数値です。表示される幅の2倍程度を確保すると、粗く見えません。表示幅が600ピクセルなら1200ピクセルが目安です。

何枚くらい載せるのが適切ですか

一律の枚数はありません。見せたいものが伝わる最小の枚数にしてください。同じような写真を10枚並べるより、違う角度から3枚のほうが伝わります。

動画は載せないほうがよいですか

自動再生を避け、再生ボタンを押したときだけ流れる形にしてください。トップページで自動再生する作りは、読み込みが重くなります。

表示速度は検索の順位に影響しますか

速度は評価の要素の1つとされています。ただし、速いだけで上位になるわけではありません。内容が伴っていることが前提で、その上での改善点として捉えてください。

古い写真はいつ差し替えるべきですか

内容が実際と違っている写真は、気づいた時点で差し替えてください。内装を変えた、メニューを変えた、スタッフが変わった。実際と違う写真は、来店したときの落差につながります。

出典

本記事は2026年7月時点の一般的な情報の整理です。写真の掲載にあたっての同意の取り方、広告表現の適否については、個別の事情により判断が変わるため、必要に応じて専門家にご確認ください。VANNAの料金・機能・キャンペーン条件は変更される場合があります。