《网页设计与制作》期末实作题：电子商务网站设计与制作
一、项目背景与要求
请设计并制作一个电子商务或企业网站，要求包含以下内容：
1. 虚拟公司/品牌名称与定位（自拟）
2. 完整的网站结构：首页、列表页、内容页、沟通交流页
3. 必要的视觉元素：Logo、首页Banner、统一的配色方案与视觉风格
4. 响应式设计，适配不同设备
5. 良好的用户体验与交互设计
二、具体任务
1. 品牌与内容创建
· 虚拟一个公司或品牌名称（例如：绿意生活家居、极简科技、悦读书店等）
· 确定品牌定位、目标用户和主要产品/服务
· 设计品牌Logo（可使用设计工具或代码绘制）
· 准备至少6个虚拟产品（含产品名称、描述、价格、图片）
2. 页面要求
(1) 首页
· 网站头部：包含Logo、主导航菜单（首页、产品、关于我们、联系我们）
· 首页Banner：至少包含一张轮播图或静态Banner，突出品牌特色
· 产品/服务展示区：展示部分精选产品
· 公司/品牌介绍区域
· 页脚：版权信息、联系方式、社交媒体链接等
(2) 列表页（产品列表页）
· 产品分类/筛选功能
· 产品卡片列表展示（图片、名称、价格、简短描述）
· 分页功能或"加载更多"按钮
· 排序功能（按价格、人气等）
(3) 内容页（产品详细页）
· 产品主图展示（可考虑多图切换）
· 产品详细信息（名称、价格、详细描述、规格参数等）
· 购买/加入购物车按钮
· 相关产品推荐
(4) 沟通交流页
· 联系表单（包含：姓名、邮箱、电话、咨询类型、留言内容）
· 表单验证（前端验证）
· 公司联系信息（地址、电话、邮箱）
· 嵌入地图或地图链接
3. 技术要求
· 使用HTML5、CSS3和JavaScript实现
· 至少使用一种CSS框架（如Bootstrap）或纯CSS实现
· 实现简单的交互效果（如轮播图、表单验证、产品筛选等）
· 代码结构清晰，有适当的注释
三、评分标准
评分项目 占比 具体要求
设计创意与视觉效果 25% Logo设计、配色方案、整体视觉吸引力、Banner设计
页面完整性与结构 25% 四个页面的完整实现、导航结构清晰、内容组织合理
交互与功能实现 25% 导航功能、表单验证、产品筛选/排序、响应式设计
代码质量与规范 15% 代码结构清晰、注释完整、符合Web标准
用户体验 10% 易用性、一致性、加载性能
四、提交要求
1. 完整的项目代码文件
2. 设计说明文档（包括：品牌定位、设计理念、技术实现说明）
3. 在主流浏览器中的运行截图（至少Chrome、Firefox）
4. 如使用外部资源（如图片、图标库），请注明来源
5.所有内容打包为一个rar或zip文件，以学号+姓名为文件名，发邮件到 zsp@ctbu.edu.cn
6.联系方式:13452822734微信
五、完成时间
考试时间：3小时
---
六、示例参考（虚拟公司）
公司名称：绿植之家 PlantHome
品牌定位：专注于室内绿植销售与养护知识分享，为都市人群提供绿色生活解决方案
主要产品：小型桌面绿植、中型室内植物、绿植养护工具、特色花盆
网站色调建议：主色调绿色(#4CAF50)、辅助色米白(#F9F7F7)、深灰(#333333)
Logo设计理念：结合植物叶片与房屋形状，体现"家中有绿植"的概念
