サイトマップ大型フッター

このパーツの使いどころと実装ポイント

この「サイトマップ大型フッター」は、ブランド情報と複数カテゴリのリンク群を横並びにまとめ、サイト全体の入口を 1 か所に集約する大型フッターです。grid-template-columns:1.5fr repeat(4,1fr) で、左にブランド名・キャッチ・ソーシャルアイコン、右にサービス／会社／サポート／法的の 4 カテゴリを配置。背景は黒（#0a0a0a）で、見出しは黄系のラベル、最下部にコピーライト行を持つ重厚な構成です。

向いている場面

ページ数の多いコーポレートサイトや大規模メディア、サービス／会社情報／規約類が分かれる SaaS などに向きます。フッターに主要導線をすべて並べることで、回遊性が上がり、ユーザーが目的のページへ最短でたどり着けます。

カスタマイズと注意点

• カテゴリ列を増減するときは repeat(4,1fr) の数値を実際の列数に合わせて変更します。
• 各リンクは <a> ですが href が空のままなので、必ず実 URL を入れてください。空のままだと内部リンクとして機能せず SEO 上も無意味になります。
• ソーシャルアイコンは文字（𝕏 / f / in）の暫定表現なので、各 SNS の公式 SVG ロゴに置き換えると正規の見た目になります。
• 暗背景なのでリンク色のコントラストを確保し、ホバー時に色が変わるよう :hover 指定を活かしてください。