《PS网页设计》作品设计报告书

广西交通职业技术学院信息工程系作品设计报告书

题目：PS网页设计

班级

学号

姓名

指导教师

2010 年6 月

目录

一、设计目标 (3)

1.1内容 (3)

1.2功能 (3)

1.3实现方式 (3)

二、设计指导思想 (3)

2.1技术背景 (3)

2.1.1网页设计 (4)

2.1.2图形编辑 (4)

2.1.3平面设计 (4)

2.1.4主流软件 (4)

2.2开发环境 (5)

三、设计内容及制作步骤 (5)

3.1页面展示 (5)

3.1.1成品展示 (5)

3.2.2参考作品 (6)

3.2制作构思 (7)

3.2.1板式 (7)

3.3.2颜色 (7)

3.3制作流程 (7)

3.3.1背景 (7)

3.3.2LOGO (8)

3.3.3导航条 (9)

3.3.4板块 (9)

3.3.5板块内容 (10)

3.3.6板块文字美化 (11)

3.3.7页尾 (11)

四、设计制作进度表 (11)

五、作品提交清单及运行环境要求 (12)

5.1文件清单 (12)

5.2运行环境要求 (12)

六、相关问题及结束语 (12)

6.1相关问题 (12)

6.2结束语 (12)

6.3感悟 (13)

七、参考资料 (13)

一、设计目标

1.1内容

通过PS这款软件，设计一个简单、美观、符合实际的网页页面，页面内容具备网页经常可以看到的功能。这次的作品既是PS设计，同时也是网页设计，因此在页面及其功能上应按一个正规网站来设计。

1.2功能

对于网站设计来说，不仅应了解该网站要运行什么应用程序，需要如何连接单位现有系统等，还需知道这个网站希望达到什么样的目的，即必须清楚网站的目标市场在那里。这将成为整个网站所有设计思想的基础。无论网站采用何种形式，什么样的外观，提供什么的内容，都要以网站的最终目的为出发点来考虑。

另一方面，网站建设还应该收集客户对这个网站的美术需求。网站设计人员就需要了解建站单位形象的突出点和单位标志的特点、意义等。

本网站的建设主要是建成一个集在线阅读、书籍下载、文化新闻等功能于一体的商业化网站。

1.3实现方式

运用PS相关功能，设计出一个静态的页面，然后通过HTML输出，得到一个基本的网页文件。

二、设计指导思想

2.1技术背景

对于现在的社会，科技的飞速发展已经成为社会发展的标志。其中计算机的发展可谓快中之快，而在计算机的发展中计算机网络的发展又是首当其冲的。计算机网络从为我们所知，到现在才经历的短短的几年时间，在这几年中随着计算机网络的广泛应用，特别是Internet 的普及和发展，网络已经成为了不可或缺的通信手段。不论是最新的新闻信息、新产品的出台、新游戏的发布、最新的各种IT动态，包括等候就业人才的个人简历，我们都是可以通过网络来获得。但是什么为这所有的一切提供平台的呢。我们又是通过什么来获取这些消息

的呢——对就是网页。现如今，数以万计的网站以网页的方式提供了丰富、精彩的信息。在人类社会进入信息时代的时候，在网络成为通信的主要手段的时候，在计算机网络普及的今天，网页也在它自己的岗位上做出了突出的贡献。网页是我们在网络上的“带言人”。我们将什么样的信息传达给浏览者，要讲述什么要的事情，网页在这里起着重用的作用。

2.1.1网页设计

网页设计是伴随着网络的快速发展而快速兴起，由于人们使用网络的频繁而网页作为上网的主要依托就变得非常的重要。网页讲究的是排版布局，其功能主要就是提供一种形式给每个上网者，让他们能够了解网站提供的信息。网页设计直接面对的是大量用户,随时都会反馈回来对网页的批评建议等，可以根据实际情况进行修改，这样做可以使使用者用起来更加的方便。

2.1.2图形编辑

图形编辑是纠正数据采集错误的重要手段，其基本功能要求是：具有友好的人机界面，即操作灵活、易于理解、响应迅速等；具有对几何数据和属性编码的修改功能；具有分层显示和窗口功能，便于用户的使用。图形编辑的关键是点、线、面的捕捉，即如何根据光标的位置找到需要编辑的要素以及图形编辑的数据组织。

2.1.3平面设计

平面设计（graphic design）的定义泛指具有艺术性和专业性，以“视觉”作为沟通和表现的方式。透过多种方式来创造和结合符号、图片和文字，借此作出用来传达想法或讯息的视觉表现。平面设计师可能会利用字体排印、视觉艺术、版面（page layout）等方面的专业技巧，来达成创作计划的目的。平面设计通常可指制作（设计）时的过程，以及最后完成的作品

2.1.4主流软件

Adobe Photoshop是公认的最好的通用平面美术设计软件。由Adobe公司开发设计。其用户界面易懂，功能完善，性能稳定，所以，在几乎所有的广告、出版、软件公司，Photoshop都是首选的平面工具。

CS是Adobe Creative Suite一套软件中后面2个单词的缩写，代表“创作集合”，是一个统一的设计环境，将Adobe Photoshop CS2、Illustrator CS2、InDesign CS2、GoLive CS2 和Acrobat 7.0 Professional 软件与Version Cue CS2、Adobe Bridge 和Adobe Stock Photos 相结合。

最新版本是Adobe Photoshop CS5。

2.2开发环境

本次设计所采用工具：Photoshop CS3

Photoshop CS3是可以将设计者的想法表现为图像的一种工具。Photoshop CS3提升了编辑图像的速度，改善了图像的画质效果，使用户在处理图像时更为轻松便捷。现在，不论是公司还是学校或家庭都会用Photoshop CS3来制作或处理图像

三、设计内容及制作步骤

3.1页面展示

3.1.1成品展示