277 lines
8.1 KiB
Markdown
277 lines
8.1 KiB
Markdown
# 阿美巴AI官网 第二期 前端展示层+SEO+知识网络渲染 交付回执
|
||
|
||
项目编号：阿美巴AI官网-20260908-02
|
||
前置依赖：第一期 MVP-BASE 底座已完成并验收通过
|
||
产品真相源：《阿美巴AI官网｜项目总指令 V1.2 FINAL（产品冻结版）》
|
||
交付日期：2026年9月8日
|
||
|
||
## 一、页面与路由清单
|
||
|
||
### 1. 首页
|
||
- **路由**: `/`
|
||
- **标题**: 阿美巴AI - AI时代企业进化平台
|
||
- **说明**: 全站最高浓度的阿美巴认知页面，包含企业进化知识体系概览
|
||
|
||
### 2. 阿美巴板块
|
||
- **路由**: `/about`
|
||
- **标题**: 阿美巴是谁
|
||
- **说明**: 展示阿美巴的定位、使命、服务对象与发展历程
|
||
|
||
### 3. 企业进化板块
|
||
- **路由**: `/evolution`
|
||
- **标题**: 企业进化
|
||
- **说明**: 企业进化的定义、方法与路径
|
||
|
||
- **路由**: `/evolution/method`
|
||
- **标题**: 进化方法
|
||
- **说明**: 以终为始、目标先于问题、现状分析、差距识别、根因分析、路径规划、实施迭代
|
||
|
||
### 4. 四大价值板块
|
||
- **路由**: `/value`
|
||
- **标题**: 四大价值
|
||
- **说明**: 价值创造、价值传递、价值交付、价值支持总览
|
||
|
||
- **路由**: `/value/creation`
|
||
- **标题**: 价值创造
|
||
- **说明**: 企业如何创造价值，包含官方定义、核心逻辑、企业常见问题等
|
||
|
||
- **路由**: `/value/transfer`
|
||
- **标题**: 价值传递
|
||
- **说明**: 企业如何将价值传递给客户
|
||
|
||
- **路由**: `/value/delivery`
|
||
- **标题**: 价值交付
|
||
- **说明**: 企业如何交付价值
|
||
|
||
- **路由**: `/value/support`
|
||
- **标题**: 价值支持
|
||
- **说明**: 企业如何支持价值创造与交付
|
||
|
||
### 5. A/M-B板块
|
||
- **路由**: `/amb`
|
||
- **标题**: A/M-B总览
|
||
- **说明**: 企业进化阶段模型，明确三态是阶段模型不是产品套餐
|
||
|
||
- **路由**: `/amb/a`
|
||
- **标题**: A态·入态
|
||
- **说明**: 企业进入AI时代的初始状态，包含定义、特征、任务、目标等
|
||
|
||
- **路由**: `/amb/m`
|
||
- **标题**: M态·优态
|
||
- **说明**: 企业优化运营、提升效率的阶段
|
||
|
||
- **路由**: `/amb/b`
|
||
- **标题**: B态·越态
|
||
- **说明**: 企业实现跨越式发展的阶段
|
||
|
||
### 6. 企业进化能力板块
|
||
- **路由**: `/capabilities`
|
||
- **标题**: 能力地图
|
||
- **说明**: 展示企业进化的完整能力体系，能力是底层实体不是产品套餐
|
||
|
||
### 7. 案例板块
|
||
- **路由**: `/cases`
|
||
- **标题**: 案例列表
|
||
- **说明**: 企业进化实践案例列表
|
||
|
||
### 8. 知识中心板块
|
||
- **路由**: `/knowledge`
|
||
- **标题**: 知识中心
|
||
- **说明**: 企业进化的知识体系与方法论，包含12个分类
|
||
|
||
### 9. 概念板块
|
||
- **路由**: `/concepts`
|
||
- **标题**: 概念
|
||
- **说明**: 企业进化的知识实体概念列表
|
||
|
||
### 10. FAQ板块
|
||
- **路由**: `/faq`
|
||
- **标题**: FAQ
|
||
- **说明**: 常见问题解答，链接到对应知识实体页面
|
||
|
||
### 11. 企业需求与能力匹配板块
|
||
- **路由**: `/match`
|
||
- **标题**: 企业需求与能力匹配
|
||
- **说明**: 匹配知识结构静态展示页，不做在线诊断工具
|
||
|
||
### 12. 联系我们
|
||
- **路由**: `/contact`
|
||
- **标题**: 联系我们
|
||
- **说明**: 联系方式、服务时间、合作方式
|
||
|
||
## 二、SEO实现清单
|
||
|
||
### 1. 语义化HTML
|
||
- ✅ 每页唯一H1标签
|
||
- ✅ H1/H2/H3层级规范
|
||
- ✅ 每页唯一主题
|
||
|
||
### 2. Meta标签
|
||
- ✅ title标签（使用模板：`%s | 阿美巴AI官网`）
|
||
- ✅ description标签
|
||
- ✅ canonical标签
|
||
- ✅ Open Graph标签（og:title、og:description、og:image、og:type、og:url）
|
||
- ✅ Twitter Card标签
|
||
|
||
### 3. 面包屑导航
|
||
- ✅ 每个页面实现面包屑导航
|
||
- ✅ 使用BreadcrumbList Schema标记
|
||
|
||
### 4. 结构化数据
|
||
- ✅ 组织页输出 Organization Schema
|
||
- ✅ 文章页输出 Article Schema
|
||
- ✅ FAQ页输出 FAQPage Schema
|
||
- ✅ 全站页面输出 BreadcrumbList Schema
|
||
- ✅ 网站搜索输出 SearchAction Schema
|
||
|
||
### 5. Sitemap与Robots
|
||
- ✅ 生成 sitemap.xml（静态页面+动态页面）
|
||
- ✅ 生成 robots.txt
|
||
|
||
### 6. 友好URL
|
||
- ✅ 使用语义清晰的slug
|
||
- ✅ 不暴露内部ID
|
||
|
||
## 三、内部语义链接实现说明
|
||
|
||
### 1. 首页链接
|
||
- 链接到所有主要板块页面
|
||
- 展示企业进化知识体系概览
|
||
|
||
### 2. 阿美巴页面
|
||
- 链接到企业进化、四大价值、A/M-B
|
||
|
||
### 3. 企业进化页面
|
||
- 链接到进化方法、四大价值、A/M-B、企业进化能力
|
||
|
||
### 4. 四大价值页面
|
||
- 相互链接（价值创造、价值传递、价值交付、价值支持）
|
||
- 链接到企业进化、能力地图、案例
|
||
|
||
### 5. A/M-B页面
|
||
- 相互链接（A态、M态、B态）
|
||
- 链接到企业进化、能力地图
|
||
|
||
### 6. 能力地图页面
|
||
- 链接到企业进化、四大价值、A/M-B、案例
|
||
|
||
### 7. 案例页面
|
||
- 链接到企业进化、四大价值、能力地图
|
||
|
||
### 8. 知识中心页面
|
||
- 链接到企业进化、四大价值、概念、FAQ
|
||
|
||
### 9. 概念页面
|
||
- 链接到知识中心、企业进化、四大价值
|
||
|
||
### 10. FAQ页面
|
||
- 链接到知识中心、概念、企业进化
|
||
|
||
### 11. 匹配页面
|
||
- 链接到能力地图、企业进化、A/M-B、案例
|
||
|
||
### 12. 联系我们页面
|
||
- 链接到能力地图、企业进化、四大价值
|
||
|
||
## 四、单元测试/冒烟测试要点清单
|
||
|
||
### 1. 页面可访问性测试
|
||
- ✅ 所有页面路由可正常访问
|
||
- ✅ 页面返回200状态码
|
||
- ✅ 页面内容正确渲染
|
||
|
||
### 2. SEO测试
|
||
- ✅ 每页H1唯一
|
||
- ✅ title标签正确
|
||
- ✅ description标签正确
|
||
- ✅ canonical标签正确
|
||
- ✅ Open Graph标签正确
|
||
- ✅ 面包屑导航正确
|
||
- ✅ 结构化数据合法
|
||
|
||
### 3. 内容测试
|
||
- ✅ 非published内容不可见
|
||
- ✅ 内容正确渲染
|
||
- ✅ 内部链接正确
|
||
|
||
### 4. 视觉测试
|
||
- ✅ 简洁专业的视觉风格
|
||
- ✅ 无浮夸科技元素
|
||
- ✅ 响应式设计正常
|
||
|
||
## 五、风险备注
|
||
|
||
### 1. 技术实现与产品文档冲突点
|
||
|
||
#### 冲突点1：动态内容渲染
|
||
- **产品文档要求**：核心内容禁止依赖纯JS渲染，必须服务端渲染（SSR）或静态生成（SSG）
|
||
- **技术实现**：使用Next.js实现SSR/SSG，所有页面在服务端渲染
|
||
- **妥协方案**：完全符合产品文档要求
|
||
|
||
#### 冲突点2：CMS数据集成
|
||
- **产品文档要求**：全部页面数据通过一期公开输出接口获取
|
||
- **技术实现**：已实现API服务层，但需要后端服务运行才能获取数据
|
||
- **妥协方案**：页面支持空数据状态显示，提示"内容正在完善中"
|
||
|
||
#### 冲突点3：视觉风格
|
||
- **产品文档要求**：禁止浮夸科技风格，禁用机器人元素、粒子、科技蓝等
|
||
- **技术实现**：采用简洁专业的视觉风格，使用深灰色系，避免科技感元素
|
||
- **妥协方案**：完全符合产品文档要求
|
||
|
||
### 2. 待确认事项
|
||
|
||
1. **后端API地址**：需要确认生产环境的后端API地址
|
||
2. **域名配置**：需要确认域名和SSL证书配置
|
||
3. **图片资源**：需要确认logo、OG图片等资源
|
||
4. **联系方式**：需要确认具体的联系方式信息
|
||
|
||
## 六、运行说明
|
||
|
||
### 1. 本地启动命令
|
||
```bash
|
||
# 进入前端目录
|
||
cd frontend
|
||
|
||
# 安装依赖
|
||
npm install
|
||
|
||
# 启动开发服务器
|
||
npm run dev
|
||
|
||
# 构建生产版本
|
||
npm run build
|
||
|
||
# 启动生产服务器
|
||
npm start
|
||
```
|
||
|
||
### 2. 环境变量配置
|
||
- `NEXT_PUBLIC_SITE_URL`: 网站URL（默认：https://ameiba.com）
|
||
- `API_URL`: 后端API地址（默认：http://localhost:24731）
|
||
|
||
### 3. 部署到阿里云ECS
|
||
1. 上传项目文件到服务器
|
||
2. 安装Node.js环境（>=18.x）
|
||
3. 进入前端目录执行`npm install`
|
||
4. 执行`npm run build`构建生产版本
|
||
5. 使用PM2或systemd管理进程
|
||
6. 配置Nginx反向代理
|
||
7. 配置SSL证书（可选）
|
||
|
||
### 4. 与后端服务集成
|
||
1. 确保后端服务已启动并运行
|
||
2. 配置`API_URL`环境变量指向后端服务地址
|
||
3. 确保后端服务允许跨域请求
|
||
|
||
## 七、总结
|
||
|
||
本项目已完成第二期前端展示层+SEO+知识网络渲染的开发，包括：
|
||
1. ✅ 12个核心页面与路由
|
||
2. ✅ 全站SEO能力（title/description/canonical/OG/面包屑/Schema/sitemap/robots）
|
||
3. ✅ 内部语义链接渲染
|
||
4. ✅ 结构化数据自动生成
|
||
5. ✅ 简洁专业的视觉风格
|
||
6. ✅ 服务端渲染（SSR/SSG）
|
||
|
||
所有功能均符合产品文档V1.2 FINAL的要求，未越界开发第三期功能，未预埋禁止功能。项目可正常本地运行、可部署阿里云ECS。
|