feat: 公開コンテンツとサイト表示を実運用向けに更新

サンプル中心だった初期コンテンツを整理し、最初の挨拶Noteとollama-webのSoftware記事、画面キャプチャーを追加する。Aboutとサイト説明はzola.tomlの値を参照する構成に揃え、Software一覧から自前cgitへ案内する。不要になったサンプルNotesとSoftwareは削除する。

ホームの重複する紹介要素を取り除き、見出しサイズ、ページ余白、記事内の見出し間隔、一覧行間を縮小する。bodyとmainをFlexレイアウト化して短いページでもフッターの位置と内側余白を統一し、Software詳細のメタ情報が奇数項目でも罫線と列幅を維持する。

NotesとSoftwareのFront Matterを網羅したコピー用テンプレートと利用手順をdoc/content-templatesへ追加し、設計書と仕様書を現在の構成へ同期する。生成物に加えてdraftディレクトリをGit管理対象外とし、公開前の記事をローカルだけで管理できるようにする。

12 files changed, 126 insertions, 152 deletions

diff --git a/content/_index.md b/content/_index.md
index 7db2929..373c142 100644
--- a/content/_index.md
+++ b/content/_index.md
@@ -1,4 +1,4 @@
 +++
 title = "たかしの記録"
-description = "日々考えたこととか思ったことを記録します"
+description = "日々考えたこととか思ったことの記録や作成したソフトウェアをここに公開します"
 +++
diff --git a/content/about.md b/content/about.md
index b0f203c..a6e355c 100644
--- a/content/about.md
+++ b/content/about.md
@@ -3,24 +3,16 @@ title = "About"
 template = "page.html"
 +++
 
-## 名前
+## プロフィール
 
-たかし。ソフトウェアを作り、本を読み、考えたことを記録しています。
+- 名前: 田中 たかし
+- 職業・分野: ソフトウェア開発(生成AI, 組み込み, Web)
+- 趣味: 読書
 
 ## このサイトについて
 
-「たかしの記録」は、日々考えたこと、感じたこと、調べたことと、作成したソフトウェアを長く保存するための個人アーカイブです。更新の速さよりも、あとから読み返せることを大切にしています。
-
-## 関心分野
-
-- 情報工学とソフトウェア
-- 論理学
-- マルクス、資本論、政治経済
-- 地球環境
-- 読書を通じた考察
+{{ config.description }}
 
 ## 連絡先
 
 [{{ config.extra.mail }}](mailto:{{ config.extra.mail }})
-
-掲載内容は初期サンプルです。公開時に、プロフィールと連絡先を実際の情報へ差し替えてください。
diff --git a/content/notes/_index.md b/content/notes/_index.md
index 3e6bb92..ad9c45d 100644
--- a/content/notes/_index.md
+++ b/content/notes/_index.md
@@ -5,5 +5,3 @@ sort_by = "date"
 template = "notes/section.html"
 page_template = "notes/page.html"
 +++
