# 网站项目总控 -- 从需求到上线的建站交付流程

面向企业官网、营销落地页、CMS 网站、后台管理站点、内容门户和中小型 Web 应用，提供从项目启动、需求规格、站点规划、设计实现到上线运维的完整项目级总控流程。

> 本 Skill 不替代 `task-decomposition-and-execution`，而是在拆解前定义网站项目必须覆盖的阶段和验收项；随后调用 `task-decomposition-and-execution` 将阶段转为 Wave 任务。

## 输入要求

1. **网站类型**（必填）：企业官网/营销页/CMS站点/后台管理/门户/电商/工具站
2. **业务目标**（必填）：展示品牌、获客转化、内容发布、会员服务、数据管理等
3. **目标用户**（必填）：访客、客户、运营、管理员、销售、编辑等
4. **技术约束**（可选）：CMS/PHP版本/前端框架/服务器/数据库/第三方服务
5. **上线要求**（可选）：域名、备案、SSL、上线时间、迁移范围、回滚要求

## 执行流程

### 第一步：项目启动与范围确认

- **填充项目启动模板**：按主 SKILL.md「项目启动模板」章节填写项目启动信息（含终极功能、循环轮次、改动点数），作为后续 Wave 拆解和轮次控制基准
- 明确网站目标、成功标准、上线时间和交付边界
- 判断是否为 CMS 二次开发、静态站、前后端分离或后台管理系统
- 确认角色分工：业务方、设计、前端、后端、测试、运维、验收人
- 明确不做什么，避免范围扩散

```
✓ 项目启动信息:
- 网站类型: [类型]
- 业务目标: [目标]
- 成功标准: [可验证标准]
- In scope: [范围]
- Out of scope: [不做内容]
```

### 第二步：需求规格与站点规划

调用 `spec-driven-development` 输出行为契约，并补充网站特有规划：

- 站点地图：栏目、页面类型、层级、URL 结构
- 页面清单：首页、列表页、详情页、表单页、搜索页、登录页、后台页
- 用户路径：访问入口、核心转化路径、异常路径
- 内容模型：栏目、文章、产品、案例、下载、表单、配置项
- 权限模型：游客、会员、编辑、管理员、超级管理员

### 第三步：内容与 SEO 策略

- 明确每类页面的 TDK：Title / Description / Keywords
- 规划 `sitemap.xml`、`robots.txt`、canonical、面包屑
- 图片命名、alt、尺寸比例、压缩策略
- 结构化数据：Organization / Article / Product / Breadcrumb 等
- 内容验收：文案、图片、栏目数据、测试数据、正式数据

### 第四步：前端设计与交互方案

调用 `frontend-design` 完成：

- 信息架构和页面区块
- 视觉 token、组件规范、响应式断点
- Loading / Empty / Error / Disabled 等状态
- 表单校验、防重复提交、二次确认
- 浏览器验证清单

### 第五步：技术方案与数据/API设计

按项目类型调用对应子技能：

- CMS 项目：调用 `cms-development`，确认 CMS、PHP 版本、表前缀、模板变量和插件规范
- 接口项目：调用 `api-design`，定义认证、接口、错误码、分页和权限
- 数据库变更：调用 `mysql-database`，明确表结构、索引、迁移、备份和回滚
- 前后端联调：确认接口字段、空值、错误态和权限态
- 长任务识别：批量导入/导出、生成静态页、重建索引、采集同步、图片压缩等必须采用 `Init → Step → Poll` AJAX 渐进式防卡死架构

### 第六步：任务拆解与 Wave 执行

调用 `task-decomposition-and-execution`，按以下阶段拆成可验证 Wave：

| Wave | 内容 | 验证 |
| - | - | - |
| Wave 1 | 项目结构、环境、基础配置 | 能启动/能访问 |
| Wave 2 | 数据模型、CMS字段/API接口 | 数据读写正确 |
| Wave 3 | 页面模板/前端组件 | 页面渲染正确 |
| Wave 4 | 交互、表单、权限、后台 | 业务路径可走通 |
| Wave 5 | SEO、性能、安全、兼容、长任务防卡死 | 检查清单通过 |
| Wave 6 | 部署、验收、交接 | 上线可回滚 |

**轮次控制承接**（引用主 SKILL.md「项目启动模板」和「轮次与收敛」章节）：

- 第一步填充的项目启动模板中「循环轮次」和「每轮改动点数」字段，在本步 Wave 拆解时落地执行
- 默认轮次 3 轮，安全最大轮次 6 轮，每轮改动点不超过 3 处
- 每轮结束时按主 SKILL.md「收敛判定逻辑」判断是否结束（终极功能完成/默认轮次到达/安全最大轮次/连续2轮P2微调）
- 超过安全最大轮次必须强制结束并输出未完成清单，不得无限循环

