飲食店のメニューは、商品名・価格・提供時間などをホームページ本文に載せ、印刷用の一覧が必要ならPDFを併用すると整理しやすくなります。料理の魅力を見せる写真も添えられますが、細かい文字まで画像だけにまとめない方が、スマホで読む人への案内がしやすくなります。
すでに紙メニューがあるなら、それを捨てて作り直す必要はありません。まずは代表メニューの情報を本文へ移し、PDFや画像は役割を決めて残しましょう。
この記事では、同じ3品をPDF・画像・本文で載せる例と、価格変更時の更新手順を紹介します。料理名・価格・店舗の運用はすべて説明用の架空例です。
PDF・画像・本文は、使う目的から選ぶ
「どの形式が一番よいか」よりも、お客様がメニューをどう読むかを先に考えます。
| 掲載形式 | 向いている用途 | 注意点 |
|---|---|---|
| HTML本文 | スマホで商品名や価格を読む、内容を随時更新する | 読みやすい見出しと余白が必要 |
| 紙と同じ一覧を渡す、印刷して比較してもらう | 紙面を縮小表示すると文字が小さくなりやすい | |
| 画像 | 料理の写真や限定メニューの雰囲気を見せる | 文字を含めた画像は一部の修正でも作り直しが必要 |
HTML本文とは、管理画面で入力する見出しや文章など、通常のウェブページの文字部分です。適切に作れば画面の幅に合わせて文章を折り返せます。ただし、本文でも横幅の広すぎる表を置けば読みにくくなるため、形式を変えるだけで解決するわけではありません。
PDFもGoogleの検索対象です
Googleは、インデックス登録が可能な形式にPDFを含めています。「PDFだから検索に出ない」とは言い切れません。すべてのPDFが検索結果に掲載されるという保証でもありません。Google検索セントラルの対応ファイル形式
本文を併用する目的は、検索対策だけでなく、ページを開いた人が必要な情報をすぐ読めるようにすることです。PDFを開く前にも、代表料理と予算の目安、ランチの提供時間が分かるようにしておきます。
メニュー表を撮影した画像だけでは読みづらいことがある
A4のメニュー全体を撮った写真は、手早く掲載できます。ただ、スマホの画面に合わせると、料理名や注意書きが小さくなりがちです。反射、影、斜め撮影によるゆがみも確認してください。
W3Cは、文字の大きさや色などを利用者が調整できるよう、実現可能な場合は文字画像ではなく文字情報を使う考え方を示しています。メニューでも、商品名や価格を本文で読めるようにする設計が役立ちます。W3Cの文字画像に関する解説
掲載前にそろえるメニュー情報
写真を選ぶ前に、次の情報を一つの原本へまとめます。紙、PDF、ウェブで別々に考えると、修正した内容が食い違いやすくなります。
- 商品名と、何の料理か分かる短い説明
- 価格と、店内・持ち帰りなどの対象条件
- 単品かセットか、価格に含むもの
- 提供する曜日と時間
- サイズや追加トッピングによる料金
- 季節限定、数量限定などの条件
たとえば「カレー 1,100円」だけでは、サラダ付きなのか、夜も注文できるのかが分かりません。「野菜カレー／サラダ付き／店内1,100円（税込）／11:00〜14:00」と書くと、来店前の判断材料がそろいます。
全商品を載せない場合は、「メニューの一例です」「掲載は定番3品です」などと明記します。価格を変えたのに「詳しくは店頭で」とだけ添えて旧価格を残す運用は避け、掲載する情報自体を更新しましょう。
課税事業者が、消費者向けにあらかじめ課税取引の価格を表示する際は、税込価格が分かる表示を確認します。総額表示は媒体を問わず、ウェブも対象です。ここから先の架空例は、すべて店内利用の税込価格で統一しています。国税庁「総額表示」の義務付け
同じ3品をPDF・画像・本文で載せる例
以下は、架空の「カフェこもれび」の定番3品です。実際の画面を測定した結果ではなく、情報の配置を比べるための掲載例です。
1．PDFでは、印刷して読める一覧にする
紙面の見出しを「店内メニュー」、一覧の下に「価格は税込・定番3品を掲載」と置く想定です。
| 商品名 | 価格 | 内容 | 提供時間 |
|---|---|---|---|
| 野菜カレー | 1,100円 | サラダ付き | 11:00〜14:00 |
| チーズケーキ | 550円 | 単品 | 11:00〜17:00 |
| ブレンドコーヒー | 440円 | ホット、単品 | 11:00〜17:00 |
紙で一覧を見比べるには、このような表が使えます。一方、スマホでPDFの1ページ全体を表示すると、価格や提供時間を読むために拡大が必要になる場合があります。
PDFへのリンクは「こちら」だけにせず、「店内メニューをPDFで見る（2026年10月版）」のように、開く内容と版が分かる表記にします。新しいタブで開く設定なら、そのことも案内してください。
2．画像では、3品を一枚に詰め込まない
SNSなどでも使う商品画像を作るなら、一品ずつ分けると文字を大きく配置しやすくなります。各画像に載せる内容は、たとえば次のように統一します。
- 画像1の表記：野菜カレー／サラダ付き／店内1,100円（税込）／11:00〜14:00
- 画像2の表記：チーズケーキ／単品／店内550円（税込）／11:00〜17:00
- 画像3の表記：ブレンドコーヒー／ホット・単品／店内440円（税込）／11:00〜17:00
3品の情報を同じ形式で並べると、価格や時間の抜けに気付きやすくなります。ただし、画像内の価格を直すには、画像の元データから再作成する作業が必要です。料理写真を主に使い、価格と時間はすぐ近くの本文へ置けば、変更時に写真まで作り直す必要を減らせます。
商品名や価格を代替テキストに入れたから、画面上の小さな文字をそのままにしてよい、とは考えないでください。実際に見る人が読めることも確認します。
3．本文では、一品ごとに条件をまとめる
ホームページ本文なら、次のように写真の下や横へ記載できます。ここでは、スマホで縦に読む形を想定しています。
野菜カレー 1,100円（税込）
野菜を使ったカレーにサラダが付きます。店内利用向け。提供時間は11:00〜14:00です。
チーズケーキ 550円（税込）
チーズケーキの単品メニューです。店内利用向け。提供時間は11:00〜17:00です。
ブレンドコーヒー 440円（税込）
ホットコーヒーの単品メニューです。店内利用向け。提供時間は11:00〜17:00です。
ここに「定番メニュー3品のご紹介です」と添えれば、全メニューではないことも伝わります。本文へ移す際は、PDFにあった提供時間やセット内容を削らず、同じ条件を残してください。
3形式をスマホで確認する順番
まず拡大操作をせずに、商品名、価格、提供時間を読めるか確認します。続いてPDFのリンク先を開き、店内用と持ち帰り用を取り違えていないかを見ます。画像は一枚ずつ確認し、価格の小さな文字がつぶれていないか点検してください。
印刷用のPDFを残しつつ、本文では定番料理を読みやすく案内する方法なら、すべてを一つの形式へ統一する必要はありません。
価格改定では、6か所の情報を照合する
架空例の野菜カレーを、2026年11月1日から1,100円から1,210円へ変更する場合を考えます。価格以外の内容と提供時間は変わらない設定です。
| 確認する場所 | 直す内容 | 公開後に見るところ |
|---|---|---|
| 1．店内メニューの編集原本 | カレーを1,210円へ変更、適用日を記録 | 印刷物も新価格になっているか |
| 2．ホームページ本文 | カレーの価格と必要な改定案内 | スマホ画面に1,210円と出るか |
| 3．ダウンロード用PDF | 新版を書き出して差し替え | リンクから開くPDFの中身 |
| 4．メニュー画像 | 画像内の1,100円を修正 | 一覧と拡大画像の両方 |
| 5．Googleマップの店舗情報 | 登録しているメニュー情報やリンクを確認 | 店舗の公開画面とリンク先 |
| 6．予約サイトなどの外部掲載 | カレーやセットに関係する料金を確認 | 予約する人に見えるプラン内容 |
すべての店が6か所を使っているわけではありません。自店で利用中のものだけ残し、SNSの固定投稿など、ほかにも価格を載せていれば行を足します。
原本を直し、リンクを開いて中身まで確認する
作業は「変更内容を決める→原本を更新する→各掲載先へ反映する→公開画面を確認する」の順にします。担当が複数いる場合は、適用日と確認担当も原本に書き込みます。
PDFのファイル名だけが新しくなり、中身が旧価格のままということも考えられます。管理画面で保存できたかだけでなく、利用者と同じリンクから開いてください。古いPDFや画像のURLが残る場合は、公開を続ける必要があるかを制作担当に確認します。URLを変える場合の考え方は、ホームページのURL変更と301転送で整理しています。
Googleマップから予約先への案内も使っているなら、予約リンクの設定と確認も合わせて点検しましょう。リンクが開くことと、リンク先の料金が正しいことは別々に確認します。
自分で更新する部分と、依頼する部分を決める
毎月価格や品目が変わる店では、本文を店側で更新できる構成が候補になります。変更が少なく、紙メニューのデザインを保ちたい場合は、PDFの更新を中心にする方法もあります。
制作担当へ相談する際は、現在のメニューページ、紙メニューの編集データ、変更頻度、更新担当を伝えてください。「価格だけは店で直す」「PDF制作は依頼する」と作業を分けると、必要な仕組みと費用を相談しやすくなります。
WordPressを使っている場合、メニューの書き換えと、ソフトウェア更新・バックアップは別の作業です。担当範囲はWordPress保守の確認表も参考にしてください。
メニュー掲載でよくある質問
PDFしか手元にない場合も相談できますか？
PDFを原稿の確認資料にして、必要な情報を本文へ移す方法があります。文字を選択できないPDFでは入力し直す作業が発生することもあるため、元の編集データが残っていれば一緒に用意します。
全メニューを本文に載せる必要はありますか？
必ずしも必要ありません。まず定番料理、価格帯を判断できる品、来店前によく聞かれる内容を優先します。掲載が一部であることと、詳しいメニューの確認方法を示してください。
持ち帰りと店内で価格が違う場合は？
一つの価格にまとめず、「店内」「持ち帰り」を分け、どちらの条件か分かる位置へ表示します。税の扱いや価格設定は店舗で確認し、実際に支払う金額と掲載内容を一致させます。
まずは、代表メニューをスマホで読める状態にする
最初から全商品を作り直さず、代表3品の商品名・税込価格・内容・提供時間を本文へ載せるところから始めてみてください。PDFと画像を残す場合も、原本と更新対象を一つの一覧で管理すると見落としを減らせます。
現在のメニューが見づらい、価格変更に手間がかかる場合は、デジリスタのホームページ制作相談へ、ページのURLと元データ、更新頻度をお知らせください。必要な改修内容と対応範囲を確認して見積もります。
