两轮网站打磨记：从 AI 助手悬浮入口到全文 RSS

距离上一篇全站优化记快两个月了。这期间网站没大动，但积攒了两轮「体检 → 修复」的迭代：一轮偏 UI 与内容，一轮偏 基础设施与 SEO。还是老规矩，写下来给自己备忘，也给同样在折腾 Hugo 博客的朋友一个参考。

这次的改进方式：先体检，再动手 #

和上次「凭感觉改」不同，这两轮都是先做全站体检，把发现的问题按影响排序，确认了再改。体检维度包括：

好处很明显：避免为不存在的问题写代码。这次体检我还发现了两个自己误报的项——tutoring 页案例卡和 mermaid 按需加载其实都工作正常，是我 grep 模式太窄导致的假阴性。先验证再动手，省下了两次无意义的改动。

这是两轮里影响最实际的一项。Congo 主题的 header 之前用的是 basic 布局，桌面端横排没问题，但手机上 10 个导航链接会竖排挤满首屏，用户要滑很久才能看到正文。

改法就一行配置：

[header]
  layout = "hybrid"   # 手机汉堡菜单, 桌面保持横排

hybrid 是主题现成的第三种布局：窄屏收进汉堡按钮，宽屏照旧横排。改完用浏览器实测了菜单展开、桌面布局不变、无控制台报错。主题作者早就把路铺好了，我们只是没翻到那一页配置。

浏览器标签页显示「田稼禾 | 安全研究员」，但微信/Twitter 分享出去的卡片标题却是「田稼禾的个人网站」——两个 title 来源不同步（hugo.yaml 和语言配置各管一个）。统一成同一个值，分享出去的第一印象才一致。

把 obsidian 里两段实习的 70+ 篇笔记重新翻了一遍，安全研究页的实习经历做了内容扩充，每条都有真实笔记出处：

后来又按隐私考虑把实习板块做了匿名化——公开页面不出现具体单位名称和内部系统组合，细节留在简历和面试里讲。

体会是：简历素材不在记忆里，在笔记里。当时觉得琐碎的记录，两个月后就是现成的 bullet。

AI 简历助手原来只有首页有入口，其他页面要回首页才能找到。这次在右下角加了一个全站悬浮按钮：

实现思路：全站注入点用 extend-footer.html partial，样式进 custom.css。悬浮按钮这种小功能，最容易犯的错是为此引入一坨 JS——其实 Hugo 的模板条件 + CSS 动画就够了。

Hugo 内置的 RSS 模板输出的是 .Summary，订阅者只能看到 218 字摘要。覆盖 layouts/_default/rss.xml 后：

改的过程踩了个坑：第一版模板在无子页面的路由上 $pages 为空，first 函数直接报错。兜底逻辑要显式处理边界。

首页头像是首屏最大的图片元素（LCP），之前却标着 loading="lazy" + fetchpriority="low"——等于告诉浏览器「这个最不着急」。对 LCP 元素这是反向优化。改法：

<!-- 前: loading="lazy" fetchpriority="low" -->
<!-- 后: fetchpriority="high"（去掉 lazy） -->

一行属性，移动端首屏出图更快。lazy loading 不是万能优化，首屏元素用它就是负优化。

《网站安全加固全记录》原来只归「网站建设」，导致 /research/（AI 安全研究专题）收不到它。补上双分类 ["网站建设", "安全研究"]，专题页从 18 篇到 19 篇。双重身份的内容就该有两个入口。

也有不少维度查过之后确认没问题，记下来避免以后重复怀疑：

这轮最大的收获。两次「发现的问题」其实是我检测方式的问题，不是网站的问题。花 30 秒换个姿势验证，比写半小时无用代码划算。

layout = "hybrid"、extend-footer.html、rss.xml 覆盖——这次用到的三个改动全部是 Hugo 的模板覆盖机制，一行主题代码都没改。升级依然无冲突。

上轮查了 UI 和内容，这轮查响应头、RSS、结构化数据、进程托管——不重复的维度才有新发现。下次再体检，可以看看 Core Web Vitals 实测数据和 Lighthouse 跑分。

系列前篇：个人博客全站优化记。这个系列还在继续，网站和我一样，都是边跑边修。