出典：dashburger.ie ↗ 確認日 2026.11.01
Editor's note
編集部の視点
2つの店の雰囲気と営業時間を書き分け、店ごとに「持ち帰り」「宅配」のボタンを並べるダブリンのスマッシュバーガー店。
ダブリンのスマッシュバーガー店 Dash Burger のサイト。ファーストビューはハンバーガーにかぶりつく人の写真に、ピンクの大きな店名。ヘッダーにはメニュー・私たちについて・仕入れ先・歩みと「Order Now」。続いて「COME CORRECT」「SCIENCE OF SMASH」「OUR FRIENDS」「GO FORTH AND HUSTLE」の大きな見出しで、メニュー・焼き方・地元の仕入れ先・2020年9月の開業からの歩みを写真とともに語る。「OUR LOCATIONS」では Capel Street と Kevin Street の2店を、席数や雰囲気、営業時間（毎日12時〜21時、予約なし）とともに書き分け、店ごとに「Click & Collect（ネット注文で持ち帰り）」と「Delivery（宅配）」のボタンを置く。
- 01 2つの店の違い（席数・テラス・雰囲気）を書き分け、どちらに行くか選べるようにする
- 02 店ごとに「持ち帰り」と「宅配」のボタンを並べ、来店以外の買い方もすぐ選べる
- 03 「予約なし（walk-ins only）」や営業時間を店舗の説明の中にはっきり書く
Conversion
集客の工夫
- 注文ボタンの常設 （あり） ヘッダーに「Order Now」
- 持ち帰り注文 （あり） 店ごとに「Click & Collect」（ネット注文）
- 宅配 （あり） 店ごとに「Delivery」
- 営業時間 （あり） 両店とも毎日12時〜21時
- 予約の可否 （あり） 「walk-ins only（予約なし）」と明記
- FAQ （あり） 予約・宅配・グルテンフリー・菜食・車いす・グッズ・ケータリングの7問
- メール登録 （あり） 「JOIN THE BURGER CLUB」
- 電話番号の掲載 （なし） なし
店ごとの違いを、書き分ける
「OUR LOCATIONS」では2つの店を並べています。Capel Street は 席が多く、夏はテラスがあり、ビールの樽もある店。Kevin Street は最初の店で、小さく持ち帰り向きだが店内でも食べられる店。同じブランドでも店の性格が違うことを書き分けているので、行く前にどちらが自分に合うかが分かります。
店ごとに、持ち帰りと宅配のボタンを置く
それぞれの店の説明の下には 「Click & Collect（ネット注文で持ち帰り）」と「Delivery（宅配）」 のボタンが並びます。ヘッダーにも「Order Now」が常にあり、どのページからでも注文に進めます。来店・持ち帰り・宅配の3つの買い方を、店を選んだその場で決められる作りです。
予約の可否と営業時間を、一文で
店舗の説明には「毎日12時〜21時、walk-ins only（予約なし）」と書かれています。FAQ にも予約・宅配・グルテンフリー・菜食・車いす・グッズ・ケータリングの7つの質問が並びます。来店前に聞かれることに先に答えておくことで、電話での問い合わせを減らしています。
チェック項目は 2026.11.01 に実ブラウザで描画したトップページ（PC 1440px・SP 375px）を確認したものです。
Colour
配色
- #FFFFFF 背景
- #000000 文字・暗いセクション
- #F3C0DB 店名の大きな文字（ピンク）
背景は面積、文字は文字数で重み付けして実測した色から、役割ごとに整理しています。
Typography
フォント
| 用途 | 使用フォント | 無料で近いもの |
|---|---|---|
| 大きな見出し・店名 | Kommissar Extra Condensed | Anton |
| 本文・ナビ | Messina Sans | Inter |
| 要素 | PC サイズ / 太さ | PC 行間 | SP サイズ / 太さ |
|---|---|---|---|
| h1 | 260px / 500 | 0.81 | 80px / 500 |
| h2 | 190px / 500 | 0.79 | 70px / 500 |
| h3 | 40px / 500 | 1.00 | 24px / 500 |
| 本文（p） | 18px / 400 | 1.30 | 16px / 400 |
実測値（PC 1440px・SP 375px、2026.11.01 計測）。同じ要素で最も多く使われている指定を表示しています。h1 をロゴや小さな見出しに使っているサイトでは、h1 の値が小さく出ます。
Structure
ページ構成（上から順に）
- 01 ヘッダー メニュー・私たちについて・仕入れ先・歩みと、右に「Order Now」。上部に固定。 ヘッダー／ロゴ＋横並びナビ型
- 02 ファーストビュー ハンバーガーにかぶりつく人の写真に、ピンクの大きな店名。 ファーストビュー／全面写真＋コピー型
- 03 店の一文 「Dash Burger brings you the edge」と、カリッとしてジューシーなバーガーの説明。 メッセージ／大きな一文型
- 04 4つの話 メニュー・焼き方・仕入れ先・歩みを、大きな見出しと写真で交互に。 機能・強み／左右交互型
- 05 店舗 Capel Street と Kevin Street の2店。席数・雰囲気・営業時間と、店ごとの持ち帰り・宅配のボタン。 一覧／カード並び型
- 06 メール登録 「JOIN THE BURGER CLUB」の文字が流れる帯と登録欄。 行動喚起／メール登録型
- 07 フッター 店舗・SNS・プレス資料・FAQ・求人のリンク。 フッター／ナビ＋会社情報型
Download
ワイヤーフレームをダウンロード
この構成を、Figmaで編集できるワイヤーに
上のページ構成を、DevNJ のワイヤーフレーム部品で組み直したものです。元サイトの文章・画像・コードは含みません。
Figmaでの使い方
- SVGをダウンロードする
- Figmaのキャンバスにファイルをドラッグ＆ドロップする
- セクションごとにレイヤーが分かれた状態で開くので、順番の入れ替えや文言の差し替えから始める
文字はテキストレイヤーとして入ります（フォントは Noto Sans JP）。
Reproduce
このサイトを参考にするときのポイント
- 01 複数の店がある場合は、席数や雰囲気の違いを書き分けて、行く店を選べるようにする
- 02 店ごとに持ち帰り・宅配などの注文ボタンを並べる
- 03 予約の可否と営業時間は、店舗の説明の中に一文で書く
- 04 グルテンフリー・菜食・車いすなど、来店前に聞かれることを FAQ にまとめる
FAQ
よくある質問
Dash Burger のサイトで使われているフォントは？
大きな見出しと店名は Kommissar Extra Condensed、本文とナビは Messina Sans です。どちらも有料書体なので、無料で近づけるなら Anton と Inter の組み合わせが候補です。
店が2つ以上あるとき、店舗ページはどう作ればよいですか？
Dash Burger は「OUR LOCATIONS」で2店を並べ、1店は席が多くテラスとビールの樽がある、もう1店は小さく持ち帰り向き、と違いを書き分けています。営業時間と予約の可否、注文ボタンも店ごとに置いているので、行く店と買い方を一度に決められます。
どんな業種の参考になりますか？
ハンバーガー店・ラーメン店・カフェ・パン屋など、店内飲食と持ち帰り・宅配の両方がある飲食店に向きます。複数の店舗を持つ小さなチェーンにも使える作りです。
スクリーンショットは、解説に添える引用として縮小して掲載しています。デザイン・文章・画像の権利はDash Burgerおよび各権利者に帰属します。ワイヤーフレームは元サイトを写したものではなく、構成を DevNJ の部品で組み直したものです。権利者・制作者の方からの掲載の取り下げ・修正のご依頼はお問い合わせから承り、原則2営業日以内に対応します。 掲載ギャラリー: siteInspire
