任务四网站设计任务书撰写及网站整体设计课件.ppt

1、 1、网站开发项目商务谈判技巧 2、网站开发项目合同的签订 3、初步掌握网站设计任务书的撰写规范 项目立项/客户的需求说明书项目立项我们接到客户的业务咨询，经过双方不断的接洽和了解，并通过基本的可行性讨论够，初步达成制作协议，这时就需要将项目立项。较好的做法是成立一个专门的项目小组，小组成员包括：项目经理，网页设计，程序员，测试员，编辑/文档等必须人员。项目实行项目经理制。客户的需求说明书第一步是需要客户提供一个完整的需求说明。很多客户对自己的需求并不是很清楚，需要您不断引导和帮助分析。曾经有一次，我问客户：“您做网站的目的是什么？”他回答：“没有目的，只是因为别人都有，我没有！”。这样的客户

2、就需要耐心说明，仔细分析，挖掘出他潜在的，真正的需求。配合客户写一份详细的，完整的需求说明会花很多时间，但这样做是值得的，而且一定要让客户满意，签字认可。把好这一关，可以杜绝很多因为需求不明或理解偏差造成的失误和项目失败。糟糕的需求说明不可能有高质量的网站。那么需求说明书要达到怎样的标准呢？简单说，包含下面几点：a.正确性：每个功能必须清楚描写交付的功能；b.可行性：确保在当前的开发能力和系统环境下可以实现每个需求；c.必要性：功能是否必须交付，是否可以推迟实现，是否可以在削减开支情况发生时砍掉；d.简明性：不要使用专业的网络术语；e.检测性：如果开发完毕，客户可以根据需求检测。网站总体设计在

3、拿到客户的需求说明后，并不是直接开始制作，而是需要对项目进行总体设计，详细设计，出一份网站建设方案给客户。总体设计是非常关键的一步。它主要确定：a.网站需要实现哪些功能；b.网站开发使用什么软件，在什么样的硬件环境；c.需要多少人，多少时间；d.需要遵循的规则和标准有哪些。同时需要写一份总体规划说明书，包括：a.网站的栏目和版块；b.网站的功能和相应的程序；c.网站的链接结构；d.如果有数据库，进行数据库的概念设计；e.网站的交互性和用户友好设计。在总体设计出来后，一般需要给客户一个网站建设方案。很多网页制作公司在接洽业务时就被客户要求提供方案。那时的方案一般比较笼统，而且在客户需求不是十分明

4、确的情况下提交方案，往往和实际制作后的结果会有很大差异。所以应该尽量取得客户的理解，在明确需求并总体设计后提交方案，这样对双方都有益处。网站建设方案的包括以下几个部分：a.客户情况分析；b.网站需要实现的目的和目标；c.网站形象说明；d.网站的栏目版块和结构；e.网站内容的安排，相互链接关系；f.使用软件，硬件和技术分析说明；g.开发时间进度表；h.宣传推广方案；i.维护方案；j.制作费用；k.本公司简介：成功作品，技术，人才说明等。网站详细设计总体设计阶段以比较抽象概括的方式提出了解决问题的办法。详细设计阶段的任务就是把解法具体化。详细设计主要是针对程序开发部分来说的。但这个阶段的不是真正编

5、写程序，而是设计出程序的详细规格说明。这种规格说明的作用很类似于其他工程领域中工程师经常使用的工程蓝图，它们应该包含必要的细节，例如：程序界面，表单，需要的数据等。程序员可以根据它们写出实际的程序代码。(这里不详细展开说明)需求分析活动其实本来就是一个和客户交流，正确引导客户能够将自己的实际需求用较为适当的技术语言进行表达（或者由相关技术人员帮助表达）以明确项目目的的过程。这个过程中也同时包含了对要建立的网站基本功能和模块的确立和策划活动。所以项目小组每个成员、客户甚至是开发方的部门经理（根据项目大小而定）的参与是必要的。而项目的管理者在需求分析中的职责有如下几个方面：1、负责组织相关开发人员

6、与用户一起进行需求分析。2、组织美术和技术骨干代表或者全部成员（与用户讨论）编写网站功能描述书（初稿）文档。3、组织相关人员对网站功能描述书（初稿）进行反复讨论和修改，确定网站功能描述书正式文档。4、如果用户有这方面的能力或者用户提出要求，项目管理者也可以指派项目成员参与，而由用户编写和确定网站功能描述书文档。5、如果项目比较大的话，最好能够有部门经理或者他授权的人员参与到网站功能描述书的确定过程中来。网站功能描述书必须包含以下内容：1、网站功能2、网站用户界面（初步）3、网站运行的软硬件环境4、网站系统性能定义5、网站系统的软件和硬件接口6、确定网站维护的要求7、确定网站系统空间租赁要求8、

