出典：dursun-limousine.ch ↗ 確認日 2026.10.27
Editor's note
編集部の視点
黒い車の写真と金色のロゴだけで格を見せ、ベルのアイコンから予約の問い合わせフォームを開く、チューリッヒのハイヤー会社。
チューリッヒに事務所を置くハイヤー会社 Dursun Limousine のサイト。ファーストビューはホテルの前に停めた黒いメルセデスの写真に、金色の線で描いた「DURSUN」のロゴを重ねただけ。右上のベル（コンシェルジュの呼び鈴）のアイコンを押すと、予約の問い合わせフォームと住所・電話が上から開く。トップでは約20年の実績と運転手の人柄を書き、ビジネス・ファースト・エグゼクティブ・ミニバンの4クラスを車種名つきで並べ、ページの下にも同じ問い合わせフォームを置いている。
- 01 写真とロゴだけのファーストビューで、言葉を足さずに格を伝える
- 02 ベルのアイコンを「予約の問い合わせ」の入口にし、どの画面からでも開けるようにする
- 03 車のクラスを車種名つきで並べ、何に乗れるかを具体的に見せる
Conversion
集客の工夫
- 予約の問い合わせ （あり） 右上のベルからフォームが開く。トップの下にも同じフォーム
- 車種の一覧 （あり） ビジネス・ファースト・エグゼクティブ・ミニバンの4クラス
- サービスの種類 （あり） 送迎・待機・ロードショー・観光・イベント（サービスページ）
- 拠点 （あり） チューリッヒとジュネーブに車両基地
- 電話・メール （あり） tel:リンク 2か所・mailto:リンク 2か所
- 所在地の明記 （あり） フッターに住所（チューリッヒ）
- 言語の切り替え （あり） 画面下にドイツ語・英語
- 料金の目安 （なし） トップにはなし
写真とロゴだけで、格を伝える
ファーストビューは、ホテルの前に停めた黒いメルセデスの写真に、金色の線で描いた「DURSUN」のロゴを重ねただけです。キャッチコピーは置かず、黒と金の2色だけで、高級なハイヤーであることを伝えています。画面の下には「Personal Driver Service」と言語の切り替えが残ります。
ベルのアイコンを、予約の入口にする
右上にはホテルのフロントにあるような呼び鈴のアイコンがあり、押すと 予約の問い合わせフォームと住所・電話が上から開きます。同じフォームはトップの最後にもあり、読み終えた人も、すぐ頼みたい人も、同じ形で問い合わせができます。
何に乗れるかを、具体的に見せる
トップではビジネス・ファースト・エグゼクティブ・ミニバンの4クラスを、メルセデスの車種名つきで並べています。サービスのページでは空港や駅からの送迎、長時間の待機、会議を回るロードショー、観光、イベントの送迎と用途ごとに説明し、チューリッヒとジュネーブに車両基地があることも書いています。
チェック項目は 2026.10.27 に実ブラウザで描画したトップページ（PC 1440px・SP 375px）を確認したものです。
Colour
配色
- #000000 背景
- #DADADA 本文・ナビ
- #BE9B64 ロゴ（金）
背景は面積、文字は文字数で重み付けして実測した色から、役割ごとに整理しています。
Typography
フォント
| 用途 | 使用フォント | 無料で近いもの |
|---|---|---|
| 見出し・本文・ボタン（すべて） | Atlas Grotesk | Inter |
| 要素 | PC サイズ / 太さ | PC 行間 | SP サイズ / 太さ |
|---|---|---|---|
| h1 | 32px / 300 | 1.60 | 32px / 300 |
| h3 | 17px / 300 | 1.60 | 14px / 300 |
| 本文（p） | 17px / 300 | 1.60 | 14px / 300 |
| ボタン | 17px / 400 | normal | 14px / 400 |
実測値（PC 1440px・SP 375px、2026.10.27 計測）。同じ要素で最も多く使われている指定を表示しています。h1 をロゴや小さな見出しに使っているサイトでは、h1 の値が小さく出ます。
Structure
ページ構成（上から順に）
- 01 ヘッダー 左にメニュー、右にベルのアイコン。ベルを押すと予約の問い合わせフォームが上から開く。 ヘッダー／ロゴ＋メニューボタン型
- 02 ファーストビュー ホテルの前に停めた黒い車の写真に、金色の線のロゴ。画面下に「Personal Driver Service」と言語の切り替えが残る。 ファーストビュー／全面写真＋コピー型
- 03 会社の紹介 「Your wish is our command」と、約20年の実績、運転手の人柄を書いた文章。 メッセージ／大きな一文型
- 04 車のクラス ビジネス・ファースト・エグゼクティブ・ミニバンの4クラスと車種名。各車のページへ。 一覧／カード並び型
- 05 車の写真 車の写真を大きく切り替えて見せる。 事例・実績／大きな写真の切り替え型
- 06 拠点と対応 チューリッヒとジュネーブの車両基地から、すぐに向かえること。 コンセプト／写真＋メッセージ型
- 07 予約の問い合わせ 名・姓・会社・住所・電話・メール・メッセージのフォーム。 行動喚起／ボタン帯型
- 08 フッター 会社名・住所・電話・ファクス・メール、会社概要と個人情報の方針。 フッター／ナビ＋会社情報型
Download
ワイヤーフレームをダウンロード
この構成を、Figmaで編集できるワイヤーに
上のページ構成を、DevNJ のワイヤーフレーム部品で組み直したものです。元サイトの文章・画像・コードは含みません。
Figmaでの使い方
- SVGをダウンロードする
- Figmaのキャンバスにファイルをドラッグ＆ドロップする
- セクションごとにレイヤーが分かれた状態で開くので、順番の入れ替えや文言の差し替えから始める
文字はテキストレイヤーとして入ります（フォントは Noto Sans JP）。
Reproduce
このサイトを参考にするときのポイント
- 01 高価格のサービスは、言葉を減らして写真とロゴで格を見せる
- 02 予約や問い合わせの入口を、画面の隅のアイコンに常に置く
- 03 選べるもの（車・部屋・コース）は、名前と写真を並べて具体的に見せる
- 04 電話とフォームの両方を用意し、急ぎの人とじっくり相談したい人の両方を受ける
FAQ
よくある質問
Dursun Limousine のサイトで使われているフォントは？
見出しから本文、ボタンまで Atlas Grotesk 1書体で、細めの太さで組んでいます。有料書体なので、無料で近づけるなら Inter が候補です。
問い合わせフォームは、どこに置けばいいですか？
Dursun はページの下にフォームを置いたうえで、右上のベルのアイコンからも同じフォームを開けるようにしています。読み終わった人と、すぐ頼みたい人の両方を受け止める置き方です。
どんな業種の参考になりますか？
ハイヤー・タクシー会社のほか、運転代行、送迎つきの旅館、貸切バス、通訳つきの観光案内など、予約の問い合わせを受けて手配するサービスに向きます。
スクリーンショットは、解説に添える引用として縮小して掲載しています。デザイン・文章・画像の権利はDursun Limousineおよび各権利者に帰属します。ワイヤーフレームは元サイトを写したものではなく、構成を DevNJ の部品で組み直したものです。権利者・制作者の方からの掲載の取り下げ・修正のご依頼はお問い合わせから承り、原則2営業日以内に対応します。 掲載ギャラリー: Httpster
