从设计角度探讨如何进行网站的制作

陶颖

摘要：网站是现代社会各个部门或机构对外展示的一个平台和窗口。一个网站的优劣直接影响到访问者对网站所代表的机构的第一印象。一个内容丰富、设计合理、布局美观贴切主题的网站往往可以给企业或部门带来积极的作用和影响，所以制作一个引人注目的网站对于企业来说就显得至关重要。该文就是从设计角度着手探讨如何设计一个赏心悦目的网站。

关键词：需求分析；设计；布局；色彩搭配

中图分类号：TP393 文献标识码：A 文章编号：1009-3044（2015）27-0217-03

Abstract： Website is a platform and window for all departments and agencies of the modern society. The quality of a web site directly affects the visitor's first impression of the agency's body. A content rich， reasonable design， layout， beautiful and appropriate theme of the site often can bring positive effect and influence to the enterprise or the Department， so make a noticeable website for the enterprise is very important. This article is from the design perspective on how to design a pleasing website.

Key words： demand analysis； design； layout； collocation color

随着互联网技术的迅猛发展和全方位的融合，越来越多的人得益于网络的发展。每天都有无数的企业和机构创建自己的門户网站，通过访问这些网站，每天都有无数的信息在网络上传播，人们在其中各得其所。而构建网站的重要元素是网页，内容丰富多彩的网页就是这些信息的载体。那么网站和网页又是由什么元素组成的呢？

网站是由域名（俗称网址），网站源程序和网站空间三部分构成。其中域名它是类似于互联网上的门牌号码，是用于识别和定位互联网上计算机的层次结构的字符标识，是内容丰富多彩的网页集合。网页是组成网站的基本单位，网页中通过丰富的元素，例如文字、图片、图形、表格等信息结合一定的布局和排版来体现页面的具体内容，传达信息。

网站的设计分为两种情况，一类是静态站点和静态网页的设计，主要是设计师通过如Dreamweaver等静态网页制作软件来对网站进行编辑和布局。另一类是动态网站，当然基于该网站的网页信息也是动态的，它会随时随地根据实际情况更新信息，方便人们第一时间掌握最新资讯。对于许多网站开发人员来说，不论是静态的还是动态网站和网页，设计过程才是其中最具挑战性和决定性的。有的网站内容庞杂，像新浪，网易这样的门户网站；有的网站简简单单只有几个页面，但不管是什么样的网站，都是要经过同样的设计过程。任何人，无论他有没有艺术天分，都可以设计出一个看起来不错的网站，而所需要的仅仅是站点版面设计的基本原理和一些经验。所以，我们就从基础开始探讨从设计角度如何进行网站制作。

1 网站的前期衡量和考虑

一个优秀的网站就像美酒和美女一样让见者流连忘返，而一个企业的门户网站访问量大也从侧面反映了这个企业的实力。那么什么样的网站才称得上设计好呢？网站是传递信息的一个窗口，一个生动形象，内容吸引人，功能性好的网站是设计人员为之奋斗的目标。

作为设计师在进行网站制作过程中，需要先考虑三个方面：首先要保证页面所体现的内容和设计能吸引用户，当然这个过程需要注意美学、色彩学和可用性相结合。其次设计出的网站用户在访问期间能通过直观的导航贯穿整个网站，不仅可以改变鼠标悬停的外观，还要清楚的指明将要浏览网页的链接，要让访问者的时间都花在刀刃上，而不是浪费在查找定位中，这是保证不流失访问者至关重要的一个方面。最后就是网站上所有的网页要让用户感觉同属于一个网站，即网站的页面是同一风格或主题，跳跃性不宜太大，页面的内容和信息虽然各不相同，但标识和导航应该要保持一致性，还可以考虑使用色块系列来帮助统一网页风格。一个优秀的网站设计体现在能不能处理好各个元素之间的关联和平衡。如果设计网站时首先能从这三个方面考虑和全篇布局，一定可以收到不错的效果。

2 网站的设计制作过程

2.1网站供需双方的需求分析

