网站建设与网页设计的研究与实践.docx

网站建设与网页设计的研究与实践.docx

《网站建设与网页设计的研究与实践.docx》由会员分享，可在线阅读，更多相关《网站建设与网页设计的研究与实践.docx（9页珍藏版）》请在冰豆网上搜索。

网站建设与网页设计的研究与实践

企业网站建设与网页设计的研究与实践

张振东张玉岚董野

摘要:

创建便于管理易于访问的企业网站系统和设计美观大方内容充实的网页，是每个网站开发者都要考虑的问题。

本文针对适应现代企业的发展对网络的需求，在如何设计和开发科学、智能、互动、安全、快捷的网站环境等方面进行深入的探索，并将网站建设及网页设计的相关实践，进行了技术性的阐述，便于网站信息开发人员在实际工作中进行研究。

关键词：

企业网站建设、设计技巧、Internet、特色网站

随着网络的普及与发展，在Internet上拥有自己的站点和主页将是必然趋势，网上主页不仅成为企业宣传和服务的窗口，也是树立企业形象的前沿。

就如同电视广告，蹩脚的广告看了使人大倒胃口，避之唯恐不及，而构思精巧的广告则能让人欣然接受，百看不厌，富于创意的主页也必将吸引大量的访问者，使更多的人认识了解，进而喜爱你的企业。

如何加强企业网站管理，做到“文明办网”，同时利用网络即时、互动、无界的特点，创造性地进行网站创新，提高网站的核心竞争力，成为亟须我们研究和解决的重大课题。

一、企业网站建设前应注意的问题

　　建立一个成功的企业网站，并非一朝一夕可以做到。

不少新近参与网站管理的人员在建立网站的过程中，缺乏周密的计划，使之在管理中倍受阻碍。

那么，如何建设好企业网站，才是成功的第一步呢?

　　1、市场调查阶段

　　了解一下目前internet的发展状况以及同类站点的发展、经营状况，吸取他们的长处，找出自己的优势，对市场作个调查，明确自己网站的主题，寻找一个好的出发点。

　　2、设计网站的规模

　　做网站并不是盲目的想做多大就作多大，而要根据自身的现阶段能力，以及企业的规模大小，确定你的网站是小型、中型、大规模的网站，还是从小规模的开始，然后逐步发展。

这主要的是关系到网站的后期维护以及网站的发展方向来考虑的。

　　3、确定网站的类别

　　根据主题、形式以及企业的特点，网站的设计也有不同的类别，大概可分为：

第一种以内容为主，设计为辅，注重速度这种大型的专业网站，它一般体现在专业的icp，isp供应商制作的网站，在设计这类网站时不要太花哨，应注重信息量；第二种大多数企业为了更好的宣传自己的产品，扩大销路，使自己的产品走向世界，提高自己企业的形象而制作的网站，这种网站制作应结合本身产品特点而制作的特色网站，相对来说比较注重产品的营销；第三种是形象类的网站，一般这种网站相对体现在政府部门，作为对外一个窗口，相对来说这种网站设计比较严肃；第四种是个人主页网站，这种网站相对比较自由，不受什么约束，可以根据每个人自己的特长自由发挥。

因此我们在制作主页时先明确自己的定位方向，设计出适合自己的站点。

　　4、确定网站的主要目标受众

根据网站的类别不同，目标受众也不一样，有工商业者、专业人士、学生；女性，男性；儿童，青少年，中年人，老人；还是所有的人，比如教育类的网站相对来说是目标受众是院校的老师和学生。

化装类、护肤产品类的网站相对来说是女性等。

　　5、确定网站的整体风格

其实，这个原则和传统的印刷出版物没什么区别。

网页上所有的图像、文字，包括像背景颜色、区分线、字体、标题、注脚什么的，都要统一风格，贯穿全站。

这样子读者看起来舒服、顺畅，会留下一个“很专业”的印象。

例如在列示一二三四若干条的情况下，在每条前面用黑圆点加强视觉效果，那么其他类似地方，也应该保持同样的风格。

色彩斑斓的站点，尤其要注意风格的统一。

颜色可以变，不过字体、主体文本对齐风格、标题、背景效果以及特殊图像效果等等都应保持统一。

二、整理出站点的框架以及逻辑结构图

1、把目标细化以整理出站点主体框架

把基本确定的目标细化，并初步整理出为达到这些目的站点所需要包含的所有内容。

例如，站点应该发布什么信息，站点需要提供什么应用程序等。

然后，把初步定下的内容纲要写下来，交给上级或业务人员审核批准。

这实际上就形成了站点设计的需求报告。

