「うちのホームページにメニューを載せたいけど、どうやって写真を入れればいいかわからない」という飲食店オーナーは多い。正解は、写真付きメニューページを固定ページで作り、料理の写真と料金・説明をセットで並べるだけだ。この記事では、撮影のポイントからWordPressでのページ作成手順まで、今日から着手できる手順で解説する。
なぜメニューに写真を載せると来店が増えるのか
写真があると、来店前に「何を食べるか」イメージが決まり、迷う時間が減って行動につながりやすい。テキストだけのメニューは料理名と金額しかわからないため、どんな料理なのかが伝わらず、ページを閉じられて終わることが多い。
スマホでホームページを見る人は「この店で食べられるものが見たい」という具体的な目的を持っている。写真が1枚あるだけで「これを食べに行こう」という決断を後押しできる。特に、ランチセットや人気の定番メニューに写真がついていると、「迷ったらここにしよう」と候補に挙げてもらいやすい。
ホームページにメニューページがない場合や、テキストだけの場合は、ライバル店にページを閉じられる前に情報を渡せない状態だ。まず写真付きのメニューページを1ページ作ることが、来店への最短ルートになる。
- 写真があると来店前に「食べるもの」が決まり、決断を後押しできる
- スマホで検索する人は「見た目」と「料金」を同時に知りたがっている
- まず人気メニュー5〜10品の写真から始めるだけで十分
まずメニューページに載せる料理を選ぶ
全メニューを一度に載せる必要はなく、代表的な料理10〜15品から始めると管理しやすい。完璧を目指して全品を揃えようとすると撮影も更新も大変になり、ページ作成が止まってしまう。
最初に載せる料理の選び方
次の3つの基準で選ぶと迷わない。
人気メニュー・看板メニュー:オーダー数が多い、または「うちといえばこれ」と紹介できる料理。お客様が口コミやSNSで写真を撮っていることが多いメニューが候補になる。
価格帯の代表:ランチ・ディナー・コースなど、料金の幅がわかるように各価格帯から1〜2品選ぶ。「どのくらいで食べられるか」を最初に伝えると安心感が生まれる。
見た目で伝わるメニュー:写真にしたとき料理の特徴がわかりやすいもの優先する。色が鮮やか、盛り付けに特徴がある、ボリュームが伝わるものは写真映えしやすい。
後から追加・更新できる設計にする
WordPressの固定ページで作ると、後からメニューを追加・変更する際に写真とテキストを個別に差し替えられる。「最初から全部揃える」より「今ある分で公開してから徐々に追加する」ほうがスピードが出る。季節限定メニューは期間が終わったら非表示にするか、テキストで「季節により変わります」と一言入れておくと管理が楽になる。
ホームページ用の料理写真を撮る5つのポイント

ホームページ用の写真はSNSと違い、横構図と明るさを意識すると画面上で見栄えがよくなる。スマホの標準カメラで撮れば、以下の5点を押さえるだけで十分な品質になる。
ポイント1:自然光を使う
窓際のテーブルに料理を置き、窓から入る自然光で撮るのが最もコスパが高い。蛍光灯や電球の光は料理の色が黄色くなりやすいため、明るい時間帯に窓際で撮る習慣をつける。直射日光が当たると影が強くなるので、レースカーテン越しの柔らかい光が理想だ。
ポイント2:横構図(16:9か4:3)を基本にする
ホームページはPC・スマホとも横長の画面で表示されることが多い。SNS用の正方形・縦長と違い、HP用は横位置で撮ると画面にフィットする。スマホを横向きに持って撮影する習慣をつけるだけで、ページのレイアウトが整いやすくなる。
ポイント3:背景をシンプルにする
白い紙、木目のトレイ、黒い布など、単色でシンプルな背景を使うと料理が引き立つ。テーブルにコップやメニュー表が映り込まないよう、撮影するスペースだけ片付けてから撮る。背景が雑然としていると料理の印象が薄れる。
ポイント4:真上か斜め45度のアングルで撮る
料理の写真は、真上から撮る(プレート全体が見える)か、斜め45度から撮る(立体感が出る)の2パターンが使いやすい。カレーやパスタなど平らな料理は真上、ハンバーガーや定食など高さがあるものは斜めから撮ると特徴が伝わりやすい。
ポイント5:スマホの編集機能で明るさとコントラストを調整する
撮影後にスマホの写真アプリで「明るさ」を+10〜20程度上げ、「コントラスト」を+5〜10加えると料理の色が鮮やかになる。フィルターは使わないほうが自然な見た目になる。加工しすぎると実際の料理と見た目が違うと感じさせてしまうので、補正は小さく留める。
料理写真の基本的な撮り方のコツについては、飲食店がSNSで集客するための写真の撮り方にも詳しくまとめている。SNSとHPで写真を使い回す場合は参考にしてほしい。
WordPressでメニューページを作る4ステップ

