DevNJ Make your business ease
メニュー

siteInspire ·アイルランド ·Picked 2026.10.18

Royal Sites of Ireland

文化・観光(非営利)のサイトデザイン参考 — 大きな見出し・ミニマル・史跡・資料の種類で絞る

Royal Sites of Irelandのトップページ(PC)
PC(1440px)
Royal Sites of Irelandのトップページ(スマホ)
スマホ(375px)

Editor's note

編集部の視点

6つの史跡をひとつのブランドにまとめ、UNESCO世界遺産への登録をめざす取り組みを見出しに据える観光サイト。

アイルランド各地に散らばる6つの「王の遺跡」をひとつにまとめて紹介するサイト。上空から遺跡を捉えた全画面の映像に「儀式と王権と文化の聖地」という見出しを重ね、短い紹介文のあとに6つの遺跡を写真のカードで並べる。中盤では、UNESCO 世界遺産の暫定リストに載っていることと、登録に向けた取り組みを説明し、最後は遺跡ごとの所在地(州名)つきのパノラマ写真で締める。

  1. 01 別々の場所にある6つの遺跡を、ひとつの名前とデザインでまとめて見せている
  2. 02 6つの遺跡は写真のカードで同じ大きさに並べ、どれも同じ重みで扱う
  3. 03 書籍・ポッドキャスト・記事・動画を「資料の種類」で絞れるようにしている

Conversion

集客の工夫

  • 全画面の映像 (あり) 上空からの遺跡の映像
  • 拠点(遺跡)ごとの入口 (あり) 6つの遺跡をカードで
  • 権威・認定の説明 (あり) UNESCO 暫定リストと登録への取り組み
  • 資料の種類で絞り込み (あり) BOOK・PODCAST・ARTICLE・VIDEO
  • 所在地の明記 (あり) 遺跡ごとに州名(Co. Meath など)
  • メールアドレスの掲載 (あり) mailto:リンク 2か所
  • ヘッダーの追従 (なし) なし(右上の Menu から開く)
  • 電話番号の掲載 (なし) なし

6つの場所を、ひとつのブランドに

タラの丘、キャシェルの岩など、6つの遺跡はアイルランド各地に離れて点在しています。それを「Royal Sites of Ireland」というひとつの名前でまとめ、同じ大きさの写真カードで並べています。どの遺跡から入っても全体の一部として見てもらえる作りで、自治体や組合のように複数拠点をまとめて伝えたい組織にそのまま応用できます。

認定の状況を、正確に書く

中盤の見出しは「UNESCO STATUS」。本文では、世界遺産の暫定リストに載っていることと、登録に向けた取り組みを説明しています。認定済みと誤解させる書き方をせず、現在地を正確に伝えたうえで価値を語っている点が参考になります。

資料を、形式で選べるようにする

メニューの Resources では、書籍・ポッドキャスト・記事・動画を BOOK / PODCAST / ARTICLE / VIDEO で切り替えて探せます。読みたい人、聴きたい人、現地に行く前に下調べしたい人で必要な形式が違う、という前提に立った設計です。

チェック項目は 2026.10.18 に実ブラウザで描画したトップページ(PC 1440px・SP 375px)を確認したものです。

Colour

配色

  • #FDFAF1 背景(生成り)
  • #F1EDE1 セクション背景
  • #3E3E3E 見出し・本文
  • #FFFFFF 映像の上の文字

背景は面積、文字は文字数で重み付けして実測した色から、役割ごとに整理しています。

Typography

フォント

用途 使用フォント 無料で近いもの
大見出し Endure Light Outfit(Light)
本文・小見出し Tenon Inter
ボタン・ラベル Auger Archivo
要素 PC サイズ / 太さ PC 行間 SP サイズ / 太さ
h1 61px / 300 1.05 42px / 300
h2 12px / 300 1.05 10px / 300
本文(p) 14px / 300 1.10 14px / 300
ボタン 12px / 300 1.25 12px / 300