在内容纲要里，还应该注明这些内容的信息来源，哪个部门应该提供哪方面的信息。

把这些罗列下来，会使得上级以及各个相关部门清楚“谁应该为这些内容负责”。

2、进一步整理出站点逻辑结构图

定下内容纲要后，大致画出站点的结构图。

结构图也有很多种，顺序结构，网状结构，继承结构，WEB结构等，应依据内容而定。

例如，如果是在编一个教程，那么可能用顺序的流程图表示比较合适。

多数复杂的网站会综合应用到几种不同的结构图。

画出结构图的目的，主要是便于有逻辑地组织站点和链接，将来会用这个图进行分配工作和任务。

例如：

可以告诉某个开发人员，让他完成结构图中某个分支的内容；把这个图交给业务人员，告诉他们哪些页面，需要他们进一步提供内容或资料；可以把结构图给专业美工看，让美工人员考虑以什么样的形式来表现想要表达的内容等等。

三、企业网站应具备的几个内容

　　1、企业的网站架构应该是以企业为核心的主题层次、内容分类、页面顺序等组成。

由于每一个浏览者都可能成为企业的客户，网站的主题应突出对企业所想或所可以提供给客户的利益性产品或服务的详尽说明和体贴客户设计，而企业规模、实力等方面的描述则只是对主题的烘托，由此决定了在内容分类上应加大主题内容的渲染，在页面顺序上应优先考虑主题内容的排列。

　　2、企业网站另一个重要的作用就是体现出企业精神、理念以及企业文化，这些是企业的CIS理念中的组成部分，在网站的建设中该部分也应该得到延伸和渗透。

　　３、在策划过程中还要兼顾企业产品营销理念和企业未来的发展规划。

一个完整意义的企业网站还应该突显企业所处行业的特点，以避免初次接触的浏览者从视觉或文字上对企业的行业产生误解，使得企业的形象建立产生偏差。

　　４、如果企业在网站上提供本行业的信息和动态，以及着眼于行业性的内容（如科普教育等），那么不仅能使企业网站内容更为丰富，同时也会提高网站的档次和访问率，进而使得浏览者对企业建立了行业权威的形象。

如果说网站架构是骨架，那么网站内容就是血和肉，是浏览者了解企业的关键。

由于目前Internet受到网络传输速率等因素的影响，网站的内容务必达到精炼、准确，切不可错字累累、篇幅冗长，以保证浏览者能够在较短时间内了解到网站的核心内容。

同时还要注意对网站内容的及时更新和延伸扩展，特别是有关最新动态、企业重大活动、客户服务举措、新优惠新调整等信息。

四、网页设计

网页能够给浏览者带来最直接的视觉感受，也是能否吸引浏览者继续深入浏览企业网站的关键，从设计上来说网页应该是文字与图形、文学与美学的巧妙结合体。

如果企业的网站希望不但别具匠心而且颇有创意，除了在网页设计上需有个性和美学外，一般还具备主题内容鲜明突出、页面设计简洁明快、色彩搭配调和清新、图片精巧富含义、文字图形搭配得当，文字排版体贴浏览者不制造视觉障碍等特点。

网页设计必须考虑到目前Internet的制约因素，如网络传输速率、服务器性能指标以及客户端浏览模式等，切不可为了单纯追求页面的奢华而加大网络传输图片的负荷。

图片虽然能使整个页面生动，但不能过多，而且动态图片更应该少之又少，只是起点睛之用，不要造成页面到处跳跃，影响视觉，使视觉没有重点。

　　网站一般包括首页、框架页、普通页、弹出页。

从功能上来看，首页主要承担着树立企业形象的作用，框架页在导航方面起着重要的作用，比如各栏目内部主要内容的介绍，都可以在框架页中体现再进入普通页，让浏览者能够迅速了解网站各栏目的主要内容，择其需要而浏览。

而普通页则是主要的信息页面，也是网站的最终页面，对于大型网站，这种结构非常重要，而对于中小型企业，网站规模较小、页面数量不多，有时框架页就起着普通页的作用。

至于弹出页，建议不是必要，最好不要用。

下面详细介绍各页面的设计技巧：

　　1、首页设计技巧

　　网站首页是企业网上的虚拟门面，在此，提醒上网的企业注意自己门面的设计，决不能敷衍了事、马马虎虎。

我们会经常看到印刷精美的产品目录或广告，当您屡屡看到那些印有产品目录或广告的精美印刷制品的时候，相信您或多或少会对有关的产品形成一种好感，即使您不会购买，也必然对这些产品形成一定程度的认同。

