sfsp(single function static page)
gist.md
code:prompt
個人ウェブサイトを自分の城として太らせて人生体験を上げたい。直近では個人ウェブサイト運営者が集まるコミケのようなイベントもあり、そこで披露もしたいと思っている（3ヶ月後）。
今日 /now という考え方を知った。/about にて「このサイトについて」を取り上げるのは定番だが、それと同じノリで、/now で「今やっていること」を取り上げるのである。SNS その他日記の内容ではなく、自分の今のフォーカスを紹介するページである。
さて、ここからが本題だが、このように特定の意図を持ったページは色々考えられると思う。/xxxx の形になるよね。これを single function static page（sfsp）と呼びたい。static とつけているのは静的なページに限定したいからだ。JavaScript やバックエンドなどでリッチコンテンツをつくることは許容しない。あくまでも HTML で表現できる程度のものである。
sfsp として他に何があるかを 20 個提案して。
code:5.2
1. **/uses**
使っているハード・ソフト・サービス・作業環境（エディタ、フォント、PC、机など）。
2. **/setup**
作業机・部屋・持ち物の構成。/uses よりも「配置」や「運用」に寄せる。
3. **/projects**
進行中・休止中・完了した個人プロジェクトの一覧（短い説明＋リンク）。
4. **/ideas**
温めているアイデア置き場。実装前提じゃなくてもよく、方向性だけをメモ。
5. **/principles**
行動指針・価値観・判断基準（何を大事にして何を捨てるか）。
6. **/defaults**
自分の「デフォルト設定」集（連絡手段、返信ペース、予定の立て方、普段の優先順位）。
7. **/contact**
連絡先と連絡方法のガイド。問い合わせの種類別の推奨ルートも書ける。
8. **/colophon**
このサイトの技術構成・方針（ビルド方法、フォント、ホスティング、アクセシビリティ方針）。
9. **/changelog**
サイト更新履歴。「何をどう変えたか」を短く積み上げる。
10. **/status**
今の稼働状況（例：忙しい/余裕あり/返信遅め）。/now よりも対外的。
11. **/questions**
よく聞かれる質問への回答（FAQ）。自分向けの定型文集としても機能。
12. **/start**
初見の人向けに「ここから読む」導線。代表記事・自己紹介・おすすめ順。
13. **/links**
外部リンク集（影響を受けたサイト、友人サイト、ツール、コミュニティ）。
14. **/people**
自分が紹介したい人・サイト運営者の一覧（短い推薦文つき）。
15. **/reading**
読書中/最近読んだ本と一言メモ。SNS的感想ではなく「何を吸収しているか」。
16. **/listening**
最近聴いている音楽・ポッドキャスト。気分や作業との相性など短評。
17. **/watching**
観ている作品（映画・アニメ・YouTube等）と、今の関心軸。
18. **/learning**
学んでいること（言語、数学、デザイン等）と、今の教材・到達目標。
19. **/goals**
目標（今年/今季/今月）と進捗の置き方。数を絞ると /now と相性がいい。
20. **/wishlist**
欲しいもの・行きたい場所・やりたいこと。買うためというより「興味のレーダー」。
被ってないのは★つける
code:5.2 part2
1. **/uses**
使っている道具・環境（PC、エディタ、フォント、ガジェット、ホスティング等）。更新は不定期でOK。
2. **/defaults**
自分の基本設定（連絡の返し方、時間の使い方、通知ポリシー、意思決定の癖など）。コラボ相手に効く。
3. **/principles**
判断基準・価値観・設計思想（文章、仕事、創作、生活の優先順位）。
4. **/status** ★
今の稼働状況（多忙/余裕、依頼受付可否、返信遅延など）を短く掲示する掲示板的ページ。
5. **/contact**
連絡手段の集約（メール、SNS、フォーム代替、PGP鍵、返答目安）。「ここから連絡して」を1ページに。
6. **/colophon**
サイトの奥付。技術スタック、生成方法、デザイン方針、ライセンス、更新履歴の扱いなど。
7. **/start-here**（または /hello） ★
初見の人の導線。「まずこれを見て」ページ。代表作・おすすめ記事・サイトの歩き方。
8. **/faq** ★
よく聞かれることへの回答。イベント前にも便利（「何してる人？」「依頼できる？」等）。
9. **/press**
自己紹介の定型文、プロフィール文の長短、ロゴやアイコン、掲載時のクレジット表記など（個人版 press kit）。
10. **/links**
外部リンク集。自分が読んでほしいもの／居場所／友人サイト／相互リンク方針など。
11. **/recommendations**（または /rec）
作品・本・ツール等の推薦リスト。「今の自分を形作ってるもの」的に強い。
12. **/reading**
いま読んでいる領域・積読方針・読書メモへの導線（ログではなく“関心領域の棚”として）。
13. **/listening**（または /music）
聴いている音楽の傾向、作業用プレイリストへの導線など（これも“傾向の紹介”に寄せる）。
14. **/watching**
観ているもの（映画/アニメ/講義）の「ジャンルやテーマ」中心に。人格の輪郭が出る。
15. **/learning**
学んでいるテーマ、学習方針、使ってる教材。/now と相性が良い「焦点の棚卸し」。
16. **/projects**
進行中・代表プロジェクトの一覧（ステータス表示はあっても良いが、日報にはしない）。
17. **/ideas**
やりたいことリスト／温めてるアイデア。完成品でなくても「興味の地図」として見せる。
18. **/speaking**（または /talks） ★
発表・登壇・展示の記録と、発表依頼の受け方。コミケ的イベントにも直結。
19. **/support**（または /tip、/donate） ★
支援の方法（投げ銭、ほしい物リスト、仕事依頼、リンクしてね等）。やり方を明確にするページ。
20. **/license**（または /terms、/copyright） ★
文章・画像・コードの利用条件、引用OK範囲、二次利用の連絡要否。明文化すると安心。
code:4.1
1. **/about**
サイトや自分についての紹介ページ（定番）。
2. **/now**
「今」何に取り組んでいるか、今のフォーカス。
3. **/uses**
自分が現在使っているツール／アプリ／デバイスのリスト。
4. **/goals**
短期・中期・長期の目標や到達したいことを列挙。
5. **/links**
お気に入りサイト・参考サイト・関連サイトへのリンク集。
6. **/faq**
よくある質問一覧とその回答（自分／サイト／活動について）。
7. **/books**
読んだ本、読んでいる本、本棚紹介、推し本リスト。
8. **/movies**
最近観た映画、お気に入り映画リスト、レビュー。
9. **/wish**
欲しいものリストや、叶えたいことリスト。
10. **/timeline**
これまでの自分の年表や主な出来事のタイムライン。
11. **/cv**
経歴書・職務経歴やスキル、簡易履歴。
12. **/values**
自分の価値観や信念、座右の銘などの紹介。
13. **/idea**
自分のアイディア集、メモ、ブレインストーミングの記録。
14. **/colophon**
このサイトの制作環境や技術的背景、サイト制作の歩み。
15. **/credits**
感謝したい人やツール、製作協力などにクレジットを掲載。
16. **/portfolio**
自分の作った作品集や実績などをまとめる。
17. **/rules**
自分の行動指針やルール、ポリシー一覧。
18. **/contact**
連絡先ページ（メールアドレスやSNSへのリンク等）。
19. **/privacy**
個人情報保護方針やプライバシーポリシー。
20. **/future**
これからやりたいこと・計画・ビジョン。
code:4o
1. **/goals** - 現在の目標リストや達成したいこと。
2. **/reading** - 今読んでいる本やおすすめのリスト。
3. **/music** - 最近聴いている音楽やプレイリスト。
4. **/projects** - 現在進行中のプロジェクトや将来の計画。
5. **/wishlist** - 欲しいものリストや取組みたいこと。
6. **/quotes** - 大切にしている引用文や座右の銘。
7. **/learning** - 現在学んでいることや興味のある分野。
8. **/tools** - 日々使用しているツールやアプリのリスト。
9. **/faq** - 自分に関するよくある質問とその回答。
10. **/photos** - 最近撮ったお気に入りの写真ギャラリー。
11. **/ideas** - 思いついたアイデアや未来の構想。
12. **/travels** - 訪れた場所や旅行の記録。
13. **/experiments** - 試している新しいことや挑戦。
14. **/values** - 大事にしている価値観や信念。
15. **/community** - 所属するコミュニティやネットワーク。
16. **/health** - 健康維持のために行っていることや目標。
17. **/sketches** - 手書きのメモやスケッチのコレクション。
18. **/movies** - 最近観た映画やお気に入りのリスト。
19. **/memories** - 大切な思い出や過去の経験。
20. **/thankyou** - 今まで影響を与えてくれた人や感謝したいこと。
code:5.1
1. **/start**
- そのサイトを初めて訪れた人向けの「最初に読んでほしい案内」。
- 自己紹介ではなく、「このサイトをどう歩けば楽しいか」のガイド。
2. **/colophon**
- サイト制作環境の情報（エディタ、生成ツール、ホスティング、フォント、配色など）。
- ウェブ職人的なこだわりを見せる、作り手向けのメタページ。
3. **/stack**
- 使っているツール・アプリ・サービスの一覧。
- PC・スマホ・開発ツール・ライフログなど、自分の「環境」を見せる。
4. **/values**
- 自分が大切にしている価値観・原則をシンプルに列挙するページ。
- 行動規範や、判断に迷ったときに立ち返るためのベースとして。
5. **/rules**
- 自分ルール・マイルール集。
- 「朝のルール」「作業中のルール」「SNS の使い方ルール」など、実践寄りの規範。
6. **/reading**
- 今読んでいる本・最近読んだ本と、一言コメントの静的リスト。
- 更新時に HTML を書き換えるだけの読書ログ兼おすすめページ。
7. **/portfolio**
- 作品やプロジェクトを一覧できるショーケース。
- 各項目に「概要・役割・時期・目立つポイント」だけを簡潔に。
8. **/uses**
- 海外の /uses 文化に倣って、「自分が使っているもの」を並べるページ。
- ガジェット・キーボード・デスク環境・ソフトなど「物」中心。
9. **/timeline**
- 自分の人生や活動の年表。
- 年ごと・時期ごとに「何をしていたか」を短文で並べるだけ。
10. **/elsewhere**
- インターネット上の自分へのリンク集。
- SNS・他サイトでの連載・寄稿・ゲスト出演などのハブ。
11. **/collected**
- ネットで見つけた「これはよかった」な記事・動画・ツールのリンク集。
- ブクマではなく「人に見せたいコレクション」として整理。
12. **/principles**
- 仕事・創作・学習などテーマ別の「自分なりの原則集」。
- /values が価値観的だとしたら、こちらは実務寄りの指針。
13. **/faq**
- よく聞かれる（または聞かれそうな）質問と、その回答。
- 「このサイトの使い方」「自分への連絡方法」「依頼について」など。
14. **/projects**
- 進行中・保守中・終了済みのプロジェクト一覧。
- 一つひとつに簡単な説明とステータス（active/paused/archived など）だけ。
15. **/sheet**
- 自分を「キャラシート」的に表現するページ。
- 能力値（体力・知力・社交力など）やスキルリスト、装備、特性などを遊び心で記述。
16. **/lab**
- 試作・メモ的ページへの入口。
- 未完成なアイデアや実験企画へのリンクを「研究メモ」感覚でまとめる。
17. **/log**
- ブログほど細かくない「活動ログ」。
- 月ごとに「今月やった主なこと」を箇条書きするだけの履歴。
18. **/index**
- サイト内のコンテンツを網羅して一覧化した「目次ページ」。
- カテゴリ別・年代別など、自分が把握しやすい軸で整理。
19. **/manifesto**
- 自分の考えや姿勢を少し熱量高めにまとめた宣言文。
- 「なぜ書くのか」「なぜこのサイトをやるのか」など、理念寄り。
20. **/contact**
- 連絡手段を明示するだけのページ（メールアドレス、連絡ポリシーなど）。
- フォームなどは使わず、「どんな内容なら歓迎か・NGか」も書いておく。
code:o1
1) /colophon
└ サイトに使用しているフォントやデザインの由来、制作環境（エディタやホスティング先など）を記載。いわば Web サイトの奥付/制作情報ページ。
2) /start
└ 初めて訪れた人向けの「ここを見ると全体像がわかる」案内ページ。サイト全体のリンクやコンテンツの目的をまとめる。
3) /stack
└ 使用しているツールや技術スタックを淡々とリスト化。静的サイトジェネレータやエディタ、拡張機能などを整理して紹介。
4) /reading
└ 現在読んでいる本や、過去に読んでよかった本をシンプルに一覧化。タイトルとひと言レビューぐらいがちょうどよい。
5) /wishlist
└ 欲しい物、やってみたいことを列挙しておくページ。サイト訪問者が興味を持ったら応援やサポートをしてくれるかも。
6) /timeline
└ 自分自身やサイトに関する年表。いつ何を始めたか、どんな経緯で成長してきたかをシンプルにまとめる。
7) /faq
└ サイトや運営者に対するよくある（あるいは想定される）質問への回答まとめ。SNS・連絡先に誘導する窓口としても使いやすい。
8) /values
└ 運営者の大切にしている価値観や原則を羅列するページ。多くを書かず一言ずつ端的にまとめておくのがおすすめ。
9) /failures
└ 失敗事例の記録。チャレンジしたけれどダメだったこと、そこから学んだことを書き連ねる。意外な親近感を生むコンテンツにもなる。
10) /methods
└ 自分が活用している作業手法やライフハックを箇条書きにしたハウツー系ページ。手短かにまとめると静的な読み物として自然に収まる。
11) /principles
└ 信条や行動の指針をまとめたページ。たとえば「素直に学び続ける」「わかりやすさを心がける」などの一文を並べる形。
12) /ideas
└ 今思いついているアイデアを箇条書きにしておく。大きな企画から小さな発明まで、鮮度が大事なので短文を中心に。
13) /quotes
└ 自分が感銘を受けた名言や引用を並べるページ。静的にテキストだけ載せても雰囲気が出る。
14) /resources
└ 参考にしているサイトや、学習に役立った記事・サービスなどを一覧で整理。一種のリンク集としても機能する。
15) /glossary
└ 独自用語や専門用語のミニ辞典。自分のサイト特有の言い回しや、業界専門用語などを読み手向けに解説する。
16) /tools
└ 自分がよく使っている道具（文房具やガジェットなど物理的なもの含む）を写真と簡単な説明で載せる。あえて JavaScript なしでギャラリー風に配置するのも面白い。
17) /mission
└ 自分が今後取り組みたいこと、社会やコミュニティに貢献したい目標を掲げるページ。
18) /updates
└ サイトに加えたアップデート内容を時系列で一覧にする。ちょっとした更新履歴として。
19) /subscribe
└ メルマガ登録や連絡先一覧の入り口として活用。実際には JavaScript やフォームを使うと静的ではなくなるので、問い合わせや SNS のリンクを置くだけにとどめる形。
20) /disclaimer
└ サイトを利用するにあたっての免責事項（情報の正確性やリンク先の責任範囲など）をまとめる。大きく更新する必要がないので静的ページ向き。
code:o3mini
1. /now
→ 今の自分のフォーカスや取り組んでいることを紹介。（既存アイディアの確認）
2. /then
→ 過去の重要な出来事や当時の志向を振り返るページ。過去と今の比較に使える。
3. /next
→ 近い将来に挑戦予定のプロジェクトや計画、展望を記述するページ。
4. /goals
→ 現在設定している目標や達成したいミッションをシンプルにまとめたページ。
5. /projects
→ 現在進行中や、これから始めるサイドプロジェクト、作業中の案件を紹介するページ。
6. /skills
→ 最近磨いている技術や習得中のスキル、強化ポイントなどを紹介するページ。
7. /tools
→ 日々活用しているツール、アプリ、フレームワークなどをピックアップし、簡単な紹介を書くページ。
8. /inspiration
→ 今影響を受けているアイディアや、インスピレーションの源（本、アーティスト、ニュースなど）を紹介。
9. /favorites
→ 最近のお気に入りの本、映画、音楽、ウェブサービスなど、今ハマっているものをリストアップするページ。
10. /ideas
→ ふと浮かんだアイディアや、試してみたい実験的コンセプトを簡潔にまとめるページ。
11. /bookmarks
→ 最近ブックマークした記事やリンク、参考資料を集めたページ。静的なリストで十分。
12. /resources
→ 自分が役立つと感じたリソース（ツール、ライブラリ、チュートリアル等）の情報をまとめるページ。
13. /diary
→ 定型的な日記ではなく、ある期間（週、月）の振り返りやキーポイントを切り出した「編集日記」的なページ。
14. /reflection
→ 経験や挑戦から学んだ教訓や気づきを、ピックアップ形式で記述する振り返りページ。
15. /agenda
→ ある時点でのスケジュールや、今後の予定、どこに注力するかを整理しておくページ。
16. /mindset
→ 今の自分の心構えや思考の傾向、自己理解に基づいたメッセージを語るページ。
17. /portfolio
→ 過去の成果物と現在のプロジェクトをひとまとめにして、ビジュアルや説明文と共に紹介するページ（HTML のみのシンプルな構成で）。
18. /challenge
→ 自分に課したチャレンジや、実験的試み、乗り越えようとしている難題をテーマにしたページ。
19. /discoveries
→ 最近発見した新技術や面白いコンセプト、アイディアなどを、発見エピソードとともに掲載するページ。
20. /journey
→ 自己成長の過程や、これまでの人生・キャリアの道のり、未来へのステップなどをストーリーとしてまとめるページ。
code:o4mini
1. /uses
自分が日常的に使っているツール・ガジェット・ソフトウェアを一覧で紹介
2. /projects
現在進行中／過去の個人プロジェクトやサイドプロジェクトをまとめる
3. /reading
今読んでいる本・最近読了した本のリスト＆ひと言コメント
4. /listening
よく聴いている音楽プレイリストやポッドキャストを紹介
5. /watching
観ている映画・ドラマ・動画シリーズのリストと感想メモ
6. /wishlist
いま欲しいもの／やりたいことの願望リスト
7. /goals
直近（3ヶ月／半年）の個人的な目標やチャレンジ項目を列挙
8. /timeline
自分の人生やキャリアの主要イベントを年表形式で表示
9. /speaking
今後の登壇予定・イベント出演情報と簡単な概要
10. /resume
履歴書・職務経歴書を要点だけ静的にまとめたページ
11. /faq
「よくある質問と回答」をQ&A形式で整理
12. /links
おすすめサイト・ブログ・書籍への外部リンク集
13. /archive
過去の更新履歴や旧ブログ記事のアーカイブ一覧
14. /sitemap
サイト全体の構成を可視化したページ（htmlリンクマップ）
15. /contact
連絡先（メールアドレス／SNSアカウント等）をまとめたページ
16. /press
メディア掲載実績やインタビュー記事へのリンク一覧
17. /stats
アクセス数の推移や自分の生産性指標などをグラフ画像で公開
18. /snippet
ちょっと便利なコードスニペットやコマンド集
19. /quotes
自分の座右の銘・好きな名言コレクション
20. /photos
自分で撮った写真ギャラリー（静的サムネイル＋オリジナル画像へのリンク）