出典:moncalisse.com ↗ 確認日 2026.10.28
Editor's note
編集部の視点
ファーストビューに畑の気温・風・湿度をそのまま出し、第三者の評価と訪問の入口、営業時間までを短くまとめるイタリア・トレンティーノのワイナリー。
モンテ・カリシオのふもと標高600メートルにある、2016年創業のワイナリーのサイト。最初に年齢の確認があり、ヘッダーは言語切替(IT / EN / DE)、ロゴ、メニュー。ファーストビューは建物と畑の写真のスライドに、右下の「Moncalisse Vineyard」の気温・風速・湿度。続いて創業の経緯と12ヘクタールの畑、土地の歴史、自然への取り組み、ワイン評論家 James Suckling の「イタリアのトップ100ワイン 2026」で97点・93位のお知らせ、ワイン・訪問・建築・畑の4つの入口のスライド。フッターに住所、ビストロとショップの営業時間(11:30〜18:30、水曜定休)、電話・メール。
- 01 ファーストビューに畑の気温・風速・湿度を出し、「いまの畑」を感じさせる
- 02 評論家の点数と順位という第三者の評価を、お知らせとして本文の途中に置く
- 03 ビストロとショップの営業時間と定休日をフッターに書き、訪問の前に確かめられるようにする
Conversion
集客の工夫
- 年齢の確認 (あり) 最初に法定飲酒年齢かを確認
- 畑のいまを見せる (あり) ファーストビューに気温・風速・湿度
- 第三者の評価 (あり) James Suckling の97点・トップ100の93位
- 訪問の入口 (あり) 試飲・ワインショップ・ビストロをまとめた Hospitality
- 営業時間の明記 (あり) フッターに11:30〜18:30、水曜定休
- 言語の切り替え (あり) イタリア語・英語・ドイツ語
- 電話・メール (あり) tel:リンク 1か所・mailto:リンク 1か所
- 予約ボタン (なし) トップページには試飲の予約ボタンが無い
畑の「いま」を、最初の画面で見せる
ファーストビューの右下には「Moncalisse Vineyard」として、畑の気温・風速・湿度が表示されています。建物と畑の写真に数字が添えられるだけで、ここに実際の畑があり、いまも天候と向き合っていることが伝わります。
第三者の評価は、点数と順位まで書く
本文の途中には、ワイン評論家 James Suckling の「イタリアのトップ100ワイン 2026」で、リゼルヴァ2017が97点・93位になったお知らせが入ります。「高い評価を受けています」ではなく点数と順位まで書くことで、ワインに詳しくない人にも評価の重みが伝わります。
訪問の入口と、営業時間をはっきりと
ワイン・建築・畑と並んで、試飲・ワインショップ・ビストロをまとめた「Hospitality」の入口があります。フッターには住所とともに、ビストロとショップの営業時間(11:30〜18:30)と水曜定休が書かれていて、訪ねる前に必要なことがトップページで分かります。
チェック項目は 2026.10.28 に実ブラウザで描画したトップページ(PC 1440px・SP 375px)を確認したものです。
Colour
配色
- #FAF8F1 背景(生成り)
- #271002 見出し・本文・ボタン(こげ茶)
- #DED8CF 区切りの面(ベージュ)
背景は面積、文字は文字数で重み付けして実測した色から、役割ごとに整理しています。
Typography
フォント
| 用途 | 使用フォント | 無料で近いもの |
|---|---|---|
| 見出し | Canto | Cormorant Garamond |
| 本文・メニュー | Termina | Lexend Exa |
| 要素 | PC サイズ / 太さ | PC 行間 | SP サイズ / 太さ |
|---|---|---|---|
| h2 | 60px / 400 | 1.00 | 36px / 400 |
| 本文(p) | 14px / 400 | 1.60 | 14px / 400 |
実測値(PC 1440px・SP 375px、2026.10.28 計測)。同じ要素で最も多く使われている指定を表示しています。h1 をロゴや小さな見出しに使っているサイトでは、h1 の値が小さく出ます。
Structure
ページ構成(上から順に)
- 01 ヘッダー 言語切替(IT / EN / DE)、ロゴ、メニューのボタン。上部に固定。 ヘッダー/ロゴ+メニューボタン型
- 02 ファーストビュー 建物と畑の写真のスライドに、ロゴと「TRENTO DOC」。右下に畑の気温・風速・湿度。 ファーストビュー/全面写真+コピー型
- 03 ワイナリーについて 2016年の創業、12ヘクタールの畑、リゼルヴァだけを造ること。 コンセプト/写真+メッセージ型
- 04 土地 標高600メートル、ひとつの斜面に広がる畑と、山に残る岩絵。 コンセプト/写真+メッセージ型
- 05 自然 持続可能な栽培と生物多様性への取り組み。 コンセプト/写真+メッセージ型
- 06 お知らせ James Suckling の「イタリアのトップ100ワイン 2026」で97点・93位。記事へのリンク。 お知らせ/ニュース一覧型
- 07 4つの入口 ワイン・訪問(試飲・ショップ・ビストロ)・建築・畑を全幅の写真で切り替える。 入口/カテゴリ別スライド型
- 08 フッター 住所、ビストロとショップの営業時間と定休日、電話・メール、プレスキット、採用、SNS。 フッター/大きなフッター型
Download
ワイヤーフレームをダウンロード
この構成を、Figmaで編集できるワイヤーに
上のページ構成を、DevNJ のワイヤーフレーム部品で組み直したものです。元サイトの文章・画像・コードは含みません。
Figmaでの使い方
- SVGをダウンロードする
- Figmaのキャンバスにファイルをドラッグ&ドロップする
- セクションごとにレイヤーが分かれた状態で開くので、順番の入れ替えや文言の差し替えから始める
文字はテキストレイヤーとして入ります(フォントは Noto Sans JP)。
Reproduce
このサイトを参考にするときのポイント
- 01 畑や工房の「いま」(天気・季節・作業)を最初の画面で見せる
- 02 コンクールや評論家の評価は、点数や順位まで書いて本文に置く
- 03 見学・試飲・直売所がある生産者は、訪問の入口を商品と並べて用意する
- 04 直売所や併設の店の営業時間と定休日を、どのページでも見られる場所に書く
FAQ
よくある質問
Moncalisse のサイトで使われているフォントは?
見出しは細いセリフ体の Canto、本文とメニューは横に広いサンセリフの Termina です。どちらも有料なので、無料なら Cormorant Garamond と Lexend Exa の組み合わせが近い雰囲気になります。
ファーストビューに天気を出すのは、どんな意味がありますか?
畑の気温や風をその場で表示すると、写真だけでは伝わらない「いま畑がある」感覚が生まれます。農園、ワイナリー、茶園、牧場など、土地と天候が商品の質に関わる生産者に向いた見せ方です。
どんな業種の参考になりますか?
ワイナリーや酒蔵、果樹園、茶園など、商品の販売と見学・試飲・併設の店を一緒に案内する生産者に向きます。
スクリーンショットは、解説に添える引用として縮小して掲載しています。デザイン・文章・画像の権利はMoncalisseおよび各権利者に帰属します。ワイヤーフレームは元サイトを写したものではなく、構成を DevNJ の部品で組み直したものです。権利者・制作者の方からの掲載の取り下げ・修正のご依頼はお問い合わせから承り、原則2営業日以内に対応します。 掲載ギャラリー: Awwwards — Honorable Mention