### 第七步：测试、安全与兼容验证

- 功能测试：核心路径、异常路径、权限路径
- 浏览器测试：移动/平板/桌面，主流浏览器
- 安全检查：SQL注入、XSS、CSRF、文件上传、权限绕过
- CMS 检查：模板缓存、静态资源路径、后台字段、数据备份
- PHP/CMS 检查：目标 PHP 版本 lint，错误日志无新增致命错误
- 长任务检查：Init 创建任务、Step 分批处理、Poll 轮询状态，验证进度、错误、重试/取消和防重复提交

### 第八步：性能优化与上线准备

- 图片压缩、懒加载、WebP/AVIF 策略
- CSS/JS 压缩、缓存策略、CDN、静态资源版本号
- Core Web Vitals：LCP/CLS/INP 基线
- 数据库慢查询、索引、分页、缓存
- 上线清单：域名、SSL、备案、环境变量、定时任务、文件权限
- 回滚方案：代码回滚、数据库备份、配置备份

### 第八点五步：构建与发布流水线（CI/CD）

> 网站项目同样必须覆盖构建、发布和回滚流水线要点，与 `software-project.md` 的 CI/CD 章节对齐。

#### 流水线阶段

| 阶段 | 输入 | 输出 | 验证 |
| - | - | - | - |
| 构建 | 源码、依赖锁文件、构建配置 | 静态资源包/CMS 模板包 | 构建成功且产物校验通过 |
| 测试 | 产物 + 测试套件 | 测试报告（通过率/覆盖率） | 单元+集成+端到端测试通过 |
| 静态检查 | 源码 | lint/类型检查/安全扫描报告 | 无阻塞级问题 |
| 部署 | 产物 + 环境配置 | 线上版本 | 健康检查通过，旧版本可回退 |
| 验证 | 线上环境 | 烟雾测试结果 | 关键页面可达，错误率低于阈值 |
| 回滚 | 上一稳定版本 | 线上版本回退 | 健康检查通过 |

#### 强制要求

- **依赖锁定**：构建必须基于 `composer.lock` / `package-lock.json` / `pnpm-lock.yaml` 等锁文件，禁止使用 `latest` / `*` / `dev-main`
- **环境隔离**：构建、测试、生产环境配置必须分离，敏感配置通过环境变量注入，不写入代码库
- **产物可追溯**：每次构建产物必须关联 commit、构建时间、构建号、依赖版本
- **发布可回滚**：每次发布必须保留前一稳定版本，并能在 5 分钟内回退
- **健康检查**：部署后必须执行烟雾测试，验证首页、登录、表单、搜索、后台等关键路径可达
- **变更窗口**：业务高峰期禁止发布，DDL/数据库迁移单独走审核流程

#### 失败回退

| 失败场景 | 回退动作 |
| - | - |
| 构建失败 | 不进入测试；修复依赖或构建配置后重试 |
| 测试失败 | 不进入部署；标注失败用例并修复 |
| 部署后健康检查失败 | 立即触发自动回滚到上一稳定版本 |
| 回滚后仍失败 | 切换到应急流程，通知负责人，保留现场日志 |

### 第九步：部署上线与验收交接

- 部署到目标环境，记录发布版本和变更文件
- 执行上线冒烟测试：访问、登录、表单、搜索、后台、核心页面
- 接入统计和监控：PV/UV、表单转化、错误日志、访问日志
- 交付材料：后台账号、操作手册、部署说明、回滚说明、源码路径
- 用户验收：验收人、验收时间、验收结论、遗留问题

### 第十步：运维沉淀与项目记忆

调用 `project-memory-management` 记录：

- 技术栈、CMS版本、PHP版本、服务器、数据库、部署路径
- 站点地图、内容模型、模板变量、组件规范
- 上线记录、回滚方案、账号交接、备份策略
- 已知限制、后续优化、运维巡检清单

## 输出格式