而对于设计毛糙的宣传品，您肯定会怀疑其内容的真实性，从而对其产品或服务产生质疑。

网站的页面就好比是“无纸的印刷品”。

精良和专业网站的设计，如同制作精美的印刷品，会大大刺激消费者（访问者）的购买欲望，反之，您公司所提供的产品或服务将不会给消费者（访问者）留下较好的印象。

　　一般来说，网站首页的形式不外乎有两种，一种是纯粹的形象展示型，这种类型文字信息较少，图像信息较多，通过艺术造型和设计布局，利用一系列与公司形象和产品、服务有关的图像、文字信息，组成一幅生动的画面，向浏览者展示一种形象、一个氛围，从而吸引浏览者进入浏览。

这需要设计者具有良好的设计基础和审美能力，能够努力挖掘企业深层的内涵，展示企业文化。

这种类型的首页在设计过程中一定要明确要以设计为主导，通过色彩、布局给访问者留下深刻的印象。

　　另一种是信息罗列型，一般的大、中型企业网站和门户网站常用的方式，即在首页中就罗列出网站的主要内容分类、重点信息、网站导航、公司信息等等，也就是我们上面谈到的框架页，这种风格比较适合信息量大，内容丰富的网站。

因为是以展示信息为主，这里的设计就要在细微之处体现企业形象，设计人员最好仔细阅读企业的ＣＩ手册，熟悉企业标志、吉祥物、字体及用色标准，在网站的局部体现出来，往往平淡之中一个优美的符合企业特点的曲线就能够给人以深刻的印象，从而将企业形象印在浏览者的脑海里。

设计人员在设计过程中要注意使用这些语言符号来表达一种独特的企业信息。

　　2、风格保持一致——内页设计技巧

　　如何保持网站风格的一致，是进行内页设计过程中考虑的重要方面，根据经验，我们可以尝试以下几种设计方式：

　　①、结构的一致性：

网站的统一性在网站营销中占重要地位，而网站结构是网站风格统一的重要手段，包括网站布局、文字排版、装饰性元素出现的位置、导航的统一、图片的位置等等。

到国外著名的电子商务网站浏览，你会发现这些网站结构惊奇的一致性，所不同的是色彩或内容，在结构的一致性中，我们要强调网站标志性元素的一致性，即网站或公司名称、网站或企业标志、导航及辅助导航的形式及位置、公司联系信息等，这种方式是目前网站普遍采用的结构，一方面减少设计、开发的工作量，同时更有利于以后的网站维护与更新。

　　②、色彩的一致性：

方式是保持站点主体色彩的一致，只改变局部色块，优点是一个独特色彩的网站会给人留下很深刻的印象，因为人的视觉对色彩要比布局更敏感，更容易在大脑中形成记忆符号。

在色彩的一致性中，我们强调的是如果企业有自身的CI形象，最好在互联网中沿袭这个形象，给观众网上网下一致的感觉，更有利于企业形象的树立。

一个建议是选取一到两种主要色彩，几种辅助色彩。

　　③、利用导航取得统一：

导航是网站的一项重要组成部分，一个出色的富有企业特性的导航将会给人留下深刻的印象，比如将标志的形态寓于导航之中，或将导航设计在整个网站布局之中等等不一而足，花点力气在导航上，也会设计出一个出色的站点。

　　④、特别元素的一致性：

在网站设计中，个别具有特色的元素（如标志、象征图形、局部设计等）重复出现，也会给访问者留下深刻印象。

比如网站结构在某一点上的变化，由直线变为圆弧、暗色点缀的亮色、色彩中的补色等等。

⑤、利用图像取得统一：

网页中的图像在使用上一定要甚之又甚，尤其是一些动画，网页中充斥着各种可有可无的动画，而这些动画根本与本企业内容无关！

认真检查网页中的动画，将没用的删掉！

这里我们所说的利用图像取得统一，决不是在每页中放置几个动画！

而是作为网站结构一部分的局部图像，根据网页内容的不同，配以相应的图像或动画，从而给浏览者形成页面的连续性。

⑥、利用背景取得统一：

从技术上而言，网页背景包括背景色和背景图像两种，一般来说，我们并不提倡使用背景图像，而使用背景色或色块。

原因很明显，第一，下载速度，背景色的下载速度忽略不计，而背景图像就得根据图像字节大小下载了，这里需要说明的是，如果你的背景图像比较深，那么最好将背景色置为深色调（默认的背景色是白色），这样在等待浏览器下载背景图片的时候前面的浅色文字可以很容易阅读，因为如果有背景色，浏览器先将其下载，然后下载背景图片；第二，显示效果，经常看到国内一些网站设有背景图像，或者是公司的厂房、办公大楼，或者是产品图片，甚至是某某人物的照片，使得前面的文字很难辨认，给人一种很不舒服的感觉，让人无法停留。

