Nutriéa
一个在SEO上持续增长、却从不越过医疗建议界线的健康门户。
- 年份
- 2026
- 制作周期
- 7 周
- 技术栈
- Next.js · React · Tailwind · Vercel
- 内容架构
- 设计
- 开发
- SEO
- 合规
Kayzen Web自主开发的产品，在启用正式域名之前，暂以Vercel预览地址提供服务。
- Lighthouse SEO 得分
- 100/100
- 阅读行宽
- 68 字符
- 疗效承诺
- 0
需要解决的问题。
背景
Nutriéa 是一个法语自然疗法与营养疗法内容门户：断食、调理疗程、植物、维生素、调理方案。其商业模式完全依赖自然搜索获客。
限制
健康领域是 Google 审查最严格的领域：E-E-A-T 标准在这里被毫不留情地执行，来源不可靠的内容无法获得排名。此外还有一项法律约束——非医疗网站不得诊断、不得开具处方，也不得承诺治愈。
对策
在写下第一行内容之前，就先设计好内容架构：全面详尽的支柱页面，从属于它们的卫星文章，以及体现这一层级关系的内链结构。每一项论断都指向其来源；在每个调理方案页面上，都有一段结合上下文的提示——而不是千篇一律的横幅——提醒读者其适用界限。
交付时测得的评分。
以下为线上网站的Lighthouse评分。我们如实公布：若某项分数偏低，其原因与改进计划会在下文写明，而不是避而不谈。
每一个设计取舍，及其理由。
为长篇阅读而设计
行宽 68 个字符，行高 1.65，基础字号 18 px。文章长达三千词：在这里，字体排印就是设计工作的核心。
锚点目录与阅读进度
吸附式目录，并高亮当前所在章节。在长篇指南中，知道自己读到哪里，比面包屑导航更有用。
提示融入正文，绝不边缘化
提示语就写在正文中描述调理方案的地方。放在页脚的横幅，在法律上更站不住脚，在编辑上也更不诚实。
项目配色
深绿
#2F5D50
标题、品牌识别
鼠尾草绿
#A8C0A0
区块背景
墨色
#22252A
正文
陶土色
#C97B4A
强调色、注意事项
字体系统
标题字体
Fraunces
正文字体
Source Sans 3
标题采用当代衬线字体——自然而不落俗套——一篇指南的三千词正文则使用专为屏幕打造的无衬线字体。
幕后的技术实现。
- Next.js
- React
- Tailwind
- Vercel
静态生成
每篇文章都是一个由 CDN 分发的 HTML 文件。对于内容很少变动的内容型网站来说，这是性价比最高的方案，还消除了应用层的全部攻击面。
AVIF 图片，WebP 兜底
指南配有丰富的插图。在浏览器支持时以 AVIF 格式提供同一张图片，可节省 30% 到 50% 的体积，且肉眼察觉不到画质损失。
网站如何被搜索到。
支柱与卫星
每个大主题（断食、植物、维生素）一个支柱页面，卫星文章各自解答一个具体问题并链接回支柱页面。建立主题权威的是这种结构——而不是数量。
作者、日期与来源清晰可见
每篇文章都有署名、发布日期、更新日期和参考文献，外加完整的 Article 结构化标记。在健康类主题上，这些元素不是装饰：它们直接决定排名。
长尾搜索
“Combien de temps jeûner sans risque”（安全断食能持续多久）、“quelle vitamine D en hiver”（冬天该补哪种维生素 D）：这些是真实的问题，按用户提问的方式表述——也正是 AI 助手引用的方式。
交付了哪些内容。
- 首页
- 支柱页面——断食、调理疗程、植物、维生素
- 卫星文章
- 术语表
- 关于我们与参考来源
项目的推进过程。
内容架构
主题图谱、支柱、卫星、内链。
阅读设计
字体排印、行宽、目录、阅读进度。
内容生产
有据可查的写作、审校、结合上下文的提示。
技术 SEO
Article 结构化标记、站点地图、Search Console。
