67 lines
1.7 KiB
Markdown
67 lines
1.7 KiB
Markdown
# 相宜亲家官方网站
|
||
|
||
纯静态官方网站，无需后端接口。
|
||
|
||
## 目录结构
|
||
|
||
```
|
||
website/
|
||
├── index.html # 主页面
|
||
├── css/
|
||
│ └── style.css # 样式文件
|
||
├── js/
|
||
│ └── main.js # 交互脚本
|
||
├── images/ # 图片资源
|
||
│ ├── logo.png # 网站Logo
|
||
│ ├── favicon.ico # 网站图标
|
||
│ ├── family.png # Hero区域家庭图片
|
||
│ ├── phone-mockup.png # 手机界面截图
|
||
│ ├── icon-*.png # 特性图标
|
||
│ └── case*.jpg # 成功案例图片
|
||
└── README.md
|
||
```
|
||
|
||
## 需要准备的图片
|
||
|
||
1. **logo.png** - 网站Logo（建议尺寸：200x50px）
|
||
2. **favicon.ico** - 网站图标（16x16 或 32x32）
|
||
3. **family.png** - Hero区域的幸福家庭图片（建议尺寸：500x400px）
|
||
4. **phone-mockup.png** - 小程序手机界面截图（建议尺寸：350x700px）
|
||
5. **icon-target.png** - 精准匹配图标（建议尺寸：64x64px）
|
||
6. **icon-flow.png** - 流程顺畅图标
|
||
7. **icon-chat.png** - 沟通无阻图标
|
||
8. **icon-value.png** - 性价比图标
|
||
9. **case1.jpg ~ case6.jpg** - 成功案例婚纱照（建议尺寸：400x300px）
|
||
|
||
## 本地预览
|
||
|
||
直接用浏览器打开 `index.html` 即可预览。
|
||
|
||
或使用本地服务器：
|
||
|
||
```bash
|
||
# 使用 Python
|
||
python -m http.server 8080
|
||
|
||
# 使用 Node.js
|
||
npx serve .
|
||
```
|
||
|
||
## 部署
|
||
|
||
将整个 `website` 目录上传到任意静态托管服务即可：
|
||
|
||
- 阿里云 OSS
|
||
- 腾讯云 COS
|
||
- Nginx 静态服务
|
||
- GitHub Pages
|
||
- Vercel
|
||
- Netlify
|
||
|
||
## 页面内容
|
||
|
||
1. **首页 Hero** - 品牌口号 + 家庭图片
|
||
2. **产品特点** - 四大核心优势
|
||
3. **成功案例** - 6个脱单案例展示
|
||
4. **页脚** - 公司信息和备案号
|