SMALLSHIFT
← サイト事例に戻る

WEBSITE STUDY / 海外

Secret Garden Stresa

庭の噴水と緑を大きく見せ、二人の静かな滞在と個別相談による予約を案内する。

公式サイトを見る ↗
公式サイト / 掲載確認用
Secret Garden Stresaの公式サイト画面

DESIGN NOTES

このサイトの設計を読み解く。

01

庭の噴水を宿の象徴として見せる

冒頭は濃い緑に囲まれた噴水の写真を全面に広げ、庭の中に入り込むような印象を作る。部屋の設備写真から始めず、宿が大切にする静けさを風景で示す構成だ。写真の中央に名前を置き、周辺の葉の密度がその周りを囲むように見える。

02

一文字の金色で名前に目印をつける

大きな白い名前のうち一文字だけを金色の筆記体にし、細い補足文字にも金色を使う。緑と白を基本に、小さな色の差で上品な表情を添える方法だ。上部の案内は小さく、予約と二言語の切替が右端にまとまっているため、写真の面積を広く保っている。

03

二人向けの条件を短い欄にまとめる

本文上部には宿泊人数、成人向け、個別予約という条件を三つの小さな欄にまとめる。写真から受ける印象だけでなく、誰のための宿かを短い情報で明確にする構成だ。対象を絞る宿では、合う利用者が判断しやすい条件を早い段階で示す意味がある。

04

庭の細部から過ごし方の文章へつなぐ

続く画面は庭の彫刻に寄った写真を背景に、二人の視点で過ごす時間を説明する。庭でのコーヒーや近隣での食事など、設備名だけでは分からない滞在像を補う。全景と細部の写真を使い分け、宿の考え方を文章で読み取れるようにしている。

05

個別予約の手順を先に説明する

公開テキストでは希望日の問い合わせ、個別の確認、承認後の支払い、予約確定という手順を明記する。即時予約ではないことを先に伝え、入力後に何が起こるかを説明する構成だ。個別対応を価値にする場合でも、予約者が待つ段階を曖昧にしない点が参考になる。

APPLY TO YOUR PROJECT

自分の制作に取り入れるなら

対象を絞った宿では、写真で滞在の空気感を示し、人数や利用条件を短い欄で明確にできる。個別相談型の予約は、問い合わせ後から確定までの手順を先に説明したい。

そのまま真似する前に

公式本文にはホテル的な表現と私的な休暇用貸出としての説明が併存しているため、法的区分は断定しない。空室表示、支払い条件、プライバシー対応の実態は別途確認が必要。

次に見ておきたい参考

一覧へ →
Secret Garden Stresaの公式サイト画面