建设一个网站不是盲目的，不是把别人的网站更改一下背景颜色，换掉几张图片就是建设网站。首先应该清楚知道需要做网站的公司是从事什么行业，然后就要考虑网站的内容，包括网站功能和网站建设的委托方需要通过网站达到什么目的，也就是确定网站的目标。网站的整个设计都应该围绕这些方面来展开需求分析。接下来选择网站目标的用户，就是确定网站是面向什么用户群体，这个群体有什么特点和喜好，所做的网站内容希望能提供什么信息，涉及哪些方面，资料素材是否已经备齐，有没有需要自己准备的素材，如果有，需要通过哪些工具来完成，图片是否需要图像处理工具来加工，为了保证浏览的效率，对放置在网页中的图片有什么具体的要求。整个网站的功能需要划分为几个方面，这些方面需要规划多少个页面来实现。如果有竞争对手，他们的网站反馈情况如何。作为一名合格的设计师，不仅不可避免专业问题，还需要清楚一些页面效果中的问题，比如什么色彩能反映主题等。这些问题就是我们在正式制作网站之前需要先调查清楚的，只有先进行全面的需求分析后，才能设计出一个网页的模板，才能发挥创意、想法、创新继续下一步的工作。

对网站的需求双方分析和资料都收集齐全后，就需要对网站中的页面进行制作工具地选择了，工具的选择也是网站需求分析的一部分。网页中的图像设计和处理工具可以选择Photoshop或Fireworks，一个侧重处理颜色丰富的位图，一个倾向处理适合网页浏览的背景透明且文件小的图片，两者兼而用之，效果会更好。网站中的动画制作工具可以使用Flash，例如网站的banner、按钮、小动画都可以通过该软件来制作，甚至整个网站的首页页面也可以用Flash制作的动画来代替。这些用Flash制作出的动画不仅文件小、美观，可以为网页增色不少，也更容易吸引浏览者的眼球。网页页面排版工具首推Dreamweaver，通过前面两类工具制作出的网页图片并不是真正的网页，真正的网站页面是需要用网页页面排版软件来布局和排版的，根据需要还可以利用软件添加各种网页特效，使网站给浏览者一种人性化的体验，更好地吸引更多的浏览者。

最后就是其他方面的需求准备，设置动态网页平台IIS服务器，创建网站资料的数据库，网站域名和空间的申请或购买等工作。人的审美观和时代的潮流趋势会随着时间的发展而改变，只有始終满足客户和用户双方的需求才是网站设计持续立于不败之地的最佳设计理念。

2.2网站的整体设计与制作

网站的整体实现是一个系统工程，根据前面的需求分析，确定了适用人群和网站的主题风格及涉及工具就可以按照以下几个步骤来制作和实现：

2.2.1主页面的设计制作

建立本地站点并且搭建动态网页平台IIS后，先构架主页面。主页面是网站的首页，访问一个网站，服务器反馈过来的第一页面就是主页面，其他的页面都可以通过主页面当中的导航或链接转到，主页面的设计就尤为重要。

首先我们挑选适合我们主题风格的页面布局模式：

1） 左栏导航，标准通用的导航方式。

2） 右栏导航，更易于阅读的导航方式。

3） 三栏导航，适用于有大量导航，简短内容，大量广告的页面。

其次剖析页面需要设置的内容：

1） Logo图标：网站的重要识别特征。

2） 导航条放置的位置大多是顶部或折页的上部。

3） 内容：主要内容应该放在页面视觉中心，吸引用户注意。

4） 注脚：出现在页面底部，主要包括版权，联系方式，法律信息和网站主要部分的链接等。

5） 留白：根据页面实际情况而定，避免设计拥挤使页面平衡统一。

2.2.2页面布局技术

在整体框架和主页面完成后，可以考虑设计制作其他页面的模板。在技术上实现每个页面的具体布局，我们常用两种技术。一种是利用table表格布局，这种方式比较简单，容易上手，而且直观，但在不同分辨率的显示器下时容易变形，表格间隔容易出现背景色，而且一个页面中会出现多次表格嵌套，这样使得结构比较混乱，产生了大量的冗余代码。另一种方法就是利用目前比较流行的Div+CSS来布局和美化页面，使用CSS可以简化网页的格式代码，减少了需要上传的代码，减少了重复工作，提高了加载的效率就加快了页面的访问速度。通过建立CSS文件对整个页面甚至整个网站进行统一美化，使美观和效率大大提高。

