サイト構造

ファイル構成

~clawd/ktblog/
├── index.html              # トップページ
├── archive.html            # 全記事一覧
├── categories.html         # 10ジャンルカテゴリページ
├── search.html             # Fuse.js 検索
├── about.html              # About
├── knowledge/              # 知識ベース（このセクション）
│   ├── index.html
│   ├── deployment.html
│   ├── design.html
│   ├── history.html
│   └── architecture.html
├── _astro/
│   ├── about.CmL3EIE2.css  # 唯一のCSS（minified Tailwind）
│   ├── improvements.css    # デザイン改善CSS
│   └── enhancements.js     # TOC + コピーボタン
├── post/                   # 672記事
├── search.json             # Fuse.js 検索インデックス
└── sitemap.xml

記事テンプレート

全672記事が統一HTML構造。主なCSSクラス:

• .prose — 記事本文
• article.group + a.block — 記事カード
• aspect-[1280/670] — アイキャッチ比率

CSS変数一覧

--color-bg: #F5F0E8
--color-bg-secondary: #EDE6D6
--color-text: #4A4A4A
--color-text-muted: #8B8680
--color-accent: #8B7355
--color-accent-secondary: #A0896B
--color-border: #B8B8A8
--font-serif: "Shippori Mincho", "Noto Serif JP", serif
--font-sans: "Inter", -apple-system, sans-serif
--font-mono: "JetBrains Mono", monospace

技術的制約

• 静的HTMLのみ — フレームワークなし。ビルドツールなし
• SPAフォールバック — 存在しないパスでも index.html が HTTP 200 で返る
• 全上書きデプロイ — 単一ファイルのデプロイで全サイト消滅
• 画像は外部CDN — note.com の assets.st-note.com を参照。ローカル画像は1ファイルのみ