サイト設計と表示ルール

このページの目的

日本ウイスキー情報ナビは、販売店ページへの移動を主目的にしたページではなく、公開情報、公式発表、公開記録データ、抽選情報、蒸溜所や銘柄の基礎知識を分けて整理する情報サイトとして運営します。このページでは、サイト内の表示ルールを公開し、本文、広告、外部確認リンク、酒類情報の注意書きが混ざらないようにするための基準を説明します。

表示設計を公開する理由は、読者が安心して情報を読めるようにするためです。速報性のある更新でも、商品名、販売店名、受付期間、発表元、外部ページの状態を落ち着いて確認できることを優先します。購入、応募、価格、在庫は必ず発表元や販売店ページで最終確認してください。20歳未満の飲酒は法律で禁止されています。

共通コンポーネント

公開ページでは、ページごとに見た目や導線が変わりすぎないよう、共通コンポーネント名を決めています。これは内部実装の名前であり、読者に機能を押しつけるものではありません。編集ページ、ガイド、レポート、ライブラリ、運営情報のページで、同じ役割の部品を同じ意味で使うための整理です。

たとえば、ニュース解説では EditorialCard、公開情報では ReportCard、基礎ガイドでは GuideCard を使い分けます。ページの最後には LastReviewed と編集確認を表示し、情報源を説明する箇所では SourceBadge を使います。外部ページへ移動するリンクは ExternalConfirmLink として本文中の通常リンクや広告と区別します。

これらの名前は表示方針だけでなく、Functions 側の共通テンプレートとして実装し、動的に生成されるページでも SiteHeader、MobileNav、Footer、ResponsibleDrinkingNotice などを同じ役割で使えるようにします。ページごとに異なる見た目を増やすのではなく、読者が本文、広告、外部確認リンク、酒類注意表示を同じ意味で読める状態を保ちます。

読みやすさの基準

カード型の導線では、タイトルは最大 2 行、本文は最大 3 行で読める長さを目安にします。日付、ラベル、情報源は小さめの文字でまとめ、本文より目立たせません。長い商品名や販売条件がある場合でも、一覧では要点だけを出し、詳細ページで文脈を説明します。

ページの最大幅は約 1120px、本文を読む領域は約 720px を目安にし、行間は 1.8 前後で余裕を持たせます。モバイルでは最初の画面に強い導線を詰め込まず、主要な移動先は 2 つ程度に絞ります。背景は落ち着いた明るい色、本文は濃い文字色、アクセントは深木色と金色を使い、赤色の強い注意喚起や急がせる表現は避けます。

状態表示の扱い

状態ラベルは、読者が検知時点の情報を読むための補助です。記事タイトルや本文より目立たせず、販売を急がせる色や表現は使いません。公開記録データは現在の表示や価格を保証するものではないため、状態表示の近くには発表元や販売店ページで確認する必要があることを添えます。

「表示状態」は深い緑の小さなラベル、「状態未確認」は灰色、「販売形式」は青みを抑えた色、「受付終了」は淡い灰色を使います。いずれも本文や見出しより弱く表示し、ラベルだけで行動を促さない構成にします。

外部リンクと広告の分け方

外部販売店ページや公式発表へ移動するリンクは、本文の補足として扱います。ボタン風に表示する場合でも「発表元を確認」「販売条件を確認」「受付期間を確認」などの中立的な表現にし、販売や応募を急がせる文言は使いません。外部リンクには別ページへ移動することが分かる記号を添え、本文リンク、広告、ナビゲーションと区別します。

広告を表示する場合は、本文を読み終えた後や関連記事の近くなど、低干渉の位置だけを候補にします。広告枠には「広告」または「スポンサーリンク」と表示し、発表元確認や販売条件の確認のリンクの近くには置きません。商品販売向け構造化データ、価格、販売者、決済、カートを示す構造化情報は使わず、記事やページとしての構造化情報だけを使います。

酒類情報としての注意表示

ウイスキーは酒類であるため、すべての主要ページで「20歳未満の飲酒は法律で禁止されています」という注意を表示します。記事内でも、購入、応募、価格、在庫を当サイトだけで判断しないこと、販売店や公式発表の最新情報を確認することを繰り返し案内します。

当サイトは酒類を販売せず、注文代行、応募代行、在庫保証、販売店への問い合わせ代行を行いません。情報の目的は、公開情報を整理し、読者が確認すべき点を見つけやすくすることです。広告掲載の有無で掲載順位や本文判断を変えないことも、共通の表示ルールとして扱います。