-
-分野を固定せず、文章として残したいものをまとめています。
diff --git a/content/notes/reading-and-questions.md b/content/notes/reading-and-questions.md
deleted file mode 100644
index 6f67c0c..0000000
--- a/content/notes/reading-and-questions.md
+++ /dev/null
@@ -1,12 +0,0 @@
-+++
-title = "読書の途中にある問いを残す"
-description = "結論だけでなく、読んでいる途中の問いを記録することについて。"
-date = 2025-11-03
-
-[taxonomies]
-tags = ["読書", "論理学"]
-+++
-
-本を読んだあとに結論だけを書こうとすると、文章を残す機会を逃すことがあります。理解できなかった箇所や、別の文章とのつながりも、その時点での大切な記録です。
-
-問いを未完成のまま残しておけば、次に同じ主題へ戻ったときの出発点になります。
diff --git a/content/notes/start.md b/content/notes/start.md
new file mode 100644
index 0000000..3c9fed9
--- /dev/null
+++ b/content/notes/start.md
@@ -0,0 +1,39 @@
++++
+# 必須。ページ見出し、一覧、HTML titleで使用する。
+title = "はじめまして"
+
+# 任意。一覧とmeta descriptionで使用する。不要なら空文字列のままにする。
+description = "Webサイトを立ち上げた経緯と今後について"
+
+# 必須。公開日とNotesの並び順で使用する。
+date = 2026-08-26
+
+# 任意。記事を更新したときにコメントを解除し、更新日を指定する。
+# updated = 2026-08-22
+
+[taxonomies]
+# 任意。タグ一覧とタグ別ページで使用する。
+tags = []
+
+[extra]
+# 任意。content/を基準にしたSoftwareのMarkdown pathを指定する。
+related_software = []
++++
+
+はじめまして。田中 たかしです。
+このWebサイトを立ち上げた経緯や今後どう運用していくかについて記録します。
+
+このサイトでは、日々考えたことや調べたこと、作成したソフトウェアについて記録します。
+
+短いメモから、技術や社会について少し長く考えた文章まで、内容をひとつの分野に限定せず残していく予定です。
+
+ソフトウェアのソースコードは、自分で管理するGitリポジトリをメインとし、cgitで公開する予定です。
+必要に応じて、これまで利用してきたGitHubにもミラーします。
+この構成を選んだ理由については、別の記事で改めて書くかもしれません。
+
+このサイト自体はVPS上で、DebianとかCaddy、zolaなどを使って運用しているので、
+この生成AIが流通する時代に今更な気がしますが、この辺りの技術的な備忘録も残せていけたらと思います。
+
+更新頻度は決めず、書き残したいことがあるときに更新します。
+
+それでは。
\ No newline at end of file
diff --git a/content/notes/static-sites-and-maintenance.md b/content/notes/static-sites-and-maintenance.md
deleted file mode 100644
index 10fcd7d..0000000
--- a/content/notes/static-sites-and-maintenance.md
+++ /dev/null
@@ -1,46 +0,0 @@
-+++
-title = "静的サイトと長期的な保守"
-description = "仕組みを小さく保つことが、長く書き続けるためにどう役立つか。"
-date = 2026-08-21
-updated = 2026-08-22
-
-[taxonomies]
-tags = ["情報工学", "Web"]
-
-[extra]
-related_software = [
-  "software/archive-site/index.md",
-]
-+++
-
-個人サイトの目的は、必ずしも最新の機能を提供することではありません。文章を残し、必要なときに読み返せることが中心なら、静的な構成は今もよく合います。
-
-## 保守する対象を減らす
-
-動的な仕組みを採用すると、アプリケーションだけでなく、実行環境やデータベースも保守対象になります。静的サイトでは、公開環境に置くものを生成済みのHTMLとCSSへ限定できます。
-
-```text
-Markdown → Zola → HTML / CSS / JS
-```
-
-構成を小さくすることは、機能を諦めることではありません。目的に必要な部分を見極め、理解できる範囲に留める判断です[^small].
-
-### 更新の手順
-
-記事を書くときの流れも単純です。
-
-1. Markdownを追加する
-2. `zola check`で内部リンクを確認する
-3. `zola build`で静的ファイルを生成する
-4. 生成物だけを配信する
-
-## 読む時間を中心に置く
-
-長く残す文章では、画面の動きより、行長や余白、リンクの見分けやすさが重要です。このサイトでは[Archive Site](@/software/archive-site/index.md)の設計を通して、その考え方を試しています。
-
-## 参考文献
-
-1. Zola, *Documentation*.
-2. W3C, *Web Content Accessibility Guidelines (WCAG)*.
-
-[^small]: ここでいう「小さい」は、ファイル数ではなく、運用時に理解すべき境界が少ないことを指します。
diff --git a/content/software/_index.md b/content/software/_index.md
index d7e092e..94a9f87 100644
--- a/content/software/_index.md
+++ b/content/software/_index.md
@@ -5,5 +5,3 @@ sort_by = "date"
 template = "software/section.html"
 page_template = "software/page.html"
 +++