7、网站页面总体风格及美工效果。9、主页面及次页面大概数量。10、管理及内容录入任务分配。11、各种页面特殊效果及其数量。12、项目完成时间及进度（根据合同）13、明确项目完成后的维护责任。关于网页设计中的审美训练 1运用平面设计中的纵向、横向分割 2运用平面设计中的节奏技巧 3运用平面设计中的对比技巧设计网页时应注意的问题 很多初学者容易将各种页面元素（如文字、图片、动画等）统统放在页面中，这会使得页面混乱。为了避免这种弊病的出现，设计中在保持最基本的页面元素时，增加新元素都应以网站整体风格为宗旨，以浏览者一目了然为目的，违反这一原则的任何元素都尽可能舍弃，不要吝惜。同时要注意网页用色。色相反差

8、大的颜色在一个网页中尽可能不要用到两种以上。其他元素色彩多考虑用同一色相的颜色，只是在明度对比中做调节。任务任务4-3:网站版面设计 1弧线形和圆形 2矩形 3菱形和多边形页面的设计 1网页的大小 因为页面尺寸和显示器大小及分辨率密不可分，网页的布局设计均需局限在显示器的范围之内。加之浏览器本身还要占去一定的空间，所以留给页面的范围变得很小。可将页面设计向下延长，以使浏览者可以运用滚动屏幕来浏览。2广告设计尺寸 3首页的重要性 4导航栏的设计原理 界面布局的基本原则 在考虑界面布局的时候，要注意到页面所要传达的信息，突出重点和主次分明。有如下几个原则在设计时需要遵循。（1）均衡原则（2）简约原

9、则（3）惯性原则界面布局类型 1“门”字型 2直角型 3标题正文型 4左右框架型（即纵向排列型）5综合框架型 6封面型 7Flash型 8综合变化型 1明度对比 2纯度对比 3相近色对比 4互补色对比 5暖色对比 6冷色对比 网页色彩特征 在显示器中看到的网页色彩，有时候会随用户的显示器设置而有些改变。它和自然界中的色彩不同的是：自然界中的色彩是通过光线的反射而产生出千变万化的颜色；计算机中的色彩则是由电子束表现出来的。显示器把光的三原色按照科学的比例加以组合，通过一个个像素小点表现出来。每个像素包含8位元的信息量，共有0255的256种可能组合。0是完全无光的状态，255是最明亮的情况。8位

10、元色彩能表现256种颜色，真彩需要24位元的信息量，也就是可以表现256的3次方16777216种色彩。在网页中，色彩是用十六进制来指定的。十六进制数0255就是00到FF。例如，在网页HTML中编码000000就是RGB都没有的状态，即视觉上的黑色；相反，FFFFFF就是RGB都有的255最明亮的状态，即视觉上的白色。1网页安全色 随着计算机被广泛应用和性能不断提高，大多的用户显示器都已使用16位元以上的颜色，但是还要考虑到不少用户的浏览器只能显示8位元的色彩。这样，为了使大多数的用户能够正确看到设计出的网页，应以8位元的256色为基准。除去在苹果窗口的40种颜色，网络安全色数量是216种，

11、如图2-38所示。图图2-38 2-38 网页安全色网页安全色2关于色彩模式 下面介绍几种常见的色彩模式。（1）RGB色彩模式（2）CMYK色彩模式（3）HSB色彩模式（4）索引色彩模式（5）位图色彩模式（6）灰度色彩模式页面元素间的色彩关系 1导航、小标题 2背景与文字 3LOGO和BANNER 4链接文字及链接图像 Logo的制作 Web2.0导航条制作 随着手段的更新，现在制作网页已经越来越不是难事了。但是如果要设计和制作一个有一定水准的网站，还需要设计师更多的用心和研究。制作一个优秀但又不失传播功能的网站，需要从设计和制作中不断注意各种问题，集中、鲜明地突出网站特点，不断排除累赘、啰唆

12、、不明确的因素。也就是说，一是注意网站内容的传播和整体性，一是注意浏览者的网络链接状况，也就是客户端所显示的页面效果。网站内容的传播和整体性 1注意网站受众群体的感受 2内容至上 3整体规划 4分类 5互动性注意浏览者的网络链接状况 1浏览者的网络链接现状 2考虑使用者的浏览器种类和版本 3特殊字体的应用 4图像应用的几点提示 5HTML格式的注意事项 6在网页中加入大量技术成分时要慎重及时更新、维护 1服务器目录结构 2网站升级设计实例 1广告公司网站的页面设计（1）首先在Photoshop中进行网页效果图制作，根据所要制作网站的内容，设计出与之风格色调相协调的网页静态图。（2）一级页面（3）二级页面公司简介（4）三级页面公司业务（5）四级页面（6）这样就基本完成了这个网站的页面设计部分，制作部分会在后续章节（见第3章广告公司站点建立）里继续讲解。2一个系部网站的页面设计