```markdown
## 网站项目交付方案

### 1. 项目启动

- **网站类型**: [类型]
- **业务目标**: [目标]
- **成功标准**: [标准]
- **上线要求**: [时间/域名/环境]

### 2. 站点地图

| 页面/栏目 | URL | 内容模型 | 权限 | SEO要求 |
| --------- | --- | --------------- | ---- | -------------- |
| 首页 | / | 配置项/推荐内容 | 公开 | TDK/结构化数据 |

### 3. 页面与功能清单

| 模块 | 页面/功能 | 优先级 | 验收标准 |
| ------ | --------- | -------- | ------------ |
| [模块] | [功能] | P0/P1/P2 | [可验证标准] |

### 4. 技术方案

| 层级 | 方案 | 说明 |
| -------- | ----------- | ------ |
| 前端 | [技术/模板] | [说明] |
| CMS/后端 | [技术] | [说明] |
| 数据库 | [技术] | [说明] |
| 部署 | [环境] | [说明] |

### 5. Wave执行计划

| Wave | 任务 | 依赖 | 验证 |
| ------ | ------ | ---- | ------------- |
| Wave 1 | [任务] | 无 | [命令/检查项] |

### 6. 上线检查

| 检查项 | 状态 | 证据 |
| ------------ | ----------- | ------------------------ |
| 域名/SSL | 通过/未通过 | [证据] |
| SEO基础 | 通过/未通过 | [证据] |
| 性能 | 通过/未通过 | [证据] |
| 长任务防卡死 | 通过/未通过 | [Init/Step/Poll验证证据] |
| 安全 | 通过/未通过 | [证据] |
| 备份/回滚 | 通过/未通过 | [证据] |

### 7. 交付材料

- 后台账号:
- 操作手册:
- 部署说明:
- 回滚说明:
- 已知限制:
```

## 质量标准

- 必须先定义网站类型、业务目标和成功标准，再拆任务
- 必须包含站点地图、页面清单、内容模型和权限模型
- 必须包含前端设计、CMS/API/数据方案、测试、安全、SEO、性能、部署、验收、运维
- 涉及批量处理、静态生成、采集同步、导入导出等长任务时，必须包含 Init → Step → Poll 防卡死设计
- 每个 Wave 必须有验证方法，不能只写“完成开发”
- 上线前必须有备份和回滚方案
- 交付必须包含后台账号、操作说明、部署说明和已知限制
- 无验证证据不得标记为完成

## 失败回退机制

| 步骤 | 失败条件 | 回退目标 | 最大重试 | 不可恢复时升级路径 |
| - | - | - | - | - |
| 第一步：项目启动与范围确认 | 目标或范围不清 | 输出范围澄清清单 | 2 | 等待业务方确认 |
| 第二步：需求规格与站点规划 | 页面/栏目不完整 | 生成最小站点地图草案 | 1 | 要求用户补充栏目和页面 |
| 第三步：内容与 SEO 策略 | 文案素材缺失 | 用内容占位清单替代正式内容 | 1 | 标注素材阻塞 |
| 第四步：前端设计与交互方案 | 无品牌规范 | 使用中性设计 token | 1 | 要求提供参考站/品牌色 |
| 第五步：技术方案与数据/API设计 | CMS/技术栈不确定 | 进入技术选型或CMS探测 | 1 | 输出选型矩阵由用户决策 |
| 第六步：任务拆解与 Wave 执行 | 任务依赖复杂 | 调用任务拆解按模块重组 Wave | 2 | 输出依赖图并拆分阶段 |
| 第七步：测试、安全与兼容验证 | 环境不可用 | 输出手动验证清单 | 1 | 标注未实测项 |
| 第八步：性能优化与上线准备 | 生产环境信息缺失 | 输出上线前置条件清单 | 1 | 等待运维/用户补充 |
| 第九步：部署上线与验收交接 | 无上线权限 | 输出部署包和部署步骤 | 1 | 由有权限人员执行 |
| 第十步：运维沉淀与项目记忆 | 项目记忆不可用 | 输出交付记录到本地文件 | 1 | 标注未沉淀 |

## 关联 reference

- **software-project**（软件项目总控）— 若项目不属于网站/CMS/营销页范畴（如 API 服务、CLI 工具、后台模块、数据脚本），转入 `software-project.md` 总控
- **spec-driven-development**（Spec驱动开发）— 生成需求规格、Scenario 和验收标准
- **task-decomposition-and-execution**（任务拆解与执行）— 将网站阶段拆成 Wave 并逐步验证
- **frontend-design**（前端设计）— 输出 UI/UX、响应式、交互状态和浏览器验证方案
- **cms-development**（CMS二次开发）— 处理 PHP+MySQL CMS、模板、插件、数据库和安全规范
- **mysql-database**（MySQL数据库）— 处理表结构、索引、SQL安全、慢查询、迁移回滚和数据安全
- **api-design**（API设计）— 设计接口、认证、错误码和分页规范
- **code-generation**（代码生成）— 生成页面、组件、接口和业务代码
- **code-review**（代码审查）— 审查安全、性能、可维护性和规范符合性
- **test-generation**（测试用例生成）— 生成单元、集成、端到端和回归测试
- **doc-generation**（文档生成）— 生成 README、部署说明、操作手册和交付文档
- **project-memory-management**（项目记忆管理）— 沉淀站点配置、部署路径、运维和交付信息