出典:pizza-amici.nl ↗ 確認日 2026.10.28
Editor's note
編集部の視点
「3000件以上のケータリング・評価4.6・1時間480〜600枚」を画面上部に固定し、料金の目安と申し込みの4ステップまで見せるオランダのピザのフードトラック。
デン・ハーグのピザ・パスタのフードトラックのサイト。画面上部には「3000件以上のケータリング」「評価4.6」「1時間に480〜600枚」の帯が固定され、その下のヘッダーに黄色の「Boek een truck(トラックを予約)」。ファーストビューは店員5人の写真に「現地でピザのフードトラックを借りる」の見出し、レビュー4.6の星、「1人€10から」の一文。続いて取引先のロゴ、3人の友人で始めた店の話、6台のトラックの能力と大きさ、申し込みから焼き上げまでの4ステップ、Google の評価と受賞、名前つきの利用者の声、5つの強み、ピザとパスタのメニュー、求人。予約ページは人数・場所・日付・時間を入れるフォーム。
- 01 実績の数字(件数・評価・1時間の枚数)を画面上部の帯に固定し、どこまで読んでも目に入るようにする
- 02 「1人€10から」と料金の目安をファーストビューに書き、見積もり前の不安を減らす
- 03 見積もり→仕込み→設営→焼き上げの4ステップと「24時間以内に連絡」で、頼んだ後の流れを先に見せる
Conversion
集客の工夫
- 予約ボタンの常設 (あり) ヘッダーに「Boek een truck」(SPは「Boeken」)
- 実績の数字 (あり) 上部の帯に3000件以上・評価4.6・1時間480〜600枚
- 料金の目安 (あり) ファーストビューに「1人€10から」
- 申し込みの流れ (あり) 見積もり・仕込み・設営・焼き上げの4ステップ
- 返信の目安 (あり) 「24時間以内に連絡」と明記
- 利用者の声 (あり) Google の評価4.6と、名前・会社名つきの声4件
- 電話・メール (あり) tel:リンク 1か所・mailto:リンク 1か所
- 言語の切り替え (なし) オランダ語のみ
比べられる数字を、画面の一番上に置く
画面の一番上には「3000件以上のケータリング」「評価4.6」「1時間に480〜600枚」の帯があり、スクロールしても消えません。フードトラックを探す人は何社かを比べます。件数・評価・処理能力という、比べられる数字を常に見せています。
料金の目安と、頼んだ後の流れを先に見せる
ファーストビューの説明には「1人€10から」とあります。その下には、見積もりの依頼、72時間前からの生地の仕込み、開始1〜2.5時間前の設営、焼き上げという4つのステップが並び、問い合わせには24時間以内に連絡すると書かれています。金額と段取りが分かるので、初めての人でも頼みやすくなります。
名前つきの声と、窓口がひとつという約束
Google の評価4.6と2つの受賞に続き、名前と会社名つきの利用者の声が4件。強みの欄には「窓口は1人」「食器と2.5時間のスタッフ込み」「初期費用なし」と、頼む側が気にする条件がはっきり書かれています。予約ページは人数・場所・日付・時間を入れるだけのフォームです。
チェック項目は 2026.10.28 に実ブラウザで描画したトップページ(PC 1440px・SP 375px)を確認したものです。
Colour
配色
- #F2EDE9 背景(生成り)
- #0F2C56 見出し・本文・上部の帯(紺)
- #E3AF04 予約ボタン(黄)
- #C0DEEE 説明文のカード(水色)
- #4F3C2C 写真まわりの濃い面(茶)
背景は面積、文字は文字数で重み付けして実測した色から、役割ごとに整理しています。
Typography
フォント
| 用途 | 使用フォント | 無料で近いもの |
|---|---|---|
| 見出し・数字 | Salo | Anton |
| 本文 | Azeret Mono | Azeret Mono(Google Fonts) |
| ボタン・小見出し | Awesome Serif | Fraunces(Italic) |
| 手書きの添え書き | La Belle Aurore | La Belle Aurore(Google Fonts) |
| 要素 | PC サイズ / 太さ | PC 行間 | SP サイズ / 太さ |
|---|---|---|---|
| h1 | 66px / 400 | 0.78 | 47px / 400 |
| h2 | 96px / 400 | 0.78 | 31px / 400 |
| h3 | 60px / 400 | 0.78 | 44px / 400 |
| 本文(p) | 12px / 500 | 1.30 | 9px / 500 |
| ボタン | 12px / 500 | 1.30 | 16px / 700 |
実測値(PC 1440px・SP 375px、2026.10.28 計測)。同じ要素で最も多く使われている指定を表示しています。h1 をロゴや小さな見出しに使っているサイトでは、h1 の値が小さく出ます。
Structure
ページ構成(上から順に)
- 01 ヘッダー 上部に実績の帯(3000件以上・評価4.6・1時間480〜600枚)。ピザ・パスタのトラック、事例、店について、連絡先と「トラックを予約」のボタン。上部に固定。 ヘッダー/ロゴ+横並びナビ型
- 02 ファーストビュー トラックに並ぶ店員5人の写真に「現地でピザのフードトラックを借りる」。レビュー4.6、「1人€10から」の説明と「トラックを見る」のボタン。 ファーストビュー/全面写真+コピー型
- 03 取引先 「このお客さまが先に利用しました」と取引先のロゴ。 信頼/ロゴ帯型
- 04 店の話 3人の友人で始めたこと、ナポリ風ピザの特徴、2台の窯で4分に12枚焼けること。1250以上のフェスと3000以上のケータリング。 コンセプト/写真+メッセージ型
- 05 6台のトラック トラックごとに1時間に焼ける枚数(275〜600)と大きさ、「このトラックについて」のリンク。 一覧/カード並び型
- 06 申し込みの流れ 見積もりの依頼、72時間前からの生地の仕込み、開始1〜2.5時間前の設営、焼き上げの4ステップ。 進め方/番号つきステップ型
- 07 評価と利用者の声 Google の評価4.6、2つの受賞、名前と会社名つきの声4件。 推薦/利用者の声型
- 08 5つの強み 焼く速さ、受賞、経験、材料、窓口が1人で食器と2.5時間のスタッフ込み・初期費用なし。 機能・強み/左右交互型
- 09 ピザとパスタ 50人からのピザのケータリングとパスタのメニュー。 一覧/カード並び型
- 10 求人 認定の職業訓練先であることと、97人のチーム。 コンセプト/写真+メッセージ型
- 11 フッター トラック・事例・店について・連絡先のリンク、住所・電話・メール。 フッター/ナビ+会社情報型
Download
ワイヤーフレームをダウンロード
この構成を、Figmaで編集できるワイヤーに
上のページ構成を、DevNJ のワイヤーフレーム部品で組み直したものです。元サイトの文章・画像・コードは含みません。
Figmaでの使い方
- SVGをダウンロードする
- Figmaのキャンバスにファイルをドラッグ&ドロップする
- セクションごとにレイヤーが分かれた状態で開くので、順番の入れ替えや文言の差し替えから始める
文字はテキストレイヤーとして入ります(フォントは Noto Sans JP)。
Reproduce
このサイトを参考にするときのポイント
- 01 件数・評価・処理能力など、比べられる数字を画面上部の帯に固定する
- 02 「1人◯円から」など料金の目安を最初の画面に書く
- 03 申し込みから当日までの流れを番号つきで見せ、返信までの時間も書く
- 04 持っている設備(車両や機械)を、能力と大きさつきのカードで並べる
FAQ
よくある質問
Pizza Amici のサイトで使われているフォントは?
見出しと数字は細長い Salo、本文は等幅の Azeret Mono、ボタンは Awesome Serif、添え書きは手書き風の La Belle Aurore です。Azeret Mono と La Belle Aurore は Google Fonts にあり、Salo の代わりには Anton などの縦長の書体が候補です。
出張サービスのサイトで、料金を最初に見せてもいいですか?
Pizza Amici は「1人€10から」とだけ書き、詳しい金額は見積もりで出しています。目安が分かると「高すぎて頼めないかも」という心配が減り、見積もりの依頼につながりやすくなります。
どんな業種の参考になりますか?
キッチンカー、ケータリング、出張料理、イベントの機材レンタルなど、日時と場所を決めて頼まれる仕事に向きます。
スクリーンショットは、解説に添える引用として縮小して掲載しています。デザイン・文章・画像の権利はPizza Amiciおよび各権利者に帰属します。ワイヤーフレームは元サイトを写したものではなく、構成を DevNJ の部品で組み直したものです。権利者・制作者の方からの掲載の取り下げ・修正のご依頼はお問い合わせから承り、原則2営業日以内に対応します。 掲載ギャラリー: Awwwards — Honorable Mention