実測値(PC 1440px・SP 375px、2026.10.18 計測)。同じ要素で最も多く使われている指定を表示しています。h1 をロゴや小さな見出しに使っているサイトでは、h1 の値が小さく出ます。

Structure

ページ構成(上から順に)

  1. 01 ヘッダー 左にロゴ(RSI)、右に Menu。メニューの中に6つの遺跡と資料一覧。 ヘッダー/ロゴ+メニューボタン型
  2. 02 ファーストビュー 上空から遺跡を捉えた全画面の映像に、細い書体の見出しを重ねる。 ファーストビュー/全面動画+コピー型
  3. 03 紹介 「王の遺跡は島じゅうに残る古代の権力の中心地」という短い紹介文。 メッセージ/大きな一文型
  4. 04 6つの遺跡 遺跡ごとに、写真と映像を重ねたカード。 一覧/カード並び型
  5. 05 UNESCO への取り組み 世界遺産の暫定リストに載っていることと、登録に向けた取り組みの説明。 コンセプト/写真+メッセージ型
  6. 06 遺跡のパノラマ 遺跡ごとに州名つきのパノラマ写真をスライドで。 入口/カテゴリ別スライド型
  7. 07 フッター ロゴと各ページへのリンク、動画サイトへの導線。 フッター/ナビ+会社情報型

Download

ワイヤーフレームをダウンロード

この構成を、Figmaで編集できるワイヤーに

上のページ構成を、DevNJ のワイヤーフレーム部品で組み直したものです。元サイトの文章・画像・コードは含みません。

Royal Sites of Irelandの構成を DevNJ の部品で組んだワイヤーフレーム(PC)
PC(1440px)
Royal Sites of Irelandのワイヤーフレーム(スマホ)
スマホ(375px)

Figmaでの使い方

  1. SVGをダウンロードする
  2. Figmaのキャンバスにファイルをドラッグ&ドロップする
  3. セクションごとにレイヤーが分かれた状態で開くので、順番の入れ替えや文言の差し替えから始める

文字はテキストレイヤーとして入ります(フォントは Noto Sans JP)。

Reproduce

このサイトを参考にするときのポイント

  1. 01 複数の拠点・施設を持つ組織は、ひとつの名前とデザインでまとめて見せる
  2. 02 拠点のカードは同じ大きさで並べ、どこから見てもらってもいい形にする
  3. 03 認定や登録の状況は、取得済みか申請中かを正確に書く(盛らない)
  4. 04 読みもの・動画・音声など資料の形式が複数あるなら、形式で絞れるようにする

FAQ

よくある質問

Royal Sites of Ireland のサイトで使われているフォントは?

大見出しに Endure Light、本文と小見出しに Tenon、ボタンやラベルに Auger を使っています。いずれも有料書体なので、無料で近づけるなら Outfit(Light)と Inter の組み合わせが候補です。

UNESCO の世界遺産に登録されているのですか?

サイトでは、アイルランドの世界遺産暫定リストに載っていることと、登録に向けた取り組みを説明しています。登録済みとは書いていません。認定や受賞を載せるときは、このように状況を正確に書くことが信用につながります。

どんな業種の参考になりますか?

観光協会・自治体・複数の施設を持つ法人(寺社、美術館群、温泉地など)に向きます。拠点をカードで並べる型は、店舗が複数ある事業にも応用できます。

スクリーンショットは、解説に添える引用として縮小して掲載しています。デザイン・文章・画像の権利はRoyal Sites of Irelandおよび各権利者に帰属します。ワイヤーフレームは元サイトを写したものではなく、構成を DevNJ の部品で組み直したものです。権利者・制作者の方からの掲載の取り下げ・修正のご依頼はお問い合わせから承り、原則2営業日以内に対応します。 掲載ギャラリー: siteInspire

More

ほかの siteInspire の参考サイト

デザイン参考をすべて見る →

From reference to your site

Royal Sites of Irelandのような構成を、御社のサイトに。

「このサイトのような構成で」とお伝えいただくだけで構いません。現状のサイトを拝見し、業種と読み手に合わせた構成案をお持ちします。

無料で相談する →