-
-ソースコードの正本は自前のcgitで公開し、ここでは人間向けの説明を記録します。
diff --git a/content/software/archive-site/index.md b/content/software/archive-site/index.md
deleted file mode 100644
index ef83fe1..0000000
--- a/content/software/archive-site/index.md
+++ /dev/null
@@ -1,36 +0,0 @@
-+++
-title = "archive-site"
-description = "文章とソフトウェアを長く残すためのZolaサイト。"
-date = 2026-08-21
-include_in_feeds = false
-
-[extra]
-language = ["Zola", "Tera", "SCSS"]
-license = "MIT"
-source = "https://git.takashi-2521.com/archive-site/"
-github_mirror = "https://github.com/takashi-2521/archive-site"
-related_notes = [
-  "notes/static-sites-and-maintenance.md",
-]
-+++
-
-## 概要
-
-NotesとSoftwareを中心に、文章と制作物を長期的に保存するための静的サイトです。
-
-![archive-siteの画面構成例](screenshot.svg)
-
-## 作った背景
-
-断片的なメモとソースコードの間にある、設計意図や調査の過程を一か所に残すために作りました。更新頻度が低くても自然に見える、索引としての情報構造を重視しています。
-
-## 開発の過程
-
-ZolaのSection、Page、Taxonomyをそのまま用い、独自のコンテンツ管理層を作らない方針にしました。表示はTera、スタイルはSCSS、テーマ切替だけを小さなJavaScriptで担当します。
-
-## 特徴
-
-- 年別のNotesアーカイブ
-- タグによる横断的な分類
-- NotesとSoftwareの明示的な関連付け
-- JavaScriptなしでも読める本文とナビゲーション
diff --git a/content/software/archive-site/screenshot.svg b/content/software/archive-site/screenshot.svg
deleted file mode 100644
index 18b05c5..0000000
--- a/content/software/archive-site/screenshot.svg
+++ /dev/null
@@ -1,17 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 960 540" role="img" aria-labelledby="title desc">
-  <title id="title">archive-siteの画面構成例</title>
-  <desc id="desc">ヘッダー、Notes一覧、Software一覧を罫線で整理した画面。</desc>
-  <rect width="960" height="540" fill="#f6f5f1"/>
-  <rect x="72" y="54" width="816" height="46" fill="none" stroke="#d6d8da"/>
-  <rect x="72" y="144" width="500" height="28" fill="#202124"/>
-  <rect x="72" y="194" width="620" height="12" fill="#aeb2b5"/>
-  <rect x="72" y="246" width="816" height="1" fill="#d6d8da"/>
-  <rect x="72" y="280" width="104" height="18" fill="#315f82"/>
-  <rect x="72" y="326" width="816" height="1" fill="#d6d8da"/>
-  <rect x="72" y="348" width="104" height="12" fill="#aeb2b5"/>
-  <rect x="220" y="344" width="420" height="20" fill="#202124"/>
-  <rect x="72" y="392" width="816" height="1" fill="#d6d8da"/>
-  <rect x="72" y="414" width="104" height="12" fill="#aeb2b5"/>
-  <rect x="220" y="410" width="350" height="20" fill="#202124"/>
-  <rect x="72" y="458" width="816" height="1" fill="#d6d8da"/>
-</svg>
diff --git a/content/software/content-notes.md b/content/software/content-notes.md
deleted file mode 100644
index 0d5f6df..0000000
--- a/content/software/content-notes.md
+++ /dev/null
@@ -1,23 +0,0 @@
-+++
-title = "content-notes"
-description = "Markdownだけで考えの断片を整理する小さな道具。"
-date = 2025-10-18
-include_in_feeds = false
-
-[extra]
-language = ["Rust"]
-license = "MIT"
-source = "https://git.takashi-2521.com/content-notes/"
-+++
-
-## 概要
-
-短いメモに日付と題名を付け、単純なディレクトリへ保存するためのコマンドラインツールです。
-
-## 作った背景
-
-思いついたことを残す前に保存場所や形式で迷わないよう、操作を限定した道具が必要でした。
-
-## 開発の過程
-
-保存形式には可搬性の高いMarkdownを採用しました。検索や分類を内部データベースへ閉じ込めず、通常のファイル操作でも扱えることを優先しています。
diff --git a/content/software/ollama-web/capture.gif b/content/software/ollama-web/capture.gif
new file mode 100644
index 0000000..9a086e7
--- /dev/null
+++ b/content/software/ollama-web/capture.gif
diff --git a/content/software/ollama-web/index.md b/content/software/ollama-web/index.md
new file mode 100644
index 0000000..a0d5b75
--- /dev/null
+++ b/content/software/ollama-web/index.md
@@ -0,0 +1,81 @@
++++
+# 必須。Software名、一覧、HTML titleで使用する。
+title = "ollama-web"
+
+# 任意。一覧とmeta descriptionで使用する。不要なら空文字列のままにする。
+description = """
+Docker や仮想マシンを必要とせず、ホスト OS 上で直接起動して利用できる、軽量な個人向け Ollama Web UI です。
+"""
+
+# 必須。Software一覧の並び順で使用する。
+date = 2026-08-22
+
+# 必須。Notes中心のサイトfeedへSoftwareを含めない。
+include_in_feeds = false
+
+[extra]
+# 任意。詳細ページの「使用言語」に表示する。
+language = ["Python"]
+
+# 任意。詳細ページの「ライセンス」に表示する。
+license = "MIT"
+
+# 必須。ソースコードの正本となるcgit URLを指定する。
+source = "https://git.takashi-2521.com/ollama-web/"
+
+# 任意。GitHub mirrorがない場合は空文字列のままにする。
+github_mirror = "https://github.com/takashi000/ollama-web"
+
+# 任意。content/を基準にしたNotesのMarkdown pathを指定する。
+related_notes = []
++++
+
+## 概要
+
+ブラウザから Ollama とのストリーミングチャット、
+Web 検索・URL 取得、画像・ファイル・PDF 添付、MCP Tool Calling を利用できます。\
+大規模な AI プラットフォームを導入せず、個人が小さな構成で使うことを想定しています。
+
+![実行例](capture.gif)
+
+## 背景
+
+OpenWeb UIなどの生成AIプラットフォームだと、DockerなどのVM環境を立ち上げる必要があるのが、
+結構煩わしく感じられました。\
+最近は、Ollamaでも
+GLM-5.2やDeepseek V4などの比較的エージェンティックに動作するオープンウェイトモデルが使用できます。\
+より、手軽に使えるOllamaフロントエンドアプリケーションを作ろうと思いました。
+
+## 開発の過程
+
+基本的には、CodexとZooCodeを使用して開発しました。
+
+軽量化を重視したため、バックエンドにはStarletteとUvicorn、HTML生成にはJinja2を使用しています。
+フロントエンドも専用フレームワークを導入せず、HTML、CSS、JavaScriptで構成しました。
+
+会話履歴などもセッションで管理できるようにしました。\
+ここもデータベースを導入せずに、
+ディレクトリ単位でJSONを使って保存するようにしました。
+
+見た目のUIに関しては、レスポンシブデザインに対応しました。\
+スマホからだとレンダーできないケースが頻発しました。\
+LLMからの応答を逐次受信するたびにMarkdown全体をHTMLへ変換していたからでした。\
+応答が長くなるほど再描画の負荷が増えました。\
+なので、Markdownとしての最終的なHTML変換は応答完了時にまとめて行いました。\
+ストリーミング中の表示はリアルタイムに更新します。
+
+標準のツールには、Web検索・スクレイピング・PDF抽出を搭載しました。\
+必要になった部分だけを追加取得できるように、ツールにページング機能を付けました。\
+ツール呼び出しが一定回数を超えた場合は、その時点で最終回答を生成させるようにしました。
+
+MCPにも対応しました。プロトコルは2025-11-25版[^1]です。\
+対応したトランスポートは、stdioとStreamable HTTPです。\
+SSEは非推奨でしたので、非対応です。\
+tool/list、tool/callの最小限の機能だけ実装しました。
+[^1]: [Model Context Protocol Specification — 2025-11-25](https://modelcontextprotocol.io/specification/2025-11-25)
+
+PIN認証、CSRF・CSP対策、取得先URLの検査、MCP実行ファイルと接続先の許可リスト化を採用しました。\
+LANからの利用、Web取得、ファイル操作、MCPによる外部プログラムの起動をセキュアに保ちます。\
+任意のプロセスの起動を防ぐため、明示的に許可した実行ファイルだけstdio経由でのMCPに使用できます。
+
+## 参考資料
\ No newline at end of file