第15章综合应用案例1.PDF

第15章 综合应用案例1 设计制作工作室网站 《网页设计与制作案例教程》 （第3版） 网站按照主题分为个人网站、政府网站、教育网站、 公司网站、电子商务网站等。不同类型的网站有不同 的风格。对于小型网站，通常为了展示公司形象，介 绍业务范围和产品特色等，页面都是HTML静态页面， 没有后台，基本上不会更新。本章以Div+CSS作为技 术架构，介绍某小型工作室网站的建设流程及静态页 面设计步骤，以期对网页布局形成整体认识，提升网 页设计水平。 《网页设计与制作案例教程》 （第3版） 本章主要内容  网站建设的流程；  网站需求分析；  网站原形设计； 创建站点；  网站首页设计； 栏目页设计。 《网页设计与制作案例教程》 （第3版） 15.1 网站建设流程 网站的风格各异，诉求也不尽相同，网站建设却遵 循相同的流程。大体来说，网站建设的流程主要包括 需求分析、原型设计、交互设计、界面设计、程序编 写、网站发布等。 《网页设计与制作案例教程》 （第3版） 15.1 网站建设流程 《网页设计与制作案例教程》 （第3版） 15.1 网站建设流程 （1）需求分析。明确客户建站的诉求。需求分析 通常基于针对特定商业目标的调研活动，主要内容是 获取竞争对手及自身优势劣势，及用户品牌方向信息。 通过收集调研数据，形成调研报告。通过用户访谈获 取用户习惯及用户体验目标，最终形成需求文档，并 进行需求评审。 《网页设计与制作案例教程》 （第3版） 15.1 网站建设流程 （2）原型设计。根据需求分析绘制系统业务流程 图，主要表现形式是原型界面。以此供内部评审使用， 内部评审通过后，送专家评审，在此基础上形成设计 方案。 （3）交互式Demo设计。根据原型设计方案完成 交互式Demo，交互式Demo由专门的软件设计，或 使用Excel等软件设计完成，能够模拟网站欲实现的全 部功能，给客户以直观的效果感受。 《网页设计与制作案例教程》 （第3版） 15.1 网站建设流程 （4）视觉界面。对于大部分中小型网站来说，原 型设计和Demo设计可能会被忽略，但是页面效果图 的设计是必不可少的，首页效果图的设计需要由具有 一定专业水准的平面设计人员完成，他必须深刻了解 用户的需求，具有很好的整体把握能力。视觉界面设 计主要包括页面风格及布局确定、关键界面设计、文 字及其他元素设计等，设计完毕后进行GUI评审，直 至方案确定。 《网页设计与制作案例教程》 （第3版） 15.1 网站建设流程 （5）代码切割。根据前面环节讨论的结果，使用 Photoshop等图像处理软件，将网页效果图进行切割，并 以此设计静态页面，通过浏览器展示给用户，根据用户体 验，收集bug并进行进一步优化。 （6）发布跟踪。测试后的网页，通过服务器发布并提 交给用户，进一步收集用户操作数据，监测各个反馈渠道 的信息，并在此基础上进行数据筛选，形成用户检测报告。 若有问题，再进入需求分析阶段，以此循环，直至客户满 意。 《网页设计与制作案例教程》 （第3版） 15.2 网站需求分析 需求分析是网站建设成功与否的基石。网站需求分 析要立足实际，对网站的背景、现状等内在因素和客 户特点进行详细调查，然后根据网站要达到的功能实 际需求对网站进行整体规划。 对于网站需求分析，有条件的话，可以进行问卷调 查，通过对调查问卷的分析，得出科学的结论，生成 需求分析报告，供相关人员参阅。网站整体需求主要 包括以下几个方面： 《网页设计与制作案例教程》 （第3版） 15.2 网站需求分析 （1）网站建设背景 主要包括网站的性质、服务对象、