「開かなかった」と言われたことはありませんか。
飲食店のサイトが開かれるのは、机の前ではありません。駅を出たところ、店へ向かって歩きながら、二軒目を探している22時の路上。電波が弱い場所で、片手で、急いで開かれます。
この条件で、写真が出るまでに数秒かかる画面は閉じられます。閉じた人は「重かった」とは言いません。さっきまで見ていた地図やグルメサイトに戻るだけです。店の側からは、何も起きていないように見えます。
重さの原因は、飲食店の場合ほとんど決まっています。順に見ていきます。
いちばん重いのは、料理写真の一枚あたりの大きさです。
枚数ではありません。一枚あたりのデータの大きさです。カメラやスマホで撮った元のデータを、そのまま画面に置いている店がとても多いです。一枚で数メガバイトになることがあります。それが五枚並べば、それだけで開くのに時間がかかります。
写真を減らせという話ではありません。飲食店のサイトで、写真は商品そのものです。やるのは、画面に出す大きさに合わせてデータを作り直すことです。見た目を落とさずに、重さだけを落とせます。
ここで気をつけるのが、圧縮のかけ方です。焼肉のサシは、強く縮めると溶けて見えます。寿司の一貫を大きく出す画面も同じです。どこを残してどこを削るかは、業態によって違います。全部を同じ設定で一括処理すると、いちばん見せたい一枚から先に壊れます。撮り方と見せ方は写真の記事にまとめました。
全品を並べたギャラリーは、読み込む前に閉じられます。
メニューの全品を写真で並べたページ。パンの全種類。ワインリストの全点。作る側は親切のつもりですが、開く側からすると、読み込みが終わるまで何も見えない画面になります。
そもそも、全部を並べなくていい業態があります。寿司や割烹は、料理を全品並べると品書きの写しになります。一貫だけを大きく出して余白を取るほうが伝わります。ワインは、グラスの最低価格とボトルの価格帯、それに代表銘柄が数本あれば足ります。全点載せると更新が止まり、古いリストが残ります。古いワインリストは、無いより悪いものです。
逆に、並べる必要がある業態もあります。ベーカリーは一点ずつ値段が違うので、写真と価格が対になっていないと予算が立ちません。この場合は、最初に見える範囲だけを先に出して、下へ動かした分だけ読み込む形にします。画面に出ていない写真を、先に全部取りに行かない作りにするということです。
埋め込みは、自分のサイトの速さを人任せにします。
グルメサイトの予約枠、SNSの投稿一覧、地図、口コミの表示。これらを画面に埋め込むと、開くたびに相手のサーバーへ取りに行きます。相手が遅い日は、自分のサイトも遅くなります。しかも、店の側では直せません。
全部やめる必要はありません。置き方を変えます。
- ページのいちばん上に埋め込まない。最初に見える範囲は、自分の店の写真と文字だけで出せる形にします。
- 下へ動かして見える位置まで来てから、読み込ませます。
- SNSの一覧を全ページの下に入れない。載せるのは一ページだけにして、他はリンクにします。
- 地図は、画像とリンクで足りることが多いです。画面の中で指で動かす人は、そう多くありません。
予約の埋め込みだけは、外せない場合があります。その場合も、予約のページにだけ置いて、トップには置きません。
もう一つ多いのが、口コミやランキングの表示を全ページの下に入れている作りです。これは重さだけの問題ではありません。自分のサイトの中に、よその店と並べて比べる場所を作ることになります。すでに自分の店を見に来ている人を、そこからよそへ戻してしまいます。
動く演出は、店内のモニターで見せるものとは違います。
トップページで自動再生される動画。何枚も切り替わるスライドショー。店内のモニターで流すなら効きますが、スマホで開いたときには、まず読み込みの重さとして届きます。
とくに、切り替わるたびに次の写真を取りに行くスライドショーは、枚数の分だけ重くなります。一枚に絞って、その一枚を良くするほうが速く、伝わります。焼肉なら、肉の写真を一枚だけ大きく置きます。複数並べると一枚あたりが小さくなって、サシが潰れます。
文字のために特別な書体を読み込む場合も、種類が増えると効いてきます。和食の店で明朝を使うのには意味がありますが、使う書体は絞ります。
自分の店の前で、自分のスマホで開いて確かめます。
速さを確かめるとき、店のWi-Fiにつないだパソコンで開いても意味がありません。実際に読まれている条件で開きます。
- Wi-Fiを切って、携帯の回線にする。
- 店の外に出て、お客様が実際に歩いてくる道で開く。
- 店名で検索して、そこからサイトを開く。トップだけでなく、メニューのページも開く。
- 指で数えて、写真が出るまでに何秒かかるかを見る。
時間帯も変えて試してください。開店前の静かな時間と、金曜の20時では回線の混み方が違います。遅いほうが、実際に読まれている条件です。バーのように22時前後に探される業態なら、その時刻に自分で開いてみるのがいちばん確かです。
身内以外の目でも確かめてください。店主は自分のサイトを何度も開いているので、手元の端末に前の読み込みが残っていて、実際より速く見えます。家族や常連のお客様に一度開いてもらうと、初めて開く人が見ている速さが分かります。
うちの店のサイトは、どこが重いか。
重さの原因は店によって違います。写真だけの店もあれば、埋め込みが四つ入っている店もあります。ラーメン・定食のように歩きながら片手で読まれる業態では、ここが来店に直に効きます。文字の大きさと、指で押す場所の大きさも、同じ理由でパソコンでの見え方より先に考えます。
30分の無料相談では、その場でお店のサイトを開いて、何が重さになっているかを確かめます。オンラインで、費用はかかりません。その場で契約を求めることも、後日お電話することもありません。直す順番だけ持って帰っていただく形でも構いません。
作り替える場合、制作費は、トップページ1枚だけなら10万円(税込)から、7ページくらいの構成で25万円(税込)から。何を入れるかで決まり、構成を決めた時点で総額が決まります。写真と原稿がそろっていれば2週間ほどで公開できます。
よくある質問
写真を軽くすると、料理が安っぽく見えませんか。
作り方によります。画面に出す大きさに合わせてデータを作り直すだけなら、見た目はほとんど変わりません。問題になるのは、全部の写真に同じ強さで圧縮をかけたときです。焼肉のサシや、寿司の一貫を大きく出す写真は、そこから先に崩れます。看板になる数点だけ設定を分ける、という組み方にします。
サイトの速さは、検索の順位に関係ありますか。
順位を約束することはできません。並び順は、こちらで動かせるものではないからです。ただ、速さは順位より前のところで効きます。開くのに時間がかかる画面は、順位に関係なく閉じられるからです。歩きながら片手で開かれる業態ほど、この差がそのまま来店の差になります。
いま使っているサイトのままで、軽くできますか。
できることが多いです。写真のデータを作り直す、埋め込みの位置を下げる、SNSの一覧を一ページだけにする。この三つで、作り替えずに変わる場合があります。作りそのものがスマホで読む前提になっていない場合は、直す手間のほうが大きくなることもあります。どちらになるかは、実際の画面を見てからお伝えします。
料金・納期・進め方など、記事に関係なくよく聞かれることは よくある質問 にまとめてあります。