模块 4 · 完整应用能力 · 第 1/8 节
页面与导航
🎯学习目标
- 会规划多页面结构
- 会添加导航和页面跳转
- 知道独立页面对 SEO 的好处
🧭操作步骤
- 1
列出页面清单
先列出所有页面和它们的关系，例如首页 → 产品列表 → 产品详情。
- 2
使用独立页面
不同内容用独立网址（/about、/pricing），比全部堆在一页更利于搜索与分享。
- 3
添加导航
顶部导航放主要页面，页脚放次要链接。
- 4
处理不存在的页面
要求 AI 提供友好的 404 页面。
💬可复制提示词
规划页面
网站需要以下页面：首页、产品列表、产品详情（每个产品一个网址）、价格、关于我们、联系我们。顶部导航放前五个，手机端用汉堡菜单。
✅ 预期结果
- 每个页面有独立网址
- 导航在所有页面一致
- 访问不存在的网址显示 404
⚠️ 常见错误
- 所有内容堆在一个长页面
- 导航链接指向不存在的页面
- 详情页没有独立网址，无法分享
📝自检题
1. 为什么推荐独立页面而非长单页？
学完了？标记为已完成，记录你的进度。