ワイヤーDLtowa wedding
アーチ型に切り抜いた花嫁の写真と、四隅から伸びる葉と花のイラストで、湖畔のアウトドア・ウェディングの雰囲気を伝える。
webcan analyze sumiyoshitaisha.jp
WEDDING · 大阪府 · PICKED 2026.10.19
住吉大社吉祥殿ブライダルのホームページデザイン参考 — 神社の結婚式・和婚・朱色
出典：sumiyoshitaisha.jp ↗確認日 2026.10.19
EDITOR'S NOTE編集部の視点
白無垢の花嫁の写真と縦書きの明朝体で神前結婚式の格式を伝えつつ、フェア予約と見学の入口を常に画面に出す。
大阪市住吉区、住吉大社の結婚式場「吉祥殿」のサイト。ファーストビューは白無垢の花嫁の写真に「住吉大社の結婚式」の文字を重ねている。白と淡いグレーの背景に朱色を差し色として使い、縦書きのコンセプト、トピックス、ブライダルフェア、神前挙式、披露宴会場、婚礼料理、衣裳・美容、ウェディングプラン、フォト、予約・問い合わせと続く。
- 01ファーストビューは白無垢の花嫁の写真に、明朝体の「住吉大社の結婚式」と英字を小さく重ねている
- 02コンセプトや各セクションの見出しは、明朝体の縦書きで短い言葉を並べている
- 03白と淡いグレーの背景に、ヘッダーの問い合わせボタンや予約の帯で朱色を使っている
CONVERSION集客の工夫
✓電話番号をヘッダーに常設PC・ファーストビュー
✓タップで電話できるSP・tel:リンク 1か所
✓SPの追従ボタンSP・画面下に固定
✓予約・問い合わせ導線ブライダルフェア予約 / 見学予約
✓LINEで相談・予約LINE公式アカウント
－営業・診療時間の明記トップページ内
フェア予約と見学の入口を固定する
PCは画面の右下に朱色の「フェア予約」「いつでも見学・相談」を固定している。スマホは画面の下に「フェア予約」「見学・相談」「資料請求」の3つを固定し、どこまで読んでも予約に進める。
ヘッダーに電話番号と予約ボタンを置く
ヘッダーの上段に電話番号とSNSのアイコン、右端に朱色の「ご予約・お問い合わせ」ボタンを置いている。電話で相談したい人も、Webで予約したい人も迷わない。
プランを人数と価格つきで見せる
ウェディングプランのカルーセルでは、プラン名に人数と価格を添えて並べている。家族だけの少人数のプランも含めて、費用の目安を予約前に確かめられる。
チェック項目は 2026.10.19 に実ブラウザで描画したトップページを自動判定したものです。
COLOR配色
#FFFFFF背景・ヘッダー
#F5F4F2セクション背景 · ペールグレー
#B74129差し色（予約ボタン・予約の帯） · 朱色
#668B6Dリンクの矢印・英字の小見出し · 松葉色
#333333本文テキスト
背景は面積、文字は文字数で重み付けして実測した色から、役割ごとに整理しています。
TYPOGRAPHYフォント
- 用途
- 和文見出し・ナビ
- 使用フォント
- 游明朝体
- 無料で近いもの
- Shippori Mincho
- 用途
- 和文本文
- 使用フォント
- 游ゴシック体
- 無料で近いもの
- Noto Sans JP
- 用途
- 英字
- 使用フォント
- EB Garamond
- 無料で近いもの
- EB Garamond
| 要素 | PC サイズ / 太さ | PC 行間 | SP サイズ / 太さ |
|---|---|---|---|
| h1 | 28px / 400 | 1.80 | 25px / 500 |
| h2 | 13px / 400 | 1.80 | 13px / 400 |
| h3 | 13px / 400 | 2.00 | 13px / 400 |
| 本文（p） | 11px / 400 | 1.80 | 13px / 400 |
| ボタン | 0px / 400 | NaN | 0px / 400 |
実測値（PC 1440px・SP 375px、2026.10.19 計測）。同じ要素で最も多く使われている指定を表示しています。h1 をロゴや小さな見出しに使っているサイトでは、h1 の値が小さく出ます。
STRUCTUREページ構成（上から順に）
- 01
- 02
- 03
- 04
- 05
- 06
- 07
- 08
- 09
- 10
- 11
- 12
- 13
- 14
PARTSパーツ別に見る
PC
SP
PC
SP
SP
SP
PC
SP
PC
SP番号は上のページ構成の順番です。部品名から、同じ部品を使っているほかのサイトの実例を見られます。スクリーンショットは 2026.10.19 以降に撮影したもので、現在の表示とは異なる場合があります。
DOWNLOADワイヤーフレームをダウンロード
この構成を、Figmaで編集できるワイヤーに
上のページ構成を、WEBCANのワイヤーフレーム部品で組み直したものです。元サイトの文章・画像・コードは含みません。
Figmaでの使い方
- SVGをダウンロードする
- Figmaのキャンバスにファイルをドラッグ＆ドロップする
- セクションごとにレイヤーが分かれた状態で開くので、順番の入れ替えや文言の差し替えから始める
文字はテキストレイヤーとして入ります（フォントは Noto Sans JP）。
REPRODUCEこのサイトを参考にするときのポイント
- 01衣裳の写真と、明朝体の縦書きの短い言葉で、和の結婚式の格式を伝える
- 02背景は白と淡いグレーに抑え、予約にかかわるボタンと帯だけに強い差し色を使う
- 03フェア予約と見学の入口は、PCもスマホも画面に固定する
- 04プランには人数と価格を書き、費用の目安を予約の前に見せる
FAQよくある質問
住吉大社吉祥殿のサイトで使われているフォントは？
和文の見出しとナビは游明朝体、本文は游ゴシック体、英字は EB Garamond です。Webフォントで近づけるなら、和文の見出しは Shippori Mincho、本文は Noto Sans JP が使えます。EB Garamond は Google Fonts で無料で使えます。
結婚式場のサイトで、予約の入口はどこに置けばよいですか？
このサイトのように、ヘッダーの右端に予約・問い合わせのボタンを置き、さらに画面の下にフェア予約と見学の入口を固定すると、写真や説明を読んでいる途中でも予約に進めます。ページの最後にも、電話番号と4つの入口をまとめています。
どんな業種の参考になりますか？
神社や寺院の結婚式、料亭・ホテルの和婚プランのほか、写真館の和装撮影など、和の格式と予約のしやすさを両立させたい業種に応用できます。
スクリーンショットは、解説に添える引用として縮小して掲載しています。デザイン・文章・画像の権利は住吉大社吉祥殿および各権利者に帰属します。ワイヤーフレームは元サイトを写したものではなく、構成をWEBCANの部品で組み直したものです。権利者・制作者の方からの掲載の取り下げ・修正のご依頼はお問い合わせから承り、原則2営業日以内に対応します。
MOREほかのブライダルの参考サイト
FROM REFERENCE TO YOUR SITE
このテイストで、
御社のブライダルサイトを。
「住吉大社吉祥殿のような構成で」とお伝えいただくだけで構いません。無料相談で御社の現状サイトを拝見し、地域と業種に合わせた構成案をお持ちします。
無料相談はこちらFREE SITE CHECK（ 無料診断 ）
自社サイトの今の状態を、30秒で確かめる。
URLを入れるだけで、GoogleのSEOとAI検索の両方から見た対応度と、優先して直すべき点がわかります。会員登録・メールアドレス不要です。