固定ページを新規作成し、画像ブロックとテキストブロックを交互に並べると読みやすいメニューページができる。操作はすべてWordPressのブロックエディター(Gutenberg)で完結する。
ステップ1:固定ページを新規作成する
WordPress管理画面の「固定ページ」→「新規追加」を開く。ページタイトルは「メニュー」や「ランチメニュー」など、お客様がわかりやすい言葉にする。タイトルに「○○(店名・地域・業種)」を入れると検索に出やすくなるため、「渋谷 カフェ ランチメニュー」のように具体的にするとよい。
ステップ2:写真を最適化してアップロードする
写真を直接スマホから使うとファイルサイズが大きくなりすぎる(5〜10MB)ため、事前に圧縮が必要だ。スマホアプリ「Squoosh」(無料・ブラウザで使える)か、PC の「Compress JPEG & PNG images」(WordPressプラグイン)を使い、1枚あたり300KB以下に圧縮してからアップロードする。容量が大きいとページの読み込みが遅くなり、スマホで見たお客様がページを閉じてしまう原因になる。
ステップ3:写真とメニュー名・価格・説明を配置する
ブロックエディターでメニューを1品ずつ並べるには、「列」ブロックを使うと写真と説明を横並びにできる。列ブロックで左に写真(画像ブロック)、右にメニュー名・価格・説明(見出し+テキストブロック)を配置する。スマホでは自動的に縦に切り替わるため、縦でも読みやすいよう説明は短くまとめる。
1品ずつ個別ページを作る必要はない。1枚の固定ページにカテゴリ別(前菜・メイン・デザートなど)で区切りながら並べるだけで十分だ。
ステップ4:ナビゲーションにメニューページを追加する
ページを公開したら、ホームページのナビゲーション(グローバルメニュー)に追加する。WordPress管理画面の「外観」→「メニュー」からナビゲーションを編集し、作成したメニューページを追加して保存する。ナビゲーションに入っていないと、お客様がトップページからメニューへたどり着けないため必ず設定する。
ホームページ全体に載せるべき情報の優先順位についてはホームページに最低限載せるべき5つの情報にまとめているので、メニューページ以外の整備と合わせて確認してほしい。
メニューページに必ず入れる情報
写真だけでなく、料金・税込み表記・アレルギー情報をセットで載せると安心感が生まれる。情報が不完全だと「電話して確認しよう」という手間が増え、そのまま離脱される。
料金と税込み表記
料金は必ず「税込み価格」で表示する。「900円(税別)」と書いてあると実際の支払い金額がわからず不安を感じさせる。法令(消費税総額表示義務)の観点からも、店頭価格は税込みで表示するのが原則だ。ランチとディナーで料金が変わる場合は「ランチ 11:00〜15:00」のように時間帯を明記する。
アレルギー情報の一言
全メニューのアレルギー詳細を載せるのは大変だが、「主要アレルギー(卵・乳・小麦・そば・落花生・えび・かに)はご注文時にお申し付けください」と一行入れておくだけでも安心感が変わる。アレルギーがある方はホームページを見てから来店するかどうかを判断するため、この一言があるだけで「この店は対応してくれそう」という印象になる。
季節メニューの扱い方
季節限定メニューは期間と一緒に載せる。「春のたけのこパスタ(4〜5月限定)」のように括弧で時期を入れると、終了後もページを更新するタイミングがわかりやすい。更新が難しい場合は「メニューは時期により変更になる場合があります。最新情報はInstagramをご確認ください」と一文入れておくと、古い情報が残っても信頼性が下がりにくい。SNSとの連携方法についてはカフェのホームページにGoogleマップとSNSを載せる方法に具体的な手順がある。
よくある失敗と対処法
- 写真が暗い・くすんで見える:窓際の自然光で撮り直す。室内が暗い場合は白い紙を料理の反対側に立てて光を反射させると明るくなる
- ページの読み込みが遅い:写真1枚が1MB以上になっている可能性がある。Squooshなどで300KB以下に圧縮してから再アップロードする
- 全メニューを揃えようとして止まる:最初から全品を載せる必要はない。まず人気メニュー5〜10品の写真から始め、徐々に追加していく
- 価格が古いまま更新されていない:料金改定のたびにページを更新する手間が出る。更新しやすいよう「メニューページは料金改定後に更新する」とリマインダーを設定しておく
よくある質問
スマホで撮った写真でもホームページに使えますか?
十分に使えます。最新のスマホカメラは1,000万〜5,000万画素以上あり、ホームページに使う画質として申し分ありません。むしろファイルサイズが大きすぎるため、アップロード前に300KB以下に圧縮することが重要です。圧縮さえすれば一眼レフと遜色ないページが作れます。
プロのカメラマンに頼んだほうがいいですか?
最初はスマホで自撮りした写真で始めて問題ありません。写真なしよりも写真ありのページのほうが圧倒的に有効です。売上が安定してきたタイミングや、コースメニューの本格的な宣伝をしたいときにプロへ依頼するステップアップが現実的です。まずは「写真があるメニューページ」を公開することを優先してください。
メニューが変わるたびにホームページを更新する必要がありますか?
定番メニューと季節メニューを分けて管理するのが現実的です。定番は常時掲載し、季節限定は期間と一緒に表記しておくことで更新の手間を減らせます。また「詳細はInstagramで随時更新中」と一文入れておくと、ホームページが完全に最新でなくても信頼性を保てます。
写真のないテキストだけのメニューページでも意味がありますか?
テキストのみでもページがないよりはるかにましです。「料金」と「メニュー名」だけでも検索に引っかかりやすくなり、来店前の疑問を解消できます。ただし、競合他社が写真付きのページを持っている場合は、見た目の印象で選ばれにくくなります。まずテキストで公開し、順次写真を追加していく方法でも問題ありません。
写真の容量の目安はどのくらいですか?
1枚あたり300KB以下を目安にしてください。スマホで撮影した写真はそのままだと3〜10MBになることが多く、ページが重くなる原因です。「Squoosh」(Google提供の無料ブラウザツール)を使うと品質を保ちながら圧縮できます。メニューページに10枚の写真を載せる場合、合計3MB以内に収めると表示速度が保たれます。