网页入门 · 专题 05
网页设计与调试实验室
词汇站重构与错误复现。学会用证据向 AI 描述问题，而不是只说‘它坏了’。
作品工作台：词汇站重构与错误复现
选择一个模拟 bug，查看复现步骤并运行修复后的测试。 这是一个可直接操作的离线小作品，用来验证提示词和代码修改。
先操作作品，再把结果写进测试表。
等待测试结果
提示词版本对比
把我的网站做得更漂亮。
请从信息层级、可访问性和移动端三方面提出重构方案，先列测试清单。
只重构卡片布局，保留数据与计分逻辑，列出改动点和可能副作用。
这是复现步骤、期望、实际和错误信息，请定位最可能原因并给最小补丁。
每个独立作品都应打开后实际操作，再把输出差异和验证证据写进学习档案。
学习大纲
- 信息层级、控制台报错、最小复现、回归测试
- 学会用证据向 AI 描述问题，而不是只说‘它坏了’。
- 完成：选择一个模拟 bug，查看复现步骤并运行修复后的测试。
学习过程
- 观察基线问题
- 写最小复现
- 尝试结构化提示词
- 修复一个 bug
- 回归测试并比较版本
实验与反思
- 同一需求用简短、结构化、带示例提示词，返工次数有什么不同？
- 你怎样证明修复没有破坏其他功能？
反思出口卡
哪个提示词改动最有效？AI 哪一点需要验证？你自己新增了什么规则？下一次只改一个变量，你会选什么？