Appearance
个人网站功能台账（Feature Ledger）
本文用 MoSCoW 法（Must / Should / Could / Won't）对个人网站
luowenpeng.com做一次功能盘点：对照 2026 年同类产品的市场通有功能基准，标出本站已有能力与用户需求但尚未实现的缺口，并给出优先级路线图。所有判断都先过一遍第〇原则——见下。
〇、第〇原则：足够好看（Foundation）
第〇原则优先于一切 MoSCoW 判定。 一个功能再"应该做"，如果会伤害"好看"，就要降级或换更克制的实现；一个功能再"不会做"，如果它是好看的根基（速度、留白、字体、对比度），就是 Must。
"好看"在本站具体拆成五条可判定的子原则：
- 快——慢等价于不好看（LCP < 2.5s、CLS < 0.1 是 2026 硬指标）。
- 净——极简留白、信息层级清晰，不堆砌按钮与部件。
- 读——排版舒适（正文行高、字号、字体层级）、深浅双主题。
- 一——视觉有统一识别（配色、格言、字体气质），不杂乱。
- 容——无障碍（对比度、alt、键盘可达）是"对所有人好看"。
一、MoSCoW 口径
| 等级 | 含义 | 本站判定习惯 |
|---|---|---|
| Must | 没有它站点就失格（违背第〇原则或核心用途） | 速度/SEO/可达性/断链体验的基础项 |
| Should | 高价值、用户普遍期待，应尽快做 | 分享、归档、阅读细节、结构化数据 |
| Could | 锦上添花、可 delight，但不紧急 | 微交互、PWA、Now 页、灯箱 |
| Won't | 现阶段明确不做（与定位冲突或过度） | 广告、登录、AI 客服、重客户端渲染 |
二、市场通有功能基准（2026，来自行业调研）
调研 2026 年个人网站 / 博客最佳实践，同类产品普遍具备的能力可归为六类：
- 视觉与舒适：极简留白布局、粗体排版、深色模式切换（已从"潮流"变为"标配"）、移动优先响应式、微交互（克制 hover / 滚动动效）。
- 性能与 SEO：极速加载（Core Web Vitals）、XML sitemap、OG / Twitter 卡片、结构化数据（JSON-LD）、语义化标题、图片优化与懒加载、"最后修改"日期。
- 导航与结构：站内搜索、关于页、联系方式、文章归档 / 索引、标签 / 分类、自定义 404、隐私政策页、新访客引导（Start Here）。
- 互动与留存：RSS、相关阅读、社交分享按钮、评论系统（Giscus 等隐私友好方案）、邮件订阅、阅读时长、阅读进度条。
- 统计与信任：隐私友好统计（Plausible / GoatCounter / Umami）、内容许可声明。
- 进阶 / IndieWeb：无障碍审计、图片灯箱、PWA / 离线、Webmention、Now 页、留言板、多语言。
关键趋势：深色模式、隐私统计、结构化数据、无障碍在 2026 已从"加分项"转为"预期项"；纯 Google Analytics + 无深色模式 + 无 404 的站点会被视为"不够现代"。
三、当前站点能力盘点（luowenpeng.com 现状）
已具备（✅）：SSG 静态极速、响应式、深色切换（VitePress 默认）、极简留白排版、Noto Serif SC 标题层级、OG/Twitter 卡片 + og:image、自动 sitemap、local 搜索、关于页、邮箱联系、RSS（自建）、相关阅读、GoatCounter 隐私统计、TOC、回到顶部、CC 许可、KaTeX、代码高亮、lastUpdated。
待判定 / 缺口（❌/△）：无 404 页、无归档 / 标签页、无社交分享、无评论、无邮件订阅、无结构化数据、无阅读时长 / 进度条、无隐私政策页、无障碍未审计、微交互缺失、图片未显式优化。
四、功能台账（核心）
图例：市场 = 通有(主流标配) / 常见(多数有) / 进阶(部分有) / 小众；现状 = ✅ 已有 / △ 部分 / ❌ 无。
4.1 视觉与舒适（好看层）
| # | 功能 | 市场 | 现状 | MoSCoW | 与第〇原则 | 备注 |
|---|---|---|---|---|---|---|
| 1 | 极简留白布局 | 通有 | ✅ | Must（已达成） | 净 | lixiaolai 风 custom.css，已是站点底色 |
| 2 | 深色模式切换 | 通有 | ✅ | Must（已达成） | 读 | VitePress 默认开启（config 未关 appearance） |
| 3 | 响应式 / 移动优先 | 通有 | ✅ | Must（已达成） | 净/读 | VitePress 默认 |
| 4 | 字体层级 / 粗体排版 | 通有 | ✅ | Must（已达成） | 一 | Noto Serif SC 标题 + Inter 正文 |
| 5 | 微交互（hover/滚动动效） | 常见 | ❌ | Could | 净（须克制） | 可加按钮 hover、卡片轻动效，不可破坏极简 |
| 6 | 视觉个性 / 品牌识别 | 常见 | △ | Should | 一 | 格言+蓝灰配色已有，可强化 hero 视觉记忆点 |
| 7 | 首屏动效 / hero 叙事 | 小众 | ❌ | Could | 一 | 与极简权衡，宜轻 |
4.2 性能与 SEO（基础层）
| # | 功能 | 市场 | 现状 | MoSCoW | 与第〇原则 | 备注 |
|---|---|---|---|---|---|---|
| 8 | 极速加载（Core Web Vitals） | 通有 | ✅△ | Must | 快 | SSG 已快；hero-bg.jpg(69KB) 可压缩/加尺寸提示 |
| 9 | XML sitemap | 通有 | ✅ | Must（已达成） | — | 构建自动生成含 lastmod |
| 10 | OG / Twitter 卡片 | 通有 | ✅ | Must（已达成） | — | og:image 已配 |
| 11 | 结构化数据 JSON-LD | 常见 | ❌ | Should | — | Article/Breadcrumb 富媒体摘要，提升搜索呈现 |
| 12 | meta/描述/lastUpdated | 通有 | ✅ | Must（已达成） | — | frontmatter 驱动 |
| 13 | 图片优化 / 懒加载 / 尺寸 | 常见 | △ | Should | 快 | 体积可控但未显式 width/height、未 lazy |
4.3 导航与结构（体验层）
| # | 功能 | 市场 | 现状 | MoSCoW | 与第〇原则 | 备注 |
|---|---|---|---|---|---|---|
| 14 | 站内搜索 | 通有 | ✅ | Must（已达成） | 净 | local search 已配 |
| 15 | 关于页 | 通有 | ✅ | Must（已达成） | — | about.md 已建 |
| 16 | 联系方式 | 通有 | ✅ | Must（已达成） | — | 邮箱 + RSS |
| 17 | 文章归档 / 索引页 | 常见 | ❌ | Should | 净 | 现仅靠 nav 下拉，文章增多会臃肿（见后续待办） |
| 18 | 标签 / 分类页 | 常见 | △ | Could | 净 | sidebar 分组近似，非真标签聚合页 |
| 19 | 自定义 404 页 | 通有 | ❌ | Must | 净 | 断链落地页缺失，直接伤"好看"与专业感 |
| 20 | 新访客引导（Start Here） | 常见 | ❌ | Could | 净 | 降低跳出，可复用首页四卡片 |
| 21 | 隐私政策页 | 通有 | ❌ | Should | 容 | 合规 + 信任延伸；GoatCounter 虽隐私友好仍建议有 |
4.4 互动与留存（参与层）
| # | 功能 | 市场 | 现状 | MoSCoW | 与第〇原则 | 备注 |
|---|---|---|---|---|---|---|
| 22 | RSS 订阅 | 通有 | ✅ | Must（已达成） | — | 自建 generate-rss.mjs，frontmatter 驱动 |
| 23 | 相关阅读 | 常见 | ✅ | Should（已达成） | 净 | 文末三组互链 |
| 24 | 社交分享按钮 | 常见 | ❌ | Should | 净（克制） | 每页底部 2–3 个主流平台即可，避免按钮墙 |
| 25 | 评论系统（Giscus） | 常见 | ❌ | Should（可 Won't） | 净（权衡） | 能激活讨论，但部件易破坏极简；优先 Giscus（无追踪） |
| 26 | 邮件订阅 newsletter | 常见 | ❌ | Could | 净 | 与 RSS 定位重叠，可作为 RSS 补充 CTA |
| 27 | 阅读时长 | 常见 | ❌ | Should | 读 | frontmatter 或脚本估算，体验细节 |
| 28 | 阅读进度条 | 进阶 | ❌ | Could | 读 | 顶部细进度条，克制实现 |
| 29 | 打印样式 | 小众 | ❌ | Could | 容 | @media print 优化长文打印 |
4.5 进阶 / 无障碍 / IndieWeb
| # | 功能 | 市场 | 现状 | MoSCoW | 与第〇原则 | 备注 |
|---|---|---|---|---|---|---|
| 30 | 无障碍审计（alt/对比度/键盘） | 通有(合规趋势) | △ | Must | 容 | 2026 已属预期项；补 alt、核对比度、键盘可达 |
| 31 | 图片灯箱 | 进阶 | ❌ | Could | 读 | 点击放大，长文配图友好 |
| 32 | PWA / 离线 | 进阶 | ❌ | Could | 快 | 可安装 + 离线读，SSG 友好 |
| 33 | Webmention / IndieWeb | 小众 | ❌ | Won't（可 Could） | — | 个人站社交协议，投入产出比低 |
| 34 | Now 页 | 小众 | ❌ | Could | 一 | "现在在做啥"，增强人格 |
| 35 | 留言板 / Guestbook | 小众 | ❌ | Could | 净 | 比评论更轻量，可替代评论 |
| 36 | 多语言（中英） | 小众 | ❌ | Won't | — | 现阶段内容以中文为主，不做 |
4.6 明确不做（Won't）
| # | 功能 | 理由（与第〇原则/定位冲突） |
|---|---|---|
| 37 | 广告 / 变现 | 非站点目的，破坏"净"与信任 |
| 38 | 登录 / 会员体系 | 个人站无需，增加复杂度与攻击面 |
| 39 | AI 客服 / 语音搜索 | 过度工程，与内容站定位不符 |
| 40 | 客户端渲染 SPA | 守住 SSG（快 + SEO + 好看的根基） |
五、用户需求但尚未实现（Gaps）
这里的"用户需求"指：从第〇原则推导的必然需求 + 行业普遍期待 + 本站内容形态（长文/数据/周报）带来的特定需求。
- 断链兜底（404 页）——任何站点都躲不开的死链场景，当前缺失，是最该立刻补的 Must。
- 无障碍基线——含图片 alt、对比度复核、键盘导航；既是 2026 预期项，也是"对所有人好看"。
- 文章归档 / 全量索引——本站文章已 10+ 篇且持续增长（城轨周报周更），仅靠 nav 下拉会迅速臃肿；需要一个按时间/分组的归档页。
- 结构化数据——长文 + 城轨周报都是被搜索引擎/AI 摘要抓取的好素材，缺 JSON-LD 等于放弃富媒体呈现。
- 社交分享 + 阅读时长——低成本的"好看体验细节"，当前为零。
- 隐私政策页——即便用 GoatCounter（无 Cookie），一份简洁隐私说明仍能提升信任（E-E-A-T 信号）。
- 视觉记忆点强化——格言与蓝灰配色已有识别，但 hero / 关于页可再有克制的人格化表达（微交互或轻叙事）。
- 评论或留言板（待定）——用户未明确要，但"个人站 + 行业周报"有讨论价值；若做，优先 Giscus 或 Guestbook，避免 Disqus 追踪破坏"净"。
六、建议路线图（按 MoSCoW 分期）
第一阶段 · Must（先补齐"失格项"，直接护住第〇原则）
- [ ] 自定义 404 页（
docs/404.md→404.html） - [ ] 无障碍基线：补图片 alt、复核对比度（≥4.5:1）、键盘可达性自查
- [ ] 图片显式优化：width/height 防 CLS、关键图懒加载、hero-bg 压缩
- [ ] 结构化数据 JSON-LD（Article + Breadcrumb）注入
第二阶段 · Should（拉齐"市场普遍期待"）
- [ ] 文章归档 / 索引页（替代膨胀的 nav 下拉，可基于 frontmatter 自动聚合）
- [ ] 社交分享按钮（每页 2–3 平台，克制）
- [ ] 阅读时长估算
- [ ] 隐私政策页
- [ ] 视觉识别强化（hero/关于页轻量人格化）
第三阶段 · Could（锦上添花，按精力投放）
- [ ] 微交互（hover/滚动，克制）
- [ ] 阅读进度条 / 灯箱
- [ ] PWA / 离线
- [ ] Now 页 / 留言板（替代或补充评论）
- [ ] 打印样式
明确不做
- 广告、登录会员、AI 客服、语音搜索、客户端渲染 SPA、多语言（现阶段）。
七、权衡提醒
- 好看 ≠ 功能多。每加一个部件都要问："它让页面更净了，还是更挤了？" 评论、分享、订阅若堆一起，反而伤第〇原则。
- SSG 是好看的地基：速度即好看，Won't 列表里的客户端渲染、重框架都守住不碰。
- 先做 Must 再谈 Should：404、无障碍、结构化数据这三件"看不见但失格"的项，优先级高于任何炫酷微交互。
- 数据类内容（客流/周报）天然适合"可发现 + 可订阅"：RSS 已具备，结构化数据 + 归档页是它们被搜到的关键杠杆。
台账状态：初版（2026-09-16）。随站点演进持续更新；新功能上线后在对应行把"现状"从 ❌/△ 改为 ✅，并补一行上线备注。