　　那么什么适合网页背景呢？

建议将公司的标志、象征性的简单图片作为背景，并将其淡化，使浏览者在阅读网站内容的同时不经意记下公司的标志。

曾经见过一个网站的背景是这样设计的：

单色背景中一个网站的标志居中放大淡化，前面元素中也不断重复这个标志，如提交按钮形状刻意设计成标志的形式等，在整个页面中形成特有元素在大小、明暗及位置的呼应，很好地塑造了网站的特有形象。

　　3、色彩搭配

　　网页中最难处理的也就是色彩搭配的问题了。

如何运用最简单的色彩表达最丰富的含义，体现企业形象是网页设计人员需要不断学习、探索的课题。

如何进行色彩搭配是一门学问，下面的一些方法是在实践过程中的体会，希望能够为您起到一定的参考作用。

　　①、运用相同色系色彩：

所谓相同色系，是指几种色彩在360°色相环上位置十分相近，大约在45°左右或同一色彩不同明度的几种色彩，这种搭配的优点是易于使网页色彩趋于一致，对于网页设计新手有很好的借鉴作用，这种用色方式容易塑造网页和谐统一的氛围，缺点是容易造成页面的单调，因此往往利用局部加入对比色来增加变化，如局部对比色彩的图片等。

　　②、运用对比色或互补色：

对比色就是指色相环相距较远，大约在100°左右，视觉效果鲜亮、强烈，而互补色则是色相环上相距最远的连种色彩，即相距180°，其对比关系最强烈、最富有刺激性，往往使画面十分突出，这种用色方式容易塑造活泼、韵动的网页效果，特别适合体现轻松、积极的素材的网站，使用中注意色彩使用的度。

　　值得注意的是，以上两种用色方式在实际应用中要注意主体色彩的运用，即以一种或两种色彩为主，其它色彩为辅，不要几种色彩等量使用，以免造成色彩的混乱。

　　③、使用过渡色：

过渡色能够神奇地将几种不协调的色彩统一起来，在网页中合理地使用过渡色能够使你的色彩搭配技术更上一层楼。

过渡色包括几种形式：

两种色彩的中间色调、单色中混入黑、白、灰进行调和以及单色中混入相同色彩进行调和等等。

　　4、版面布局

　　一般来说，企业网站首页的布局比较灵活，着重设计，布局主要是指内页的版面规划。

从排版布局的角度而言，可以设计成等分两栏式、三栏式、多栏式，不等分两栏式、三栏式、多栏式等。

但因为浏览器宽幅有限，一般不宜设计成三栏以上的布局。

在版面布局中主要是考虑导航、必要信息与正文之间的布局关系。

比较多的情况是采用顶部放置必要的信息，如公司名称、标志、广告条以及导航条，或将导航条放在左侧而右侧是正文等等，这样的布局结构清晰、易于使用。

五、网站的宣传与推广

　　初步完成一个站点的设计建设，只是企业网站经营的开始。

为了真正发挥一个站点的作用，我们要以该站点为基础，在网上网下开展长期而有效的推广工作。

　　1、传统媒体的运用

网站的推广，应该融入在整个企业的宣传工作中，在所有的广告、展览、各种活动中都要在显著处加入公司的网址，并做适当介绍。

　　2、网址宣传融入日常工作

　　把网址加入到信封、信纸、名片、手提袋等各种办公用品；企业建筑造型、公司旗帜、企业招牌、公共标识牌等外部建筑环境；企业内部建筑环境，如内部常用标识牌、货架标牌等等；各种交通工具；公司员工的服装服饰上等；各种产品包装袋上；公司平时的赠送礼品上；公司的各种印刷出版物上要能全面利用这些宣传手段，实际上需要我们在设计公司的CI（企业识别系统）时将网站这个因素考虑进去，网站实际上是CI设计中的一个基本要素。

　　3、网络的运用

　　网络推广的具体方法很多，主要的有登录搜索引擎，利用各种论坛、讨论组、供求黄页，使用定向的邮件列表等等。

　　六、网站的维护与管理

对于任何一个网站来说，如果要始终保持对客户足够的吸引力，定期进行内容的更新是唯一的途径。

几个月甚至一年一成不变的网页是毫无吸引力可言的，那样的结果只能是访问人数的不断下降，同时也会对公司的整体形象造成负面影响。