2.2.3页面外观设计

1） 色彩的搭配

选择颜色绝不是一件简单的事情，需要考虑美学、一致性、可用性和适用性。而且还要考虑到大多数显示器可以支持的分辨率。网页设计人员需要了解色彩心理学，知道在什么场合运用什么颜色恰如其分。我们可以考虑应用三种常用的色彩搭配方法：单色搭配、相似色搭配、差异补色搭配。运用颜色的目的只有一个就是深深吸引访问者的眼球。在运用颜色搭配页面中，也要注意局部颜色的变化，使整个页面设计风格既统一化又具有个性化。当然设计时还需要了解不同颜色给人的感官带来的感觉，融合色彩的色温和明暗程度，饱和度等因素，就能找到合适的颜色搭配，从而建立一个基于该网站页面制作的配色板，这样就可以节约大量的色彩搭配时间。

例如：搭建一个糕点店网站，可以选用橙色、葡萄酒色、栗色等强效果颜色一起搭配使用，这些相似色的使用和这些颜色反射出的颜色心理暗示，可以展示出食品的美味，可以引起浏览者的食欲，自然就可以吸引浏览者购买一饱口福。

2） 页面的排版与修饰

随着互联网同人们生活结合的越来越密切，网页的组成元素也越来越丰富多彩的，有文本、图片、超级链接、动画（分为gif格式的和flash格式的）、表单和音频、视频等。进行网页设计是为了交流，排版是一个重要步骤，他不是简单的敲几下键盘，移动几下位置，而是兼顾艺术性的整合页面元素。在实现过程中我们要考虑网页字体的选择和使用，选择合适字体；文字空间距离的设置，调整文字间距；正文如何排版得体；是否需要使用特殊文字，例如一些有形特征的字体；同时还要注意对图像进行创意修改，调整图片的分辨率和格式，使之更好的适用网络环境；对边框或边界效果处理等方面。这些方面的合理应用都能使页面美观大大提升。

3） 页面的特效

可以在适当的地方运用一些恰当的页面特效，通过添加特效代码可以给页面增色不少。但不是特效用得越多越好，一个页面最多运用一个网页特效，否则就会显得页面特效很杂乱，效果反而适得其反。

2.2.4注意事项

从设计一个网站到实现一个网站的整个过程中，作为一名网页设计人员还应该注意以下几个方面。首先要考虑下载速度，所以避免使用过大的图像，避免长文本页面，尽量少使用Flash插件；这些都容易造成下载缓慢，用户等待过长，造成浏览者的流失。其次网站要不断升级更新，不仅要时时更新内容，还要注意在技术上、功能上、流行趋势上的与时俱进，总而言之就是要全面的满足用户的需求。最后最好不要使用卷滚条，少用框架，避免使用炫耀的技巧，避免视觉的花哨；这些东西只会增加用户查看的繁琐，造成用户心理的厌烦情绪。所以真正要做好一个网站不仅要会设计，会制作，还要根据反馈善反思，善于交流和总结，这样的设计才是永恒的。

3 结束语

如今全球信息技术和互联网技术的高速发展，使网站设计同其他诸如动画设计，程序开发，电子商务等一样应运而生，风生水起。网站如同一个门面，不论是个人主页、公司企业、政府部门还是国际组织，无不将网站作为自己向外界展示形象，传达信息的窗口。网站的设计与制作是一个系统工程，不能一蹴而就，要有充足的准备、按照条理清晰的思路、精心的布局、巧妙的构思和特别的创意一步步实施才能达到设计的目的，体现开发的价值。希望通过上述从设计角度分析如何制作网站的过程能对网站设计者和爱好者起到作用和帮助。

参考文献：

[1] Jason beaird.完美网页设计艺术[M]. 熊平， 宓媛珊，译. 北京： 人民邮电出版社， 2008.

[2] 何海霞， 陶琳.Dreamweaver cs3完美网页设计[M].北京： 中国电力出版社， 2008.