6 步工作流
从零开发一个小型网站
规划需求、生成代码、测试并谨慎发布。
工作流进度
完成一步就勾选一步，进度只保存在当前浏览器。
步骤 1
写功能简报
为什么使用
AI 可以把模糊想法变成明确需求。
提示词
把这个网站想法整理成一页简报，包含页面、数据、SEO 和隐私需求。
输入示例
一个本地服务落地页
输出示例
实现简报
注意事项
首个版本要控制范围，区分必需功能和后续想法。
设计页面与内容结构
为什么使用
编码前先确定信息层级，可以减少返工。
提示词
根据简报设计移动端优先的页面结构，包含标题、行动按钮、信任内容、导航、空状态和错误状态。
输入示例
已确认的实现简报
输出示例
按页面整理的内容与组件结构。
注意事项
设计中不要使用虚假评价、计数、客户标志或紧迫性文案。
开发可访问的前端
为什么使用
能理解代码仓库的编程工具适合分批实现并保持改动可审查。
提示词
使用现有技术栈和设计变量实现页面。保留语义化 HTML、键盘操作、响应式布局和减少动态效果支持。
输入示例
代码仓库、组件结构和验收标准
输出示例
可在本地运行、便于审查的组件和页面。
注意事项
生成代码必须人工审查，密钥绝不能进入浏览器代码包。
补全元数据、隐私与错误状态
为什么使用
可正式发布的网站不能只有正常流程页面。
提示词
审查网站的标题、描述、规范网址、社交元数据、robots、站点地图、隐私说明、表单错误、空状态和 404。
输入示例
可运行的本地网站
输出示例
已完成修复的上线检查表。
注意事项
隐私和安全说明只能陈述实现中真实存在的能力。
步骤 5
测试核心流程
为什么使用
自动化与人工检查可以发现不同浏览器和屏幕尺寸下的回归。
提示词
为导航、表单、键盘操作、移动端布局、元数据和主要转化流程编写重点测试，部署前修复失败项。
输入示例
验收标准和可运行网站
输出示例
通过的自动检查和简短人工验收记录。
注意事项
构建成功不等于用户流程可用，必须实际操作验证。
步骤 6
部署并验证线上环境
为什么使用
正式域名、重定向、环境变量和缓存可能与本地不同。
提示词
准备部署检查表，覆盖环境变量、自定义域名、HTTPS、重定向、robots、站点地图、统计隐私、回滚和上线冒烟测试。
输入示例
通过测试的构建和托管配置
输出示例
已验证的线上部署和回滚说明。
注意事项
部署后必须检查真实域名，并保留可回滚的稳定产物。