网站规划与网站设计

Internet已成为当今时代人们获取信息的重要途径,它改变了人们的生活、工作和学习的各个方面。人们可以Internet发布信息,交流思想,推广科技,检索行业信息等。它所具有的数字化、多元化、全球化、多媒体化、实时性、交互性等众多特征使它也具有了越来越广泛的商业用途。但是离开各种网站,Internet的众多应用都无从谈起。

1 网站建设规划

在网页设计前,首先要给网站一个准确的定位,是属于宣传自己产品的一个窗口,还是用来提供商务服务或者提供资讯服务性质的网站,从而确定主题与设计风格。网站名称要切题,题材要专而精,并且要兼顾商家和客户的利益。建设一个有影响的商业网站,从结构设计、页面设计到时数据库的集成,每一个环节都非常重要。

1.1 网站的基础规划

在Intenet中,网站成千上万,浏览者常常是走马观花,一带而过,只有精彩、内容极其丰富的网站,才能吸引住浏览者。这种结果首先要归功于网站的规划。独具匠心的网站规划就像一幢宏伟的建筑前期的规划设计一样,要进行认真、科学的总体规划,之后才可以“破土动工”。网站规划主要有两大部分:一是规划涉及的内容,包括每一步的目标、内容;每一步的人力安排;每一步生成的文档。二是网站的要素,包括网站的内容、网站的功能和网站的表现形式。网站建设的基本流程如图1。

1.1.1 明确网站设计目标

展示公司形象,发布公司信息和提供服务,宣传公司产品是商业网站建设的要求。所以在设计网站时必须明确目标,从而做出切实可行的计划。

1.1.2 迎合客户需求

会有越来越多的人使用Internet,Internet也将成为人们生活中不可或缺的部分,越来越完善的网络服务走进千家万户。我们的网站必须能满足众多网民的需求。

1.1.3 产品宣传的需要

通过Internet进行产品发布、宣传无疑是最理想的途径,人们越来越习惯到Internet上查找所需要的信息,并且作为首选的途径。宣传单、产品介绍,这些都只是一张静止不动的纸。而网站,在代表公司的网页上,客户却能听见公司真诚的声音,看到友好的笑容,而且它是动态的,可以随时加入最新的内容。这无疑接拉近公司与客户间的距离。

1.1.4 与客户沟通的桥梁

客户对公司产品的意见,对公司的建议,可以通过客户留言板即时得到并迅速反应,然后通过网站中的站长回复功能再反馈给客户。还可以通过信息交流论坛与客户在线交流。

1.1.5 优化工作提高效率

行业资讯提供公司最新的动态介绍,公司的一些最新决策、促销活动等,还可以将客户经常关心的问题在网站上发布,不必再为重复答复这些问题而苦恼,从而使工作更具效率。

1.1.6 和谐页面

要将丰富的内容和多样的形式组织成统一的页面结构,形式和语言都必须符合页面的内容,体现丰富的内涵。运用对比与调和,对称与平衡,节奏与韵律以及留空白等样式,通过文字、图像相互之间的关系建立整体的均衡状态,产生和谐的美感。

1.1.7 网站信息更新与维护

当访问者与网站进行信息交互、发布用户信息时,该网站才会动态显示,才具有生命力。要把网站规划为动态网站,具有后台数据库的支持和远程维护的功能。 这样只有当网站投入运行后才能及时地更新网页信息。一个网站必须要保持经常性的更新,才能不断吸引访问者再次光临,使潜在消费者变成客户。如果网站一成不变,是无法获得更多商业机会的。

1.2 网站规划原则

在设计之前,先画出网站结构图,其中包括网站栏目、结构层次、链接内容。首页中的各功能按钮、内容要点、友情链接等都要体现出来,一定要切题,并突出重点,应把大有大段的文字换成标题性的、吸引人的文字,将单项内容交给分支页面去表达,这才显得页面精炼。也就是说,首先要让访问者一眼应能了解到这个网站能提供什么信息,使访问者有一个基本的认识,并且有继续浏览的兴趣。要细心周全,不要遗漏内容,还要为扩容留出空间。分支页面内容要相对独立,切忌重复,导航功能要好。网页文件命名开头不能使用运算符、汉字等,分支页面的文件存放于自己单独的文件夹中,图形文件存放于单独的图形文件夹中。

1.2.1 明确建设网站的目的

建立网站之前,要有明确的目的,即所要建立的网站的作用是什么,服务的对象是哪些群体,要为浏览者提供怎样的服务,只有找准了网站的定位,才可能建成一个成功的网站。

1.2.2 进行可行性分析

可行性分析就是分析是否有能力、财力建设和维护这个网站;分析网站建成以后是否有一定的经济效益或社会效益;分析网站建设需要花费多少时间、精力、人力,性价比是否合算。

1.2.3 网站的内容设计

建设网站就要为用户服务的,根据网站建设的目的,分析浏览者的需求,确定网站的内容。例如一个电子商务网站,就要根据消费者的需求、购买力、购买习惯等要素设计网站每个网页功能,以满足客户的需要。

1.2.4 网站的表现形式设计

有了好的内容,还要有好的表现形式,这就是网站本身的设计。例如设计网站的CI标志、网站的文字排版、平面设计、三维立体设计、静态无声图文、动态有声影像等。

1.2.5 技术需求

提供网站建设的技术综述。利用什么样的工具,运用什么样的语言。例如HTML、JavaScript、ASP等。

2 设计布局

布局就是以最适合浏览的方式将图片和文字编排在网页的不同位置,使得浏览者的视觉效果与使用效果达到最佳状态。网页的整体布局在网站设计中占据着关键的位置,起着主导作用。

