SMARTPHONE SPEED ／ 表示速度の現状と改善提案

花鐘亭はなや 公式サイトスマートフォン表示速度の現状と改善提案

対象：https://www.kashoutei-hanaya.co.jp/（トップページ）　／　計測日：2026年5月21日　／　区分：社内資料（実測ベース）
サマリー

スマホでトップページを開くと、写真だけで約4MB以上を読み込んでいます。うち約1.1MBは表示に使われず捨てられる重複読み込みで、削減が可能です。表示が重い分、予約画面にたどり着く前に離脱しているお客様がいる可能性があります。

※サーバーの応答自体は速く（0.4秒台）問題ありません。重さの原因は「写真の扱い方」と「ページの作り」にあり、いずれも改修で軽くできる箇所です。

CURRENT STATUSいま起きていること（実測）

スマホ（iPhone相当）でトップページを開いたときに読み込まれるデータ量を、実際に計測しました。

重すぎる
約4MB超
トップページの写真の合計。スマホ表示の目安は1MB以下とされ、目安の約4〜5倍です。
重複・削減可
約1.1MB
PC用の写真を読み込んだ直後に捨て、スマホ用を読み直しています。1回の読み込みに減らせます。
1枚が重い
約550KB/枚
トップの大きなスライド写真（5枚）の平均。軽くすれば1枚100KB以下にできます。
計測内訳：トップのスライド写真5枚（スマホ閲覧時）
スライドPC用（未使用）スマホ用（表示）判定
1枚目254 KB362 KB両方DL
2枚目182 KB324 KB両方DL
3枚目373 KB506 KB両方DL
4枚目126 KB215 KB両方DL
5枚目162 KB254 KB両方DL
合計 1,099 KB
＝削減可能		 1,663 KB 2,762 KB

スマホ向けに画像を切り替える処理が、結果的にPC用とスマホ用の両方を読み込ませています。加えてスマホ用のほうがPC用より大きい（＝未圧縮）ため、ここは最も改善余地の大きい箇所です。

WHY SO SLOWなぜ重いのか（5つの原因）

専門用語を避けて、起きていることをそのまま挙げます。いずれも「直せるもの」です。

  1. スマホなのにPC用の大きな写真を読み込み、捨て、読み直している本来1回で済む読み込みが2回になっています。スマホ用の方が大きい点も含め、最も削減効果の大きい箇所です。
  2. 最初の表示で、下にスクロールしないと見えない写真まで全部いっぺんに読み込んでいる「あとで出てくる写真は、その時に読む」設定にすれば初回表示が軽くなります。
  3. 写真が古い保存形式のまま今の軽い形式（WebP）なら、見た目はそのままで容量を1/3〜1/5にできます。
  4. Facebookの埋め込みなど、外部の重い部品をそのまま読み込んでいる表示の引っかかりの一因。後回しに読み込めば体感が変わります。
  5. 停止済みの計測タグ（2023年に終了）が残っているいまアクセス数が正しく取れていない可能性。軽量化と同時に整理したい点です。

BUSINESS IMPACT表示速度がもたらす影響

53%
スマホで表示に3秒以上かかると、半数以上のお客様が読み込み完了を待たずに離れる、と一般に言われています。 ※Google「think with Google」等で広く引用される一般的な目安。花鐘亭はなや様の実数値ではありません。

公式サイトには予約導線（tripla）が組み込まれています。トップで離脱される＝予約画面にたどり着く前の取りこぼしに直結します。広告や検索でせっかく集めたお客様を、入口で逃している可能性があります。

IMPROVEMENT PLAN改善メニュー（効果の大きい順）

優先度①から着手すれば、最小の手間で最大の体感改善が得られます。

優先やること期待できる効果手間
①写真の二重読み込みをやめ、圧縮＋軽い形式（WebP）に変換画像 約4MB→1MB級。一番効く。中
①最初に見える1枚だけ先に、残りの写真は後から読み込む初回表示が目に見えて速く小
②Facebook等の外部の重い部品を後回しに読み込む表示の引っかかりが減る小〜中
②表示開始を待たせている部品（読み込み待ち）を整理真っ白な待ち時間が短く中
③停止済みタグ・不要コードの掃除、写真サイズの指定正しい計測＋表示崩れ防止小

EXPECTED RESULT改善後の姿

現在（実測）
約4MB超
トップの写真読み込み量
→
改善後（見込み）
1MB前後
「開いてすぐ写真が出る」体験へ

優先度①だけでも、スマホの写真読み込み量を1/4前後に削減できる見込みです（実測ベースの試算）。見た目・デザインはそのまま、軽さだけを手に入れられます。

推奨する進め方

01
優先度①から先行着手効果が最も大きい「写真の二重読み込み停止＋圧縮・WebP化」から小さく着手し、効果を実測で確認する。
02
他ページ・他テンプレも点検同じ実装が客室・料理など他ページにも使われている可能性。トップで効果を確認後、横断で点検・展開する。
03
改善後に再計測して共有対応後にもう一度計測し、約4MB→1MB級の削減を数字で確認。社内で結果を共有する。