网页设计首先涉及到的就是网页的编排问题。网页作为一种版面,有文字和图片。而文字有大有小,有标题与正文之分;图片也有大小,有横幅与竖条之别。文字和图片要同时展示给浏览者。如果只是把它们简单的罗列到一个页面上,会使得页面零乱不堪。因此必须根据内容需求,将文字和图片按照一定的次序进行合理的编排和布局,使它们组成一个有机整体,展示给浏览者。

2.1 布局设计元素

网页布局设计就是在有限的空间内,合理安排组成网页的各种元素的位置,使页面美观,达到最好的视觉效果和艺术效果,把网页要表达的信息有效地传达给浏览者。网页布局必须以网站主题和页面内容为依据,以准确、有效的表达信息为目标,达到形式与内容的统一。一般网页都包含页面标题、网站标志、页眉、导航栏、内容版块和页脚等部分。

2.1.1 网页标题

每个网页都有一个标题,用于标识网页,指示网页的主要内容。网页标题显示在浏览器窗口的标题栏中。在设计网页时,网页制作软件一般自动为网页文件指定“未命名”作为网页的默认标题。显然, 这样的标题是毫无意义的。在设计网页时,应该养成给网页指定标题的习惯,使浏览者看到标题就能了解网页的主题内容。

2.1.2 网站标志(LOGO)

LOGO是网站特色和内涵的集中体现。如果是企业的网站,网站标志常常采用企业的标志或者注册商标。一个好的LOGO可以给浏览者留下深刻的印象,在网站和企业的宣传推广方面起着十分重要的作用,一看见LOGO就能联想起该网站。

2.1.3 网页页眉

页眉指页面的顶端,通常水平放置于导航栏上面。有些网页的页眉比较明显,有些网页则没有明确的划分,有的甚至没有页眉。通常,页眉左边放置LOGO,右边往往安排网页的服务宗旨或者广告口号,或者放置商业广告。页眉是浏览者打开网页首先看到的部分,一些商业网站大多作为广告们出租,可谓黄金位置。页眉的设计风格应该与页面的整体风格协调一致。设计独到的页眉也可以像LOGO一样,起到标识网站的作用。

2.1.4 网页导航栏

导航栏是网页的重要组成元素,它的任务是帮助浏览者在站点内快捷查找信息。好的导航系统应该能够引导浏览者尽情浏览网页而不会迷失方向导航栏的形式多种多样,可以是简单的文字链接,也可以是设计精美的图片,或者是形态多变的按钮,还可以是拥有下拉菜单的导航系统。导航栏在页面中的位置相对不定,一般分布在页面上、下、左、右,在页面上部的居多。设计自由的页面,导航栏的放置位置比较灵活。

2.1.5 网页内容版块

内容版块是页面的主体,往往根据内容的多少划分为几个栏目。每个栏目中放置内容标题的链接或者内容摘要,具体内容包括文字、图像、动画等。页面的内容才是浏览者关注的根本目标。拥有丰富的内容,才能吸引众多的浏览者。因此,对应内容版块应该合理安排、精心设计。

2.1.6 网页页脚

页脚指页面的底端部分,通常放置版权信息、联系方法,有时也把导航栏、友情链接安排在页脚位置。

2.2 布局设计的过程

布局设计的过程也就是一个创意的过程,在设计的过程中把布局设计元素合理化、有序化地应用到网页的制作和编排上,达到点、线、面相互穿插,相互衬托。布局设计过程比起整个网站的设计要容易得多、有规律得多,它可分为以下6个阶段。

2.2.1 网页方案设计

方案设计就是在布局设计前,对网页的整体布局进行的构思,画出页面的结构草图。在这个阶段,可以借鉴他人的布局设计经验,参考他人的布局结构吸取精华融入到自己的整体构思中。充分发挥自己的艺术想像力,结合网页素材,进行整合创作。

2.2.2 初步网页设计

初步设计是在方案设计的基础上,确定如何把功能模块安排到页面上。功能模块主要指网站标志、导航栏、动态新闻、搜索、留言板、交流论坛、版权信息等。在这个阶段必须遵循主次分明、突出重点、平衡协调的原则,将网站标志、导航栏等重要模块放在最醒目的位置,然后再考虑其他模块的排放。

2.2.3 网页技术设计

技术设计的主要任务是在初步设计的基础上,进行草图细化和方案确定,在绘制出的草图上,具体运用页面元素,包括网站标志、导航栏等。进一步解决各部分的技术问题,在确定了功能模块的大致位置后,需要对网站标志、导航栏和背景图片进行设计,然后把设计好的模块放在初步设计中确定的位置上。

2.2.4 网页定案设计

将初步的页面布局精细化、具体化,也就是一个调整的阶段。如网页的颜色搭配,文字和图片是否搭配平衡等。

2.2.5 网页量化描述

量化描述就是确定各种页面元素的具体大小。主要包括以下几种:

网页外形大小网页外形大小受计算机显示器的大小和分辨率制约。

图片大小:图片大小应该根据具体的布局要求确定,以像素为单位。

字体大小:指定网页文本,如标题文字、段落文字大小。

色彩搭配:在网页的制作过程中往往采用多种颜色搭配,包括背景颜色、文字颜色等。

网页文件大小:初步估计网页文件的大小,一般应该控制在500KB左右。因为网页文件过大会影响下载速度。

2.2.6 网页方案实施

根据上面几个阶段确定的网页布局方案使用网页编辑软件(如Dreamweaver)和图像处理软件(如Photoshop)进行布局设计。Internet上的网页风格万千。常见布局类型有同型布局、框架布局、自由式布局等。

网站的规划、设计看起来很简单,但要制作出真正有创意、精美的网站不是件容易的事情。它需要我们不断的实践,不断的学习,不断的丰富、创新网页制作的方法,不断完善、提高自己网站设计的能力。