Download presentation
Presentation is loading. Please wait.
Published by确 姬 Modified 7年之前
1
第3章 网站系统设计 根据系统分析阶段所提出的可行性方案,在网站的系统设计阶段,应充分考虑到网站信息组织、网站管理和维护、网站经营的特点及需要,使系统的成本投入尽可能低,并容易实现。同时,网站设计还要充分考虑网站的扩展及延伸,为企业最终应用提供良好的环境和平台。 3.1 系统设计概述 系统设计是在系统分析的基础上,根据系统分析阶段所提出的新系统逻辑模型,建立起新系统的物理模型。具体地说,就是根据新系统逻辑模型所提出的各项功能要求,结合实际的设计条件,详细地设计出新系统的处理流程和基本结构,并为系统实施阶段的各项工作准备好全部必要的技术资料和有关文件。
2
第3章 网站系统设计 网站系统设计过程中,系统的处理流程和基本结构主要体现在设计流程计划中,该计划是自系统分析之后更为详细的设计指导书。 一般来说,在设计流程计划中,主要包括网站目标细化、确定网站要素和网站设计三部分内容。 1. 网站目标细化 网站目标细化是根据网站系统分析的目标,按照项目管理的方法,将系统分析阶段的目标再次细化,分阶段、分步骤予以实施。这里,根据网站建设的项目特点,详细设计出项目真正运作的相关要素,它包括网站系统每个项目阶段的国标、内容和人员安排,以及最终提交的文件材料。
3
第3章 网站系统设计 2. 确定网站要素 确定网站要素包括明确网站内容结构(如栏目名称、内容),网站功能需求(如交互机制)和网站表现形式(如色彩搭配、字号选择),还应包括确定网站对象和网站提供哪些服务等内容。 3. 网站设计 网站设计的内容非常多,大体分三方面: 首先是纯网站本身的设计,例如文字排版、图片制作、平面设计、三维立体设计、静态无声图文、动态有声影像等。 其次是网站的延伸设计,包括网站的主题特征设计、智能交互、制作策划、形象包装、宣传营销等。
4
第3章 网站系统设计 第三,站点采用的网络、数据库等技术也是保证网站最终良好运行的关键。 系统设计阶段是开发网站系统的关键环节之一,它的工作质量直接关系到新系统的质量和经济效益。因此,整个系统设计过程的各项工作都必须按照科学的方法和程序进行。下面就系统设计的目标、系统设计的原则、系统设计的内容和步骤等问题分别加以讨论。 系统设计的目标 系统设计的基本目标就是要使所设计的系统必须满足系统逻辑模型的各项功能要求。同时,还要尽可能地提高系统的性能。系统设计的目标是评价和衡量系统设计方案优劣的基本标准,也是选择系统设计方案的主要依据。
5
第3章 网站系统设计 评价和衡量系统设计目标实现程度的指标主要有以下五方面。 1. 系统的可靠性 系统的可靠性是指系统在正常运行时对各种外界干扰的抵御能力。这是对系统的基本要求,也是系统设计时必须首先要解决的主要问题。系统在工作时,可能会遇到各种各样的外界因素的影响和干扰,这些影响和干扰,有些是意外的操作错误,有些则是外界不可控因素造成的。 如果在系统设计时,对所有可能发生的这些情况都有所考虑,并采取相应的防范措施,则系统就会有较高的可靠性。反之,如果对可能发生的外界干扰因素考虑不周,就会在意外情况发生时,措手不及,造成严重的后果。
6
第3章 网站系统设计 电子商务站点的用户界面给人的最初印象往往比较简单,但就是在这些简单的界面背后,却隐藏着一些复杂的计算机系统,用来维护这些站点以保证其处于高峰状态下的性能。像亚马逊书店的Web页面或者PC零售商.Dell的在线站点也都使人容易忽视这样一个事实:大型、有规律的服务器和复杂的负载平衡软件在有条不紊地运转着,具有容错功能的代理软件时刻准备着处理用户的Web请求、数据库访问请求,以及读取高速缓存中的数据和向网络路由器发送各种各样的数据包请求。 提高系统的可靠性可以从系统的硬件、软件和运行环境三方面来考虑。 (1)硬件主要指选用可靠性较高的设备。 (2)软件指在程序中设置各种检验措施,以防止误操作和非法使用。
7
第3章 网站系统设计 (3)系统运行环境指对系统的硬件和软件的各种安全保障措施、操作的规章制度等。在开发电子商务软件中,尤其是大型系统,要考虑到认证体系、支付方式、安全保护、物流配送、Internet的基础设施等环节中可能存在的问题。主要包括: ①在考虑认证体系时,应与银行系统合作,建立具有公正、权威的金融认证中心,并给软件预留接口,这样,开发出的软件才具有可扩充性。 ②软件在支付方面,可考虑多种支付方式,例如邮局汇款、银行划拨、一卡通、信用卡等。这样的软件当客户使用时,才显得灵活、方便。 ③要考虑现行的Internet网络资源的带宽与运行速度。
8
第3章 网站系统设计 2. 系统的可维护性 系统的可维护性是指系统的可变更或可修改性。系统投入运行以后,由于系统的环境和条件是在不断地发展和变化的,所以不可避免地会逐渐暴露出设计上的缺陷和功能上不完善,以及在使用过程中出现的硬件故障和软件故障等情况。因此,系统就需要不断地修改和完善,以适应用户的使用要求。而对系统修改的难易程度,主要取决于系统硬件的可扩充性、兼容性和售后服务质量:系统软件的可操作性、先进性和版本升级的可能性:数据存储结构规范化程度及方便性;应用软件的设计方式等方面的因素。如果对应用软件采用结构化设计方法,将会增加系统模块的独立性,使系统的结构清晰,便于维护和修改,从而可以提高系统的适应性。
9
第3章 网站系统设计 Web应用服务器、HTTP服务器和数据库的自然性能是决定客户满意度及系统未来可伸缩性的关键因素。缓慢的响应时间将会挫伤用户的积极性,且会影响交易处理通道中的数据流动,甚至会波及到包括网络连接在内的后台办公系统中的其他组件。不过,对于在任何给定时间内都要处理数以千计的Web应用请求,而且每天要响应十几万个页面浏览的电子商务站点来说,要获得峰值性能同时还要顾及到将来的发展需要,这的确是一个棘手的问题。 随着网络时代的到来,计算机已由简单的数据计算、处理,发展到今天的多媒体处理。在选择开发工具时,如当今流行的Java、VB、C++等,一定要考虑多媒体、Internet、Intranet环境。在选择数据库时,例如SQLServer7.0、Oracle8.2forWindowsNT、DB2、Informix等,也要考虑兼容性。好的开发工具,对软件的升级是比较容易的。应该时刻注意网站的运行状况,性能很好的主机随着访问人数的增加,可能会运行缓慢。但是,如果我们不想失去访问者的话,一定要仔细计划好设备及软件的升级计划。
10
第3章 网站系统设计 3. 系统的效率 系统的工作效率可以用对处理请求的响应时间或单位时间内处理的业务量来衡量。由于系统所选择的工作方式不同,其工作效率的含义也不相同。如联机实时处理系统的工作效率为对处理请求的响应时间:而批处理系统则为单位时间内平均处理的业务量。这里需要指出的是,系统的工作效率和计算机的效率是有一定区别的。 —般来讲,影响系统工作效率的主要因素有:硬件的运行速度,软件系统的性能,参数的设置情况,应用软件结构设计的合理性及中间文件调用的次数和数量等。 好的Web站点也无法避免会出现问题。幸运的是,有工具能够对在线内容方面的问题进行检测及修复。就商业网络站点而言,运行的可靠性、效率及可维护性与硬件设施同样重要。对顾客来说,在线时遇到冗长的处理程序、慢吞吞的服务、缺货以及帮助等信息的匮乏与现实世界中的类似问题一样令人难受。
11
第3章 网站系统设计 4. 系统的通用性 系统的通用性是指同一软件系统在不同使用单位的可应用程度。系统的通用性好,可以保证当系统的使用条件发生变化时,该系统不经变动或经少量变动后,仍能完成预定的使用功能。 对于一般的用户来说,都希望有成熟的软件系统不经修改或经过少量修改后就可以适用于本单位。因此,提高软件系统的通用性,可以扩大它的应用范围,降低研究成本,减少系统扩展时的工作量和费用,增强系统的生命力。影响系统通用性的主要因素是系统功能的完善程度和处理业务的规范化、标准化程度。 开发通用的商务软件与专用的商务软件不同。专用的商务软件只是在某一行业中使用,而通用的商务软件,例如批发零售业电子商务软件、人事软件、财务软件、工资软件,此类软件在开发之前,必须拿出完善的系统需求说明书和分析报告,考虑不同行业的管理方式和商业运作模式,只有这样,软件才容易推广、普及和逐步提高档次。
12
第3章 网站系统设计 5. 系统的工作质量 系统的工作质量是指系统处理数据的准确性,输出各种信息的易读、易懂性,系统操作的方便性等。系统的工作质量和系统的硬件设备及软件设计质量有直接关系。 硬件设备是系统工作的基础,然而硬件设备作用的发挥必须有高质量的软件设计做保证。系统设计阶段的各项工作几乎都与系统的工作质量有关,系统的工作质量直接影响系统的使用效果。在系统设计时,既要考虑到实现系统功能的要求,又要考虑到使用者的要求和反应。 上述评价系统性能的指标是互相联系、互相制约的。在某些条件下,它们是互相矛盾的,但是在另外一些条件下,它们又可能是彼此促进的。例如,对系统的可靠性和工作效率来说,为了提高系统的可靠性,就需要增加校验功能和对错误情况的处理功能,这势必要延长系统的处理时间,似乎降低了系统的工作效率。但是从另一方面看,如果系统的可靠性提高厂,则能保证系统长时间安全运行而不中断,实际的效率可能并不低。
13
第3章 网站系统设计 因此,系统设计人员必须根据具体系统的目标要求和实际情况,权衡利弊后,再决定将哪个指标放在主要位置上加以考虑,哪一个应该放在次要位置上考虑。一般情况下,系统设计人员往往要把系统的可维护性看得更重要一些。 系统设计的原则 系统设计的总原则是保证系统设计目标的实现,并在此基础上,使技术资源的运用达到最佳。具体地说,对系统设计的要求一般包括以下五方面。 1. 简单性原则 简单性原则是指在达到系统预定目标的条件下,应该使系统尽量简单、适用。一般来说,用户总是希望得到一个操作简单、使用方便、功能完善、易于维护和修改的系统。因此在系统设计过程中,必须考虑到尽量使数据处理过程简化。要使输入的数据尽可能减少使输入数据的形式易于理解和掌握,系统结构要清晰、合理,尽量避免不必要的复杂化,以满足用户在操作和维护方面的需求。
14
第3章 网站系统设计 2. 经济性原则 经济性原则是指在设计过程中尽可能地降低系统的设计成本,减少不必要的费用支出。这里既要考虑到实现系统的费用,又要考虑到系统实现后的运行费用。因为用户投入一定的资金获得一个系统后,就是通过系统的运行带来一定的经济效益,使用户对系统的投资和经营费用得到补偿。当然,在考虑系统的经济效益时,既要考虑它带来的直接效益,也要考虑到它的间接效益。 目前,对一般中小企业来讲,只需较少投入就可建立、维护一个具有相当水准的站点,并通过各种运营策略来吸引众多用户的访问。那么,到底建一个网站要花多少钱呢?这个问题没有标准答案,完全视企业的建站目的、要求水准与使用技术而定。企业可以像个人主页一样,挂在任何免费虚拟空间上,只需花一千多元就可建—个网站:企业也可以大张旗鼓、拉专线、架服务器、买商用软件、请顾问公司、委托网站设计人员、成立专门维护小组,花几十万甚至几百万,建设与维护自己的网站。
15
第3章 网站系统设计 3. 完整性原则 系统是一个有机的整体,应该具有一定的整体性。因此,在系统设计时,必须保持它的功能完整,联系密切。要使整个系统有统一的信息代码、统一的数据组织方法、统一的设计规范和标准,以此来提高系统的设计质量。 4. 可靠性原则 可靠性既是评价系统设计质量的一个重要指标,又是系统设计的一个基本出发点。只有设计出的系统是安全可靠的,才能在实际运行中发挥出它应有的作用。因此在系统设计过程中,必须考虑到对各种不安全因素抵御能力的设计。例如,对错误数据检错纠错能力设计,出现意外情况后系统恢复能力设计等。 5. 管理可接受的原则 在系统设计时,除了要考虑到以上几条基本原则以外,还要考虑在管理上可以接受的程度。一个系统是否能发挥作用和具有较强的生命力,很大程度上取决于管理上是否可以接受。
16
第3章 网站系统设计 这要受到用户的业务类型、用户的基础工作、用户的人员素质、人机界面的友好程度、掌握系统操作的难易程度、系统的适用范围和使用条件等诸多因素的影响。因此在系统设计时,必须充分考虑到这些因素,使设计出的系统能够容易被用户接受。 以上是系统设计的一些基本原则。除此之外,还要根据系统设计的具体目标和条件,考虑一些具体设计要求和原则。 系统设计的内容和步骤 系统设计过程分为初步设计和详细设计两个阶段。初步设计阶段的主要任务是完成对系统总体结构和基本框架的设计,例如系统结构设计、处理流程图设计、代码设计、输入输出设计、数据文件和数据库设计等内容。在初步设计工作完成后,设计人员要向用户和有关部门写出详细报告,说明设计方案的可行程度和更改情况,得到批准后转入详细设计。
17
第3章 网站系统设计 详细设计阶段的主要任务是在初步设计的基础上,将设计方案进一步详细化、条理化和规范化。如输入、输出格式的详细设计,处理流程图的详细设计,编写程序设计说明书等内容。 在实际系统设计工作中,以上两个阶段的内容是相与:交叉和关联的,设计过程中需要反复地进行。为了便于讨论,这里将系统设计两个阶段的工作内容归纳在一起,概括出下面的设计步骤: 1. 系统模块化结构设计 将系统划分为若干个子系统的工作,通常是在系统分析阶段或在总体结构设计中基本完成,但不够详细。此工作是在系统分析阶段对于系统划分的基础上,再进—步通过结构化设计方法,将其逐层分解成多个大小适当、功能单一、具有一定独立性的模块,以便于进行程序设计。
18
第3章 网站系统设计 2. 系统处理流程设计 即通过处理流程图的形式,将系统对数据的处理过程和数据在系统存储介质问的转换情况详细描述出来。它是系统物理模型的重要组成部分,也是进行程序设计的主要依据之一。 3. 代码设计 代码设计就是对系统中的数据进行编码,并使这种编码作为数据的 一个组成部分,用以代表客观存在的实体或属性,以保证它的惟一性,并便于计算机进行分类处理。 4. 输入输出设计 它主要是指对以记录为单位的各种输入、输出报表格式的详细描述。另外,人机对话格式的设计以及对输入、输出设备的考虑也在这一步完成。
19
第3章 网站系统设计 5. 数据文件和数据库设计 它主要是根据系统分析阶段所得到的数据关系集和数
第3章 网站系统设计 5. 数据文件和数据库设计 它主要是根据系统分析阶段所得到的数据关系集和数 据字典,再结合系统处理流程图,可以进行数据文件结构的标准化设计和进行数据库设计。 6. 网络及数据通信接口设计 根据系统中用户的终端数目和地理分布情况,以及对通信量和通信速度的要求,选择最佳的系统规模,提出对网络的基本要求,并进行网络和数据通信接口设计。 7. 系统标准化设计 它是指对各类数据编码要符合标准化要求,对各类文件的命名及对各类图表的绘制等都要按照一定的规范和标准进行。另外,为了保证系统能够安全可靠地运行,还要考虑对系统的可靠性和数据的保密性进行设计。
20
第3章 网站系统设计 8. 程序流程设计 它是根据模块的功能和系统处理流程图的要求,设计出程序框图,为程序员进行程序设计提供依据。在这一步设计中,也可以结合运用结构式语言等工具,来更清楚地描述出程序的功能和结构。 9. 描述系统设计结果 系统设计的最终结果是系统设计说明书、程序设计说明书、系统测试说明书以及各种图表等,要将它们分门别类汇集成册,送交有关人员和部门审核批准。 10. 拟定实施方案 在系统设计结果得到有关人员和部门认可之后,就可以拟定新系统实施计划,详细地制定出实施阶段的工作内容、时间安排和具体要求。实施方案经过批准后,就可以正式转入实施阶段。
21
第3章 网站系统设计 3.2 结构化设计的原理 为了使系统结构设计工作能够更加科学化,从20世纪70年代以来,出现了许多种先进的系统结构设计方法,具有代表性的有杰克逊方法、帕纳斯方法、结构化设计方法等,在众多的系统结构设计方法中,结构化设计方法是应用比较广泛并且比较受重视的一种。 结构化设计的原理 结构化设计方法的基本思想是使系统模块化,即把一个系统白上而下、逐步分解为若干个彼此独立而又有一定联系的组成部分,这些组成部分称为模块。对十任何一个系统都可以按功能逐步由上向下、由抽象到具体,逐层将其分解为一个多层次的、具有相对独立功能的模块所组成的系统。在这一基本思想的指导下,系统设计人员以逻辑模型为基础,并借助十一套标准的设计准则和图表等工具,逐层地将系统分解成多个大小适当、功能单一、具有—定独立性的模块,把一个复杂的系统转换成易于实现、易十维护的模块化结构系统。
22
第3章 网站系统设计 结构化设计的工作过程可以分为两步:第一步是根据数据流程图导出系统初始结构图;第二步是对结构图的反复改进过程。
第3章 网站系统设计 结构化设计的工作过程可以分为两步:第一步是根据数据流程图导出系统初始结构图;第二步是对结构图的反复改进过程。 因此,系统结构图是结构化设计的主要工具,它不仅可以表示系统的层次结构关系,而且还反映了模块的调用关系和模块之间数据流的传递关系等特性。 模块划分的标准 结构化设计要解决的主要问题是把系统分解成一个个模块,并用结构图的形式表达出其内在的联系。模块划分的是否合理,直接影响到系统设计的质量,影响系统开发的时间、开发成本以及系统实施和维护的方便程度等方面。 为了能够合理地划分系统的各个模块,使其具有较强的独立性,在划分模块时要遵循的总原则是:尽量把密切相关的子问题划归到同一模块;把小相关的了问题划归到系统的不同模块。衡量系统的结构化程度及模块的独立性,可以通过模块与模块之间的关联度和模块内部各个组成部分之间的聚合度两条标准来进行评价。
23
第3章 网站系统设计 1. 模块之间的关联度 模块之间的关联度是用来表示一个模块与其他模块之叫联系的紧密程度。关联度越低,则说明模块之叫的联系越少,模块的独立性就越强,就越容易独立地进行编程、调试和修改,某个模块中产生的错误对其他模块的影响也就越小。对于模块之间的关联度,可以从以下三方面来衡量和评价。 (1)模块之间的联系方式 如果一个模块直接调用另一个模块内部的数据或指令,这说明被调用模块内含有多方面不相关的内容,导致模块间联系增多,修改—个模块将直接影响其他的模块,降低了模块的独立性。在系统设计中,应尽量避免使用这种联系方式,另一种联系方式是通过被调用模块的名称来调用整个模块,使其完成一定的功能,这样可以降低模块问的联系,增加其独立性。
24
第3章 网站系统设计 (2)模块之间使用控制信息的数量
第3章 网站系统设计 (2)模块之间使用控制信息的数量 控制信息是指控制程序运行过程的信息,在程序调用过程中过多地使用控制信息,必然会增加模块之间的联系,影响模块的独立性。因此,在模块之间应尽量不用或少用控制信息。当需要在模块之间使用含有控制信息的调用关系时,可以通过功能分解的形式消除控制信息的影响。 (3)模块之间传送数据的数量 模块之间通过调用关系传送数据,是一种较理想的联系方式。但是,如果模块之间传送的数据过多,同样会给理解和修改模块带来困难,且降低系统的可维护性。一个模块同其他模块之间传递的数据越少,模块间的相互独立性就越强,也就越便于系统的设计和维护。 要降低模块之间的关联度,除了从以上几方面考虑之外,还可以从模块界面的清晰性来考虑,模块之间的界面越简单、清晰、易于理解,关联度越低,模块的独立性也就越强。
25
第3章 网站系统设计 2. 模块内部的聚合度 模块内部的聚合度是用来描述和评价模块内部各个组成部分之间联系的紧密程度。—个模块内部的各种组成部分之间联系的越密切,其聚合度越高,模块的独立性也就越强。模块的聚合度是由模块的聚合方式决定的。 根据模块内部的构成情况,其聚合方式可以分成以下七种形式。 (1)偶然性聚合 将几个毫无联系的功能组合在—起,形成一个模块,称为偶然性聚合模块。这种模块内部的各个组成部分之间几乎没有什么联系,只是为节省存储空间或提高运算速度而结合在一起,因此聚合度最低。 (2)逻辑性聚合 将几个逻辑上相似,但彼此并无联系的功能组合在一起所形成的模块,称为逻辑性聚合模块。这种聚合形式,其聚合度也非常低,模块中的各种功能要通过控制变量选择执行。
26
第3章 网站系统设计 (3)时间性聚合 将几个需要在同一时段进行处理的各项功能组合在一起所形成的模块,称为时间性聚合模块。如系统的初始化模块、结束处理模块等,可以考虑采用时间性聚合方式。 (4)过程性聚合 将为了完成某项业务处理过程,将执行条件受同一控制流支配的若干个功能组合在一起所形成的模块,称为过程性聚合模块。这类模块的聚合度较前几种要高一些。 (5)数据性聚合 将对同一数据加工处理的若干个功能组合在一起所形成的模块,称为数据性聚合模块。这种模块能合理地定义功能,结构也比较清楚,因此其聚合度较高。
27
第3章 网站系统设计 (6)顺序性聚合 把若干个顺序执行的、一个处理的输出是另一个处理的输入的功能组合在一起所构成的模块,称为顺序性聚合模块。这种模块的聚合度要更高一些。 (7)功能性聚合 为了完成一项具体任务,由简单处理功能所组成的模块,称为功能性聚合模块。这种模块功能单一,内部联系紧密,易于编程、调试和修改。因此,其独立性最强,聚合度也最高。 在上述七种模块聚合方式中,其聚合度是依次升高的。由于功能性聚合模块的聚合度最高,所以在划分模块的过程中,首先应尽量采用功能性聚合方式;其次,根据需要可以适当考虑采用顺序性聚合或数据性聚合方式,但要避免采用偶然性聚合和逻辑性聚合方式,以提高系统的设计。
28
第3章 网站系统设计 3.3 Web站点的结构化设计 企业网站作为一类特殊的信息系统,在系统设计时,应当遵循上面介绍的系统设计的总体思想和原则。同时,由于它的特殊性,在进行站点系统设计时,根据该类系统的自身特点,还应当把握下面一些要点。 Web站点的设计原则 在当前的Internet应用中,很多企业纷纷建立自己的网站,但由于对于网站的认识还不够深入,多数企业并不知道自己的网站能干什么,更不了解网站设计需要把握的规律。一些企业甚至只发一二页内容也算是建了一个网站,而且其信息从不更新。其实,要设计一个有吸引力的网站,至少应该遵循下述一些基本原则。
29
第3章 网站系统设计 1. 安全快速访问 足够的带宽是快速访问的保证。很多单位的管理人员喜欢把服务器放到自己的单位,以为这样的做法保险、安全,其实这样所带来的直接后果就是带宽问题。因为带宽和租费是成正比的,要想租一条1Mbps以上的DDN专线,一般单位都会承受不起,所以很多单位只租用64Kbps的DDN,充其量达到128Kbps。这样的速率对于只有30页以下的小站还可以应付,但对于300页以上的网站,每天只有5000次以上的访问量,这个速率就显得很低了。 有稳定的、全天24小时、全年365天都可以连续工作的服务器也至关重要。网站管理员最头痛的就是服务器死机、病毒发作等问题。北京电报局的信息服务机房里现在已放置了上百台服务器,其中60%~70%是基于高档计算机的NT服务器。据调查,这些服务器的故障率很高。对于一些专用服务器,如Sun、Apple等服务器,这类问题可能要少些。
30
第3章 网站系统设计 2. 及时更新信息 网站信息必须经常更新。在网站建设的初期,很多人错误地认为,要想让网站吸引住浏览者,就—定要把主页的设计尽量做得漂亮。但随着网站建设的发展,人们越来越清楚地认识到,这种看法有极大的片面性。主页设计得好,自然会吸引人们的注意,但这种吸引是暂时的,要想长期吸引住浏览者,最终还是靠网站内容的不断更新。 每次更新的网页内容尽量要在主页中提示给浏览者。由于网站内容的结构一般都是树形结构,所有文章都包含在各级版块或栏目里。因此,如果每次更新的网页内容全都被放进了各级版块和栏目中,浏览者并不知道更新了哪些东西,如果让用户到版块或栏目中去查找,不是一个好的方法。所以在这种情况下,一定要在首级主页中显示出最新更新的网页目录,以便于访问者浏览。
31
第3章 网站系统设计 3. 完善检索能力 对于一个网站来说,如何合理地组织自己要发布的信息内容,以便让浏览者能够快速、准确地检索到要查寻的信息,这是一个网站是否成功的关键。如果当用户进入一个网站后不能迅速地找到自己要找的内容,那么这个网站就很难吸引住浏览者。 解决这个问题,通常可通过对网站内容的全中文检索来实现。如果一个网站只有几十页内容,则根本不用进行全中文检索,用遍历方法就可查洵。但如果—个网站有几百甚至几千个网页怎么办,遍历法显然不行。因此,从实际应用上,一定规模的网站一定要提供全中文的检索能力,以便于用户查找本网站的信息。 4. 网站的信息交互能力 如果一个网站只是为访问者提供浏览,而不能引导浏览者参与到网站内容的部分建设中去,那么它的吸引力是有限的。只有当浏览者能够很方便地和信息发布者相互交流,该网站的魅力才能充分体现出来。
32
第3章 网站系统设计 3.3.2 Web站点的设计要点 各种类型的web站点的设计侧重点不同,但总的说来有如下设计要点。
第3章 网站系统设计 Web站点的设计要点 各种类型的web站点的设计侧重点不同,但总的说来有如下设计要点。 1. 目标明确、定位正确 Web站点的设计是企业或机构发展战略的重要组成部分。想要将企业站点作为因特网这个新媒体上展示企业形象、企业文化的信息空间,领导一定要给予足够的重视,明确设计站点的目的和用户需求,从而做出切实可行的计划。 挑选与锤炼企业的关键信息,利用一个逻辑结构有序地组织起来,开发一个页面设计原型,选择用户代表来进行测试,并逐步精炼这个原型,形成创意。 分析有些网站的效果不如预想的好,主要原因是对用户的需求理解有偏差,缺少用户的检验造成的。设计者常常将企业的市场营销和商业目标放在首位,而对用户和潜在的用户的真正需求了解不多。
33
第3章 网站系统设计 所以,企业或机构应清楚地了解本网站的用户群体的基本情况,如受教育程度、收入水平、需要信息的范围及深度等,从而能够有的放矢。 2. 主题鲜明、富有特色 在目标明确的基础上,完成网站的构思创意即总体设计方案。对网站的整体风格和特色做出定位,规划网站的组织结构。 Web站点应针对所服务对象(机构或人)不同而具有不同的形式。有些站点只提供简洁文本信息;有些则采用多媒体表现手法,提供华丽的图像、闪烁的灯光、复杂的页面布置,甚至可以下载声音和录像片段。最好的Web站点将把图形图像表现手法与有效的组织与通信结合起来。 要做到主题鲜明突出,力求简洁,要点明确,以简单明确的语言和画面告诉大家本站点的主题,吸引对本站点有需求的人的视线,对无关的人员也能留下一定的印象。对于一些行业标志和公司的标志应充分加以利用。
34
第3章 网站系统设计 调动一切手段充分表现网站的个性和情趣,突出个性,办出网站的特色。 Web站点主页应具备的基本成分包括:
第3章 网站系统设计 调动一切手段充分表现网站的个性和情趣,突出个性,办出网站的特色。 Web站点主页应具备的基本成分包括: (1)页头:准确无误地标识你的站点和企业标志; (2) 地址:用来接收用户垂询; (3)联系信息:如普通邮件地址或电话; (4)版权信息。 注意重复利用已有信息,如客户手册、公共关系文档、技术手册和数据库等可以轻而易举地用到企业的Web站点中。 3. 版式编排布局合理 网页设计作为一种视觉语言,当然要讲究编排和布局,虽然主页的设计不等同于平面设计,但它们有许多相近之处,应充分加以利用和借鉴。
35
第3章 网站系统设计 版式设计通过文字图形的空间组合,表达出和谐与美。版式设计通过视觉要素的理性分析,和严格的形式构成训练,培养对整体画面的把握能力和审美能力。一个优秀的网页设计者也应该知道哪一段文字、图形该落于何处,才能使整个网页生辉。 努力做到整体布局合理化、有序化、整体化。优秀之作,善于以巧妙、合理的视觉方式使一些语言无法表达的思想得以阐述,做到丰富多样而又简洁明了。 多页面站点页面的编排设计要求把页面之间的有机联系反映出来,这里主要的问题是页面之间和页面内的秩序与内容的关系。为了达到最佳的视觉表现效果,应讲究整体布局的合理性。特别是关系十分紧密的有上下文关系的页面,一定要设计向前和向后的按钮,便于浏览者仔细研读。
36
第3章 网站系统设计 站点设计简单有序,主次关系分明,将零乱页面的组织过程混杂的内容依整体布局的需要进行分组归纳,经过进行具有内在联系的组织排列,反复推敲文字、图形与空间的关系,使浏览者有一个流畅的视觉体验。 4. 色彩和谐重点突出 色调及黑、白、灰的三色空间关系不论在设计还是在绘画方面都起着重要的作用。在页面上一定得明确、协调、和谐,而其它有色或无色的内容均属黑、白、灰的三色空间关系,从而构成它们的空间层次。 色彩是艺术表现的要素之一,它是光刺激眼睛再传导到大脑中枢而产生的一种感觉。在网页设计中,根据和谐、均衡和重点突出的原则,将不同的色彩进行组合、搭配来构成美丽的页面。
37
第3章 网站系统设计 利用色彩对人们心理的影响的成果,合理地加以运用。按照色彩的记忆性原则,一般暖色较冷色的记忆性强。色彩还具有联想与象征的特质,如:红色象征火、血、太阳;蓝色象征大海、天空和水面等。所以设计出售冷食的虚拟店面,应使用消极而沉静的颜色,使人心理上感觉凉爽一些。 在色彩的运用过程中,还应注意的一个问题是:由于国家和种族的不同,宗教和信仰的不同,生活的地理位置、文化修养的差异,不同的人群对色彩的喜恶程度有着很大差异。如:儿童喜欢对比强烈、个性鲜明的纯颜色;生活在草原上的人喜欢红色;生活在闹市中的人喜欢淡雅的颜色;生活在沙漠中的人喜欢绿色。在设计中要考虑主要读者群的背景和构成。
38
第3章 网站系统设计 5. 形式内容和谐统一 形式服务于内容,内容又为目的服务,形式与内容的统一是设计网页的基本原则之一。
第3章 网站系统设计 5. 形式内容和谐统一 形式服务于内容,内容又为目的服务,形式与内容的统一是设计网页的基本原则之一。 画面的组织原则中,将丰富的意义和多样的形式组织在一个统一的结构里,形式语言必须符合页面的内容,体现内容的丰富含义。 运用对比与调和,对称与平衡,节奏与韵律以及留白等手段,如通过空间、文字、图形之间的相互关系建立整体的均衡状态,产生和谐的美感。如对称原则在页面设计中,它的均衡有时会使页面显得呆板,但如果加入一些动感的文字、图案,或采用夸张的手法来表现内容往往会达到比较好的效果。 点、线、面是视觉语言中的基本元素,使用点、线、面的互相穿插、互相衬托、互相补充构成最佳的页面效果。
39
第3章 网站系统设计 (1)点是所有空间形态中最简洁的元素,也可以说是最活跃、最不安分的元素。设计中,一个点就可以包罗万象,体现设计者的无限心思,网页中的图标,单个图片,按钮或一团文字等都可以说是点。点是灵活多变的,我们可以将一排文字视为一个点,将一个图形视为一个点。在网页设计中的点,由于大小、形态、位置的不同而给人不同的心理感受。 (2)线是点移动的轨迹,线在编排设计中有强调、分割、导线,视觉线的作用。线会因方向、形态的不同而产生不同的视觉感受,例如垂直的线给人平稳、挺立的感觉,弧线使人感到流畅、轻盈;曲线使人跳动、不安。在页面中内容较多时,就需进行版面分割,通过线的分割保证页面良好的视觉秩序,页面在直线的分割下,产生和谐统一的美感;通过不同比例的空间分割,有时会产生空间层次韵律感。
40
第3章 网站系统设计 (3)面的形态除了规则的几何形体外,还有其它一些不规则的形态,可以说表现形式是多种多样的。面在平面设计中是点的扩大,线的重复形成的。面状给人以整体美感,使空间层次丰富,使单一的空间多元化,在表达较含蓄。 网页设计中点、线、面的运用并不是孤立的,很多时候都需要将它们结合起来,表达完美的设计意境。 6. 多媒体功能的利用 最大资源优势在于多媒体功能,因而要尽一切努力挖掘它,吸引浏览者保持注意力。因而画面的内容应当有一定的实用性,如产品的介绍甚至可以用三维动画来表现。 这里需要注意的问题是,由于网络带宽的限制,在使用多媒体的形式表现网页的内容时应考虑客户端的传输速度,或者说将多媒体的内容控制在用户可接收的下载时间内是十分必要的。
41
第3章 网站系统设计 7. 相关站点引导链接 一个好的网站的基本要素是用户进入后,与本网站相关的信息都可以方便快捷地找到,其中要借助于相关的站点,所以做好导引是一项重要的工作。超文本这种结构使全球所有联上因特网的计算机成为超大规模的信息库,链接到其它网站轻而易举。 在设计网页的导引组织时,应该给出多个相关网站的链接,使得用户感到想得到的信息就在鼠标马上就可以点击的地方。 8. 网站测试必不可少 为什么精心设计的网站是经得起推敲的,就是因为它经过认真细致的测试。测试实际上就是模拟用户访问网站的过程,得以发现问题改进设计。
42
第3章 网站系统设计 由于一般网站设计都是一些专业人员设计的,他们对计算机和网络有较深的理解,但要考虑到访问网站的大部分人只是使用计算机和网络,应切实满足他们的需要。所以有许多成功的经验表明,让对计算机不是很熟悉的人来参加网站的测试工作效果非常好,这些人会提出许多专业人员没有顾及到的问题或一些好的建议。 9. 合理地运用新技术 因特网是IT界发展最快的领域,其中新的网页制作技术几乎每天都会出现,如果不是介绍网络技术的专业站点,一定要合理地运用网页制作的新技术,切忌将网站变为一个制作网页的技术展台,永远记住用户方便快捷地得到所需要的信息是最重要的。 但对于网站设计者来说,必须学习跟踪掌握网页设计的新技术,如Java、DHTML、XML等,根据网站的内容和形式的需要合理地应用到设计中。
43
第3章 网站系统设计 要将企业站点作为在Internet上展示企业形象、企业文化的信息中间,有明确目标、良好定位的Web站点设计是企业或机构发展战略的重要组成部分。对此,主管部门一定要给予足够的重视,明确设计站点的目的和用户需求,从而做出切实可行的计划。挑选与锤炼企业的关键信息,利用逻辑结构有序地组织起来,并开发一个页面设计原型,选择代表性用户来进行测试,然后逐步精炼这个原型,最终形成创意。 Web站点的设计流程 在Web站点的设计阶段,主要包括以下设计工作。 1. 收集该站点的关键信息 它包括站点的目标客户、拟发布内容、Web服务器开发平台等。 2. 概念开发 设计人员根据收集的信息进行构思。通常,设计人员要把这些构思用草图的形式呈现给顾客代表,这个草图要有整个网站的结构、不同的布局设计及导航。
44
第3章 网站系统设计 3. 内容综合 设计人员开始制作一些初始图样,这些图样用诸如Photoshop的应用程序来创建,然后,设计人员将图样打印出来,配上文字说明。 4. HTML布局和导航 一旦客户同意了这些内容,设计人员开始编制Web页面,导航器也被编制到页面中,使客户有所体验。 5. 图形制作 如果客户同意了站点的外观和设计思想,设计人员将大量制作所需的图形,并进行优化。简洁明快、独具特色、保持统一的网站风格能让用户产生深刻印象,不断的来访问。优秀的网页画面少不了漂亮的图像,但更重要的是布局效果。网页布局采用的主要技术是HTML的表格(Table)和框架(Frame)功能。 6. 内容流程 客户的书面材料利用各种网页技术(如CSS、Java、Flash),使其内部流程有机地和相关的图形整合在一起。
45
第3章 网站系统设计 7. 测试 在站点被提交给客户之前,设计人员要全面测试每个Web页面和页面间的链接,利用清单进行修补。测试实际上就是模拟用户访问网站,从中得以发现问题改进设计。由于一般网站都是一些专业人员设计的,他们对计算机和网络有较深的理解,但要考虑到访问网站的大部分人只是使用计算机和网络。因此,网站应切实满足使用者的需要。许多成功的经验表明,让不是很熟悉计算机的人来参加网站的测试工作效果会非常好,这些人会提出许多专业人员没有顾及到的问题或一些好的建议。 8. 交付 一旦签收,用户要经常进行测试,找出排版和内容方面的错误,完成这些次要的修正后,就可正式启用站点。 这套完整的计划可以安排在一定时间内完成。当站点启用后,要进行跟踪调查,以确定人们如何使用站点。经过—段时间的试运行之后,收集数据,开始重新设计,将此Web设计过程再进一步完善。
46
第3章 网站系统设计 3.3.4 Web站点的基本模块 1. 站点结构图(Sitemap)
第3章 网站系统设计 Web站点的基本模块 1. 站点结构图(Sitemap) 站点结构图是一种有关站点结构、组织方式的示意图。各主要内容或题目的详细内容将被列在其下的副标题中。当访问者点击标题、题目或副标题时,相关的网页就会出现在屏幕当中。站点结构图还可以被视作是站点的分级结构图。以这种方式组织起来的信息可以使访问者迅速找到他所需要的信息所在位置。 站点结构图与导航栏的区别是:站点结构图可以而且也应该包括与导航栏类似的链接,供用户点击至相关网页,但它并不是一个单纯的导航工具。它的目的在于提供独守的、更详细的站点结构概况。 2. 导航栏(Navigation Bar) 当用户访问网站时,他们怎样从一个地方到另一个地方?怎样防止他们走丢?定义网站的导航系统可以解决这些问题。导航系统出现在网站的每页上,使用户很方便地在不同部分之间跳转。如果可能,把全局导航的元素限制在5-7个之间。另一种方法是把网站的商标(公司标志)加入全局导航系统作为返回网站首页的链接。
47
第3章 网站系统设计 局部导航可以有不同的形式,可以是主题的列表,例如YAHOO;可以是选项菜单的形式,例如Geo Cities中的members area:或者可以是一些相关条目的列表。 每个Web站点都应该包括一组导航工具,它出现在此站点的每—个页面中。导航栏中的按钮应该包括:主页、联系方式、反馈及其他—些用户感兴趣的内容。 这些内容应该与站点结构图中的主要题目相关联,设计导航栏应注意以下几点: (1)图表比单纯的文字效果更佳,但它必须能够清楚地体现出它所链接的内容。图表下应附有文字说明,以避免图像到达不清而引起的混淆。 (2)无任何链接的内容不要做成按钮的形式。 (3)使用常用颜色。避免在链接处使用特殊的颜色,应该使用标准、醒目的颜色。屏幕上显示的页面所对应的按钮应该相应变成灰色,或突出显示,或以其他方式表示出来。 (4)每个页面都应包括代表“返回”或“前进”的箭头。
48
第3章 网站系统设计 3. 联系方式页面(Contact Page)
第3章 网站系统设计 3. 联系方式页面(Contact Page) 创建可转到发送 信息屏幕的连接。网站的地址可以自动地出现在“收信人”栏中。这样,访问者在录入相关内容后,点击“发送”按钮,即可完成操作。此页面还应包括其他联系方式,例如通信地址及联系人、传真、电话号码等。在导航栏中应能很方便地找到这些信息。 4. 反馈表(Feedback Forms) 利用反馈表,访问者可以随时提出信息需求,而不必再打电话联系。反馈表还为那些没有 账号的用户提供了方便。每一个反馈对企业来说都是一个不断提高服务质量,以满足用户需求的机会。从反馈表中可以发现,在站点中哪些信息是重要的,哪些是无关紧要的。此外,还可以考虑加设消息栏,用户可以在此发表一些评论,提出他们所关心的问题。这不仅以使他们与企业保持联系,而且可以让他们互相之间进行交流。
49
第3章 网站系统设计 5. 引人入胜的内容(Compelling Content)
第3章 网站系统设计 5. 引人入胜的内容(Compelling Content) 在每页中都要包含相关的、引人入胜的内容。特别是当要销售某种产品的时候,每个页面都要用精心修饰的内容和图像。企业的目的是为了吸引普通用户,所以站点上所使用的语言也应该通俗易懂,并对专业用语及技术术语进行解释。可将特别重要的内容用符号标记出来,但不要用得过多,以保持页面的简洁,不要把站点建成单纯的网上公司介绍。 6. 常见问题解答(FAQ) 创建FAQ可以避免重复回答相同的问题,如果将问题列于FAQ页面的上部,并将每个问题与答案连接在一起,可以节省企业和访问者双方的时间和精力。须确认在导航栏中包含有FAQ按钮。 7. 精美的图像(Good Graphics) 图像不应使用过多,但要选择合适的、无需太多内存及下载时间的图像。有两种保持图像的方法:可以通过将图像保存为16色而不是256色来处理图像;也可以对每页的文字和图像进行限制。
50
第3章 网站系统设计 8. 相关站点链接(Relevant Links)
第3章 网站系统设计 8. 相关站点链接(Relevant Links) 成功的网站通常都可以链接到其他站点,以提供更多相关信息。对每个链接都要做简要说明,以帮助访问者选择最适合其需求的站点。企业需要对所链接站点做定期的访问,删除那些死站点,以免使访问者感到厌烦。每周维护一次就足够了,但要持之以恒。 3.4 网站设计的常用技术 Internet是发展最快的领域,新的网页制作技术几乎每天都会出现,企业站点应当合理地运用网页制作的新技术,不要将网站变为一个单纯制作网页的技术展台,记住用户方便、快捷地得到所需要的信息是最重要的。 常用网站设计技术 从技术上讲,设计站点并不十分困难。目前,有很多网页设计软件,例如Front Page 2000、Hotdog等,都可以帮助我们方便地设计制作网页。专业化网站建设更重要的意义体现在通过各种应用开发,实现数据库调用及多媒体信息播放等功能,进而完成网络营销站点中的交互功能。因此,网络设计者不仅从技术人员的角度来学习如何设计制作主页,更多的是要站在经营者的市场从事商业站点主页的设计。
51
第3章 网站系统设计 对于网站设计者来说,必须学习、跟踪、掌握网页设计的新技术,将站点功能有机地与内容结合起来。这实际上对网站设计者的素质要求极高,因为这是一个正在形成和蓬勃发展的新领域,几乎每天都会有新的技术和规范产生,具体的如Java、DHTML、XML、DOM等新技术,需要不断学习才能不落伍。为此,在建设网站时,就需要根据不同功能采取不同的设计技术。就目前的情况来看,企业网站的设计技术基本上有七种。 1. 网页设计技术 网页设计技术无疑是网站开发的基本功。网站是否美观大方,是否拥有强烈的视觉冲击力,与网页的设计技术密切相关。设计网页的技巧多种多样,各类参考书籍也是数不胜数。 2. 数据库技术 目前,数据库技术在网站设计上非常流行。事实上,一个网站如果没有数据库技术支持,它的维护成本会相当高昂。采用数据库技术的最大好处在两个方面:一是方便用户的浏览、查询检索以及统计比较等;二是容易进行信息、数据的更新,系统维护成本相对较低。数据库技术可以广泛应用于企业网站,常见的有:
52
第3章 网站系统设计 (1)新闻数据库系统。它可以使企业及时更新资料,并让用户迅速查阅关于企业的各项新闻动态资料。
第3章 网站系统设计 (1)新闻数据库系统。它可以使企业及时更新资料,并让用户迅速查阅关于企业的各项新闻动态资料。 (2)产品数据库系统。它可以集中进行企业产品的介绍、评价、导购、检索、网上订购和使用问答等等。 (3)调查数据库系统。它可以在网上进行服务调查、产品调查、形象调查、宣传调查等,并可以自动进行统计分析。 (4)用户数据库系统。它通过用户网上注册,可以提供良好的售后服务。 3. 表单回收技术 所谓的表单回收技术是指在网上设置一些表格,用户填写之后,可以自动反馈给企业。表单回收技术并不复杂,因而在Internet中应用非常广泛。特别是在企业网站的建设当中,少了表单回收技术,网站的功能就会大大逊色。
53
第3章 网站系统设计 企业网站应用的表单回收技术主要包括:用户的建议、投诉、人才招聘、招商合作、意见反馈等。 4. 邮件列表技术
第3章 网站系统设计 企业网站应用的表单回收技术主要包括:用户的建议、投诉、人才招聘、招商合作、意见反馈等。 4. 邮件列表技术 邮件列表(Mailing List)技术能够让用户及时订阅企业的最新资料或者网站的更新动态。如果企业希望更多的访问者留下联系信息的话,建议采用这一技术。 5. 全文检索技术 采用全文检索技术,可以让用户迅速查找到所需要的内容。如果企业网站比较大,应该使用这一技术。 6. 搜索引擎技术 这个技术可以把与企业相关的资料、网站集合在一起,从而使用户迅速查阅与企业产品、服务、权益等相关的各种资料。例如,企业的网站是彩电类的,应用搜索引擎技术,通过网站就可以链接到大量的与彩电知识相关的网站。这样的网站自然是特别容易受到用户的欢迎,这也是目前最为流行的“企业门户网站”概念。
54
第3章 网站系统设计 7. 电子商务技术 采用电子商务技术,可以实现网上的订购与交易功能,但由于此项技术涉及到资金的转移,因而难度很高,目前尚未形成气候。但此项技术将是企业网站的发展方向之一,所以在网站设计时应该留一个发展的余地。 理论上说,囊括了上述技术的网站无异将是非常出色的。但有一点:必须注意,如果全部采用上述技术,其投入的费用相当高。因此,在实际运作中,企业应该根据自己的实际情况和实际能力,量力而行。 在知识爆炸的信息时代,要想建立—个成功的网站,吸引大量的来访者,必须有快速的连接速度、丰富的内容和不断地更新,同时也要有一套完善的安全机制。这样除了完善对采编人员的管理机制外,网站的合理结构和高性能就成为决定性因素。 网站的性能包括网络性能(包括网络带宽、拓扑结构等),服务器性能(包括CPU、RAM等),系统软件性能(包括操作系统、Web服务器、数据库等),应用程序性能(包括程序结构、数据结构、算法效率等)。
55
第3章 网站系统设计 首页设计 首页设计是一个网站成功与否的关键。是否能够吸引浏览者留在站点上,是不是能够促使浏览者继续点击进入,全凭首页设计的效果。所以,首页的设计和制作是绝对要重视和花心思的。 从根本上说,首页就是全站内容的目录,也是一个索引。但只是罗列目录显然是不够的,如何设计好一个首页呢?这需要处理好以下两方面的工作。 1. 确定首页的功能模块 首页的内容模块是指在首页上需要实现的主要内容和功能。Web站点首页应具备的基本成分包括:页头,准确无误地标识企业的站点和标志; 地址,用来接收用户垂询;联系信息,如普通邮件地址或电话、版权信息。注意可重复利用已有的信息,例如客户手册、公共关系文档、技术手册和数据库等。 一般的站点都需要如下一些模块:网站名称(Logo)、广告条(Banner)、主菜单(Menu)、新闻(What's new)、搜索(Search)、友情链接(Links)、邮件列表(Mail List)、计数器(Count)、版权(Copyright)等。
56
第3章 网站系统设计 选择哪些模块,实现哪些功能,是否需要添加其他模块,这些都是首页设计首先需要确定的。 2. 设计首页的版面
第3章 网站系统设计 选择哪些模块,实现哪些功能,是否需要添加其他模块,这些都是首页设计首先需要确定的。 2. 设计首页的版面 在功能模块确定后,开始设计首页的版面。像搭积木一样,每个模块是一块积木,如何拼搭出一座漂亮的房子,就看设计者的创意和想象力了。 设计版面的最好方法是:找一张白纸、—支笔,先将理想中的草图勾勒出来,然后再用网页制作软件实现。在设计中,应避免“封面”问题。封面是指没有具体内容,只放一个标徽Logo点击进入,或者只有简单的图形菜单的首页。除非是艺术性很强的站点,或者确信内容独特足以吸引浏览者进一步点击进入的站点,否则的话,封面式的首页并不会给企业站点带来什么好处。用户上网浏览需要的是快速、有价值的信息,如果等待若干分钟,只显示出一个粗劣的“进入”图标,那么没有人会再耐心地等待进入下一页。
57
第3章 网站系统设计 网站内容的开发 Internet最大的资源优势在于它的多媒体功能,因而要尽一切努力开发挖掘,吸引浏览者保持注意力。因而网页画面的内容应当有一定的实用性,如产品的介绍可以用三维动画来表现。这里需要注意的问题是,由于网络带宽的限制,在使用多媒体形式表现网页的内容时,应考虑客户端的传输速度,或者说,应将多媒体的内容控制在用户可接收的下载时间内。 1. 协调页面元素的关系 网络上的三维空间是一个假想空间,这种空间关系需要借助动静变化、图像的比例关系等空间因素表现出来。 在页面中,图片、文字之间的前后位置及疏密程度所产生的视觉效果各不相同。在网页上,图片、文字前后叠压所构成的空间层次目前还不多见,常见的是一些设计得比较规范化、简明化的页面,这种叠压排列能产生强节奏的空间层次,视觉效果强烈。
58
第3章 网站系统设计 例如,页面上、左、右、下、中位置所产生的空间关系,以及疏密的位置关系所产生的空间层次,这两种位置关系使视觉流程生动而清晰,注目程度高,疏密的位置关系变化使空间层次富有弹性,同时也让人产生轻松或紧迫的心理感受。 需要指出的是,随着Web的普及和计算机技术的迅猛发展,人们已不满足于HTML语言编制的二维Web页面,三维世界的诱惑开始吸引更多的人。虚拟现实要在Web网上展示其迷人的风采,于是VRML语言出现了。VRML是一种面向对象的语言,它类似Web超级链接所使用的HTML语言,也是一种基于文本的语言,并可以运行在多种平台之上,只不过能够更多的为虚拟现实环境服务。但VRML只是一种语言,对于三维环境的艺术设计仍需要理论和实践指导。 2. 网站内容开发的要点 影响网站成功的因素主要有网站结构的合理性、直观性,多媒体信息的实效性。成功网站的最大秘诀在于让用户感到网站对他们非常有用,因此,网站内容开发对于网站建设至关重要。
59
第3章 网站系统设计 进行网站内容开发的要点包括:
第3章 网站系统设计 进行网站内容开发的要点包括: ●HTML文档的效果由其自身的质量和浏览器解释HTML的方法决定。由于不同浏览器的解释方法不尽相同,所以在网页设计时要充分考虑到这一点,让所有的浏览器都能够正常浏览。 ●网站信息的组织没有任何简单快捷的方法,吸引用户的关键在于总体结构的层次分明。应该尽量避免形成复杂的网状结构。网状结构不仅不利于用户查找感兴趣的内容,而且在信息不断增多后还会使维护工作非常困难。 ●图像、声音和视频信息能够比普通文本提供更丰富和更直接的信息,产生更大的吸引力,但文本字符可提供较快的浏览速度。因此,图像和多媒体信息的使用要适中,减少文件数量和大小是必要的。
60
第3章 网站系统设计 ●对于任何网站,每一个网页或主页都是非常重要的,因为它们会给用户留下第一印象,好的第一印象能够吸引用户再次光临这个网站。 ●网站内容应是动态的,随时进行修改和更新,以使自己的网站紧跟市场潮流。在主页上,注明更新日期及URL对于经常访问的用户非常有用。 ●网页中应该提供—些联机帮助功能。比如输入查询关键词就可以提供一些简单的例子,千万不能让用户不知所措。 ●网页的文本内容应简明扼要、通俗易懂。所有内容都要针对设计目标而编写,不要节外生枝。文字要正确,不能有语法错误和错别字。
61
第3章 网站系统设计 下面以培训站点为例,简要予以说明。一个培训站点基本包括以下三部分内容:
第3章 网站系统设计 下面以培训站点为例,简要予以说明。一个培训站点基本包括以下三部分内容: (1)关于培训的详细介绍,例如培训学校的背景、培训课程、培训老师、培训方式、招生简章、报名程序等。 (2)帮助学员进一步了解培训和学习的场所,例如教学论坛、实习天地、学员作品选登等。 (3)一些指向相关站点的链接,例如相关软件免费下载、实时新闻、其他著名同类站点、合作伙伴等。 假设企业要为自己做一个电视节目,但是企业不可能在摄制组来了之后才开始构思。企业事先要准备一个脚本,并非常仔细地列出企业所需要的所有要素,然后按次序来实施,这样才可能做出企业想要的节目。从某种意义上说,企业的主页也是一个节目,它将向世界展示企业。对那些仅仅通过企业的主页了解企业的访问者来说,只有内容看起来令人感兴趣、并值得一看的网站,他们才会认为值得访问。
62
第3章 网站系统设计 就像一个电视节目—样,企业的计划最终归为两大类:内容和技术。当然,此二者是相互关联的。企业页面的内容类型将决定企业要准备的技术细节;技术的限制也将影响企业对内容的选择。企业将在二者间不断寻找平衡点。 3. Web站点的典型内容 企业的Web站点应包括以下典型内容。 (1)企业的基本背景介绍 企业的背景介绍材料,如果有条件,最好能够提供相应的英文版,简介文字最好提供简单和详实两个版本。专业的电子版企业简介应该具有图文混排的非HTML格式,例如可以使用Acrobat的PDF格式供客户下载,因为Acrobat文件能够保持图文排列的整体观感。
63
第3章 网站系统设计 (2)详细的产品资料或服务介绍
第3章 网站系统设计 (2)详细的产品资料或服务介绍 生产制造类企业应该把自己的主要产品的全貌反映在网站上,让客户能够查询到产品的主要技术规格、照片和其他可公开的信息;服务类企业应该通过各种手段把详尽的服务内容和条款列出。为使企业产品能够在网站上用更形象的手段体现,可以采用VRML编辑器构筑一些虚拟现实场景。 根据企业产品或服务门类的多少,企业网站也应该采用不同的内容构造方式。如果企业的产品线比较复杂,并且经常有产品升级换代,那么最好采用Web数据库技术,让访问者可以进行数据库查询和分类检索。 (3)技术支持资料 除了产品说明书之外,企业还应该掌握自己产品的更多信息,比如常见故障处理、计算机产品的编程接口等。这些资料如果能够公开,可放入网站,以减轻企业技术支持人员的工作量。
64
第3章 网站系统设计 (4)企业营销网络 很多企业在总部以外都有其他分支机构,为此企业应该在网站上列出全球范围内所有可接洽到的办公场所,包括它们的电话、传真、电子邮件,并列出它们各自的职能。 (5)财务报告 对于股份制尤其是上市的企业,应该将重要的财务报告上网,让股民能够方便查询到这些信息,包括中报、年报和各种配股计划。 (6)收集客户反馈 在企业网站上应该至少带有一个客户反馈表单,用于收集客户和普通访问者对企业改进产品和服务的意见或建议。网络管理员应该经常检查提交上来的内容,并及时转交给企业决策部门使用。
65
第3章 网站系统设计 (7)其他针对企业经营特点的内容
第3章 网站系统设计 (7)其他针对企业经营特点的内容 比如服装制造企业可以加入一些时尚网站的链接,音响制品厂商可以加入音乐站点链接。但是,千万不要直接链接到竞争厂商的网站。 在企业Web站点建立后,要不断更新内容,利用这种新媒体宣传本企业的企业文化、企业理念和企业产品。站点信息的不断更新和新产品的不断推出,会让浏览者感到企业的实力和发展,同时也会使企业更加有信心。 在企业的web站点上,要认真回复用户的电子邮件、传统信件、电话垂询和传真,做到有问必答。最好将用户进行分类,例如售前—般了解、销售、售后服务等,由相关部门处理,使网站访问者感受到企业的真实存在,产生信任感。
66
第3章 网站系统设计 需要注意的是,不要许诺实现不了的内容,在企业真正有能力处理回复之前,不要恳求用户输入信息或罗列一大堆自己不能及时答复的电话号码。如果要求访问者自愿提供其个人信息,应公布并认真履行个人隐私保护承诺,如不向第三方提供此信息等。 页面可视化设计 页面可视化设计主要包括页面组织效果、页面色调效果、页面版式设计、页面美术设计等几方面内容。 1. 页面组织效果 形式服务于内容,内容又为目的服务,形式与内容的统一是设计网页的基本原则之一,应将丰富的意义和多样的形式组织在一个统一的结构里,且形式语言必须符合页面的内容,体现内容的丰富含义。
67
第3章 网站系统设计 在页面组织过程中,可以运用对比与调和、对称与平衡、节奏与韵律以及留白等手段。例如,通过空间、文字、图形之间的相互关系建立整体的均衡状态,产生和谐的美感。对称原则在页面设计中,它的均衡有时会使页面显得呆板:但如果加入一些动感的文字、图案,或采用夸张的手法来表现内容,往往会达到比较好的效果。 点、线、面是视觉语言中的基本元素,使用点、线、面的互相穿插、互相衬托、互相补充,可构成最佳的页面效果。 (1)点 点是所有空间形态中最简洁的元素,也可以说是最活跃、最不安分的元素。设计中,一个点就可以包罗万象,体现设计者的无限心思,网页中的图标、单个图片、按钮或一段 文字等都可以说是点。点是灵活多变的,我们可以将一排文字视为一个点,或将一个图形视为一个点。在网页设计中的点,由于大小、形态、位置的不同而会给人不同的心理感受。
68
第3章 网站系统设计 (2)线 线在编排设计中有强调、分割、导线、视觉线的作用。线会因方向、形态的不同而产生不同的视觉感受,例如垂直的线给人平稳、挺立的感觉:弧线使人感到流畅、轻盈;曲线使人跳动、不安。在页面中内容较多时,就需进行版面分割,通过线的分割保证页面良好的视觉秩序。页面在直线的分割下,产生和谐统一的美感;通过不同比例的空间分割,有时会产生空㈨层次的韵律感。 (3)面 面的形态除了规则的几何形体外,还有其他—些小规则的形态,它的表现形式是多种多样的。面给人以整体美感,使空间层次丰富,使单—的空间多元化,在表达上较含蓄。 网页设计中点、线、面的运用并不是孤立的,很多时候都需要将它们结合起来,以表达完美的设计意境。
69
第3章 网站系统设计 2. 页面色调效果 色彩是艺术表现的要素之一,在网页设计中,根据和谐、均衡和重点突出的原则,将不同的色彩进行组合、搭配来构成美丽的页面。色调及黑、白、灰的三色空间关系无论是在设计上,还是在绘画上都起着重要的作用。在页面上一定得明确色调,而其他有色或无色的内容均属黑、白、灰的三色空间关系,从而构成它们的空间层次。 色彩会对人们的心理产生影响,应合理地加以运用。按照色彩的记忆性原则,一般暖色较冷色的记忆性强。另外,色彩还具有联想与象征的特质,例如,红色象征火、血、太阳:蓝色象征大海、天空和水面等。设计出售冷食的虚拟店面,可使用清凉而沉静的颜色,使人心埋上会感觉凉爽一些。
70
第3章 网站系统设计 在色彩的运用过程中,还应注意的一个问题是:由于国家和种族的不同,宗教和信仰的不同,生活的地理位置、文化修养的差异,不同的人群对色彩的喜恶程度有着很大的差异。例如,儿童喜欢对比强烈、个性鲜明的纯颜色:生活在草原上的人喜欢红色:生活在闹市中的人喜欢淡雅的颜色;生活在沙漠中的人喜欢绿色。在设计中要考虑各企业的主要读者群的背景和构成。 关于色彩的原理有许多,在此仅仅阐述一些网页配色时的常用技巧。 (1)用一种色彩。这里是指先选定一种色彩,然后调整透明度或者饱和度(说得通俗些就是将色彩变淡或加深),产生新的色彩,用于网页。这样的页面看起来色彩统一,有层次感。 (2)用两种色彩。先选定一种色彩,然后选择它的对比色。 (3)用一个色系。简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。
71
第3章 网站系统设计 在网页配色中,还要切记一些误区: (1)不要将所有颜色都用到,尽量控制在三种色彩以内。
第3章 网站系统设计 在网页配色中,还要切记一些误区: (1)不要将所有颜色都用到,尽量控制在三种色彩以内。 (2)背景和前文的对比尽量要大,绝对不要用花纹繁复的图案作背景,以便突出主要文字内容。 3. 页面版式设计 设计版面就像传统的报刊杂志编辑—样,将网页看作一张报纸、一本杂志来进行排版布局。虽然动态网页技术的发展使得我们开始趋向于学习场景编剧,但是固定的网页版面设计基础依然是必须学习和掌握的。它们的基本原理是互通的,读者可以领会其要点,举一反三。 版面指的是浏览器看到的完整的—个页面(可以包含框架和层次)。因为每个人的显示器分辨率不同,所以同一个页面的大小可能出现640~480像素、800~600像素、1024x768像素等不同尺寸。
72
第3章 网站系统设计 (1)版面布局的步骤 ①草案
第3章 网站系统设计 (1)版面布局的步骤 ①草案 属于创造阶段,不讲究细腻工整,也不必考虑细节功能,只以粗陋的线条勾画出创意的轮廓即可。尽可能多画几张,最后选定一幅满意的作为继续创作的脚本。 ②粗略布局 在草案的基础上,将需要放置的功能模块安排到页面上。功能模块主要包含网站标志、主菜单、新闻、搜索、友情链接、广告条、邮件列表、计数器和版权信息等。注意,这里必须遵循突出重点、平衡协调的原则,将网站的标志、主菜单等最重要的模块放在最显眼、最突出的位置,然后再考虑次要模块的排放。 ③定案 将粗略布局精细化、具体化,最后达到满意定案。
73
第3章 网站系统设计 对于版画布局的设计,应当重视如下原则:加强视觉效果,加强文字图案的可视度和可读性;统一感的视觉;新鲜和个性是布局的最高境界。网页设计作为—种视觉语言,当然要讲究编排和布局,虽然网页设计不等同于平面设计,但它们有许多相近之处,应充分加以利用和借鉴。 版式设计通过文字及图形的空间组合,表达出和谐与美。一个优秀的网页设计者应该知道哪一段文字及某个图形该落于何处,才能使整个网页生辉。网页设计者应努力做到整体布局合理化、有序化、整体化。优秀之作善于以巧妙、合理的视觉方式使一些语言无法表达的思想得以阐述,做到既丰富多样,又简洁明了。 多页面站点的编排设计要求从页面之间的有机联系反映出来,这里主要的问题是页面之间和页面内的秩序与内容的关系。为了达到最好的视觉表现效果,应讲究整体布局的合理性。特别是关系十分紧密的有上文关系的页面,一定要设计有向前和向后的按钮,便于浏览者可以来回仔细研读。
74
第3章 网站系统设计 (2)常用版面布局的形式 ①“T”结构布局
第3章 网站系统设计 (2)常用版面布局的形式 ①“T”结构布局 所谓“T”结构就是指页面顶部为横条网站标志+广告条,下方左面为主菜单,右面显示内容的布局。因为菜单条背景较深,整体效果类似英文字母“T”,所以称为“T”形布局。这是网页设计中使用最广泛的—种布局方式。这种布局的优点是页面结构清晰、主次分明,且是初学者最容易掌握的布局方法。缺点是规矩呆板,如果色彩细节上再不注意,很容易让人看后乏味。’ ②“U”形布局 这是一个象形的说法,就是页面一般上下各有一个广告条,左面是主菜单,右面放友情链接等,中间是主要内容。这种布局的优点是充分利用版面,信息量大。缺点是页面拥挤,不够灵活。也有将四边空出,只用中间的窗口型设计,例如网易的壁纸站。
75
第3章 网站系统设计 ④对称对比布局 顾名思义,采取左右或者上下对称的布局,—半深色:另一半浅色一般用于设计型站点。优点是视觉冲击力强,缺点是将两部分有机地结合比较困难。 ⑤POP布局 POP引自广告术语,就是指页面布局像一张宣传海报,以一张精美图片作为页面的设计中心。此类布局常用于时尚类站点,比如ELLE.com。优点是显而易见,漂亮吸引人,缺点是速度慢。 以上总结了目前网络上常见的几种布局,此外还有许许多多别具一格的布局,关键在于网站本身的创意和设计。 4. 页面美术设计
76
第3章 网站系统设计 专业美术设计人员的帮助对企业站点的成功设计是至关重要的。即便是一个没有一点网页设计经验的专业美术设计人员,也能提供很多关于排版、色彩等方面的建议。实际上,很多传统出版行业的规则和禁忌,也大都适用于网页的设计。 网页设计与其他出版设计最大的不同表现在以下三方面: (1)传播的媒介不同 许多用户是用MODEM上网的,考虑到用户的容量程度,图形一般不宜太大;通常每个图形应小于30KB,每个页画图形总量应小于50KB。 (2)所能采用的文件格式的限制 对通用浏览器来说,能识别的图像格式仅为JPEG和GIF。这两者又各有不同的特点和适用环境。 (3)与美术设计人员要有良好的合作
77
第3章 网站系统设计 首先应该能向他们提供前面所说的内容和逻辑结构图。因为他们的责任仅仅是对网页的形式负责,而至于内容,必须由企业业务人员去敲定。其次,应该把站点的美术需求、风格等告诉美术创作人员。如果可能的话,最好能带着他们去见业务人员,直接了解站点形象方面的要求。此外,还应该把企业原有的—些成功的宣传册子、CI手册等材料尽可能交给美术人员作为参考。 在向美术设计人员提供了上述信息和材料后,就可以让他们设计出形成站点风格的一些关键要素了。从美术和效率的角度出发,应该考虑采用可视化的页面编辑工具。最好能请一些有美感、懂得排版的人从事此项上作。他们可能多半不会使用HTML语言但比程序员制作出来的网页页面好看得多。 此外,工具的选择也很重要。市场上有很多编辑器,有的工具很好,它能有效地把高级美术人员、排版人员以及程序员的工作分开。
78
第3章 网站系统设计 3.4.5 网站的栏目和版块设计 设计网站的中心工作之一,就是设置网站的栏目和版块。 1. 栏目和版块的定义
第3章 网站系统设计 网站的栏目和版块设计 设计网站的中心工作之一,就是设置网站的栏目和版块。 1. 栏目和版块的定义 栏目的实质是网站的大纲索引,索引应该将网站的主体明确地显示出来。在制定栏目的时候,要仔细考虑,合理安排。划分栏目需要注意的是:尽可能删除与主题无关的栏目;尽可能将网站最有价值的内容列在栏目上,尽可能方便访问者的浏览和查询。版块比栏目的概念要大一些,每个版块都有自己的栏目。例如,网易的站点分新闻、体育、财经、娱乐、教育等版块,每个版块下面有各自的主栏目。一般的个人站点内容少,只有主栏目(主菜单)就够了,不需要设置版块。
79
第3章 网站系统设计 2. 栏目设计 栏目的内容与功能往往是决定网站的质量以及受欢迎的程度。网站的题材确定后,设计者已经收集和组织了许多相关的资料内容,并且认为这些都是最好的,肯定能吸引网友来浏览网站。但是有没有将最好的、最吸引人的内容放在最突出的位置呢?有没有让好内容在版面分布上占绝对优势呢?因此,网站的栏目设计应注意下列四个问题: (1)网站的栏目是否满足了用户的需要? (2)网站的栏目是否可以让用户很快了解信息并且方便与网站的交流? (3)从用户的角度如何评价这个网站? (4)我有足够的能力及时组织网站的信息资料吗? 弄清楚了上述问题,网站的结构就应该是非常清晰明确了。
80
第3章 网站系统设计 一个网站的建设是一项长期性的工作,是需要分阶段、按步骤进行的。根据网站的目标和用户需要,有针对性地设计栏目,分阶段地组织栏目,按步骤地实施计划,这是网站建设的基本原则。许多网站都是依靠创办一二个栏目起家的。比如,新浪网依托的是新闻栏目与网上论坛,搜狐网依托的是搜索引擎。 3. 网站栏目安排注意事项 一般的网站栏目安排要注意以下几方面。 (1)紧扣主题 紧扣主题的一般做法是:将网站主题按一定的方法分类并将它们作为网站的主栏目。例如,可以将栏目分为动物动画、标志动画、三维动画、卡通动画等,在首页上标明最近更新的动画。记住:主题栏目个数在总栏目中要占绝对优势,这样的网站显出专业化主题突出,容易给人留下深刻的印象。
81
第3章 网站系统设计 (2)设立一个最近更新或网站指南栏目
第3章 网站系统设计 (2)设立一个最近更新或网站指南栏目 如果网站首页没有安排版面放置最近更新的内容信息,就有必要设立一个“最近更新”的栏目。这样做是为了照顾常来的访问客,让网站主页更具人性化。如果网站主页内容庞大(超过15MB)、层次较多,而又没有站内的搜索引擎,建议该网站设置“本站指南”栏目,这样可以帮助初访者快速找到他们想要的内容。 (3)设定一个可以双向交流的栏目 双向交流的栏目不需要很多,但一定要有,如论坛、留言本、邮件列表等,可以让浏览者留下他们的信息。有调查表明,提供双向交流的站点比简单的留一个电子邮件的站点更具有亲和力。
82
第3章 网站系统设计 (4)设一个下载或常见问题回答栏目
第3章 网站系统设计 (4)设一个下载或常见问题回答栏目 网络的特点是信息共享。如果读者看到一个站点有大量优秀的、有价值的资料,肯定希望能一次性下载,而不是一页一页浏览存盘。因此,如果在网站主页上设置一个资料下载栏目,肯定会得到大家的喜欢。 另外,如果站点经常收到网友关于某方面的问题来信,最好设立一个常见问题回答的栏目,这样既方便了网友,又节约了自己的时间。至于其他的辅助内容,如关于本站、版权信息等可以不放在主栏目里,以免冲淡主题。 4. 版块设置注意事项 如果觉得的确有必要设置版块的,必须要注意以下三点: (1)各版块要有相对独立性。 (2)各版块要相互关联。 (3)版块的内容要围绕站点主题。
83
第3章 网站系统设计 3.4.7 确定网站的目录结构和链接结构
第3章 网站系统设计 确定网站的目录结构和链接结构 为了实现信息的有效传递,也为了便于网站的更新和维护,站点的目录结构设计十分重要。主次分明、脉络清晰的站点结构使访问者对网站内容一目了然,便于获得所需信息。 同时,规划合理的目录结构对于网站所有者来说,可以在以后的内容更新和维护中,节省大量时间和精力。 1. 网站的目录结构 网站目录是指建立网站时创建的目录。例如,在用FrontPage98建立网站时都默认建立了根目录、Images目录和子目录。目录结构是一个容易忽略的问题,很多网站都是未经规划,随意创建子目录。目录结构的好坏,对浏览者并没有什么太大的影响,但是对于站点本身的上传维护、未来的内容扩充和移植有着重要的影响。
84
第3章 网站系统设计 (1)所有文件不要都存放在根目录下 有的网站为了方便,将所有文件都放在根目录下。这样做造成的不利影响在于:
第3章 网站系统设计 (1)所有文件不要都存放在根目录下 有的网站为了方便,将所有文件都放在根目录下。这样做造成的不利影响在于: ①文件管理混乱。常常搞不清哪些文件需要编辑和更新,哪些无用的文件可以删除,哪些是相关联的文件,这会影响工作效率。 ②上传速度慢。服务器一般都会为根目录建立一个文件索引。如果将所有文件都放在根目录下,那么即使只上传更新一个文件,服务器也需要将所有文件再检索一遍,建立新的索引文件。很明显,文件量越大,等待的时间也越长。所以,建议尽可能减少根目录的文件存放数。 (2)按栏目内容建立子目录 子目录的建立应首先按主菜单栏目建立。例如,网页教程类站点可以根据技术类别分别建立相应的目录,像Flash、Dhtml、JavaScript等。
85
第3章 网站系统设计 企业站点可以按公司简介、产品介绍、价格、在线订单、反馈联系等建立相应的目录。其他的次要栏目,需要经常更新,可以建立独立的子目录,而一些相关性强、不需要经常更新的栏目,例如关于本站、关于站长、站点经历等,可以合并放在一个统一的目录下。 所有程序一般都存放在特定目录下,例如CGI程序放在Cgi-bin目录。为便于维护管理,所有需要下载的内容也最好放在一个目录下。 2. 网站的链接结构 一个好网站的基本要素是用户进入后,与本网站相关的信息都可以方便快捷地找到,其中要借助于相关的站点,所以做好引导工作是很重要的。超文本这种结构使全球所有接入Internet的计算机成为超大规模的信息库,链接到其他网站轻而易举。在设计网页的导引组织时,应该给出多个相关网站的链接。
86
第3章 网站系统设计 网站的链接结构是指页面之间相互链接的拓扑结构。它建立在目录结构基础上,但可以跨越目录。形象地说,每个页面都是一个固定点,链接则是在两个固定点之间的连线。—个点可以和一个点连接,也可以和多个点连接。更重要的是,这些点并不是分布在一个平面上,而是存在于一个立体的空间中。 研究网站的链接结构的目的在于:用最少的链接,使得浏览最有效率。通常,建立网站的链接结构有两种基本方式。 (1)树状链接结构(一对一) 该结构类似DOS的目录结构,首页链按指向一级页面,一级页面链接指向二级页面。立体结构看起来就像蒲公英。这样的链接结构浏览时,一级级进入,一级级退出。 该结构的优点是条理清晰,访问者明确知道自己在什么位置,不会迷路。缺点是浏览效率低,一个栏目下的子页面到另一个栏目下的子页面,必须绕经栏目页。
87
第3章 网站系统设计 (2)星状链接结构(—对多)
第3章 网站系统设计 (2)星状链接结构(—对多) 该结构类似网络服务器的链接,每个页面相互之间都建立有链接。立体结构像电视塔上的钢球。这种链接结构的优点是浏览方便,随时可以到达自己喜欢的页面。缺点是链接太多,容易使浏览者迷路,搞不清自己在什么位置,看了多少内容。 这两种基本结构都只是理想方式,在实际的网站设计中,总是将这两种结构混合起来使用。我们希望浏览者既可以方便快速地达到自己需要的页面,又可以清晰地知道自己的位置。所以,最好的办法是首页和一级页面之间用星状链接结构,一级和二级页面之间用树状链接结构。 如果站点内容庞大、分类明细,需要超过三级页面,那么建议在页面里显示导航栏,这样可以帮助浏览者明确自己所处的位置。读者在许多网站页面顶部可看到类似的表示:“您现在的位置是:首页>财经新闻>股市信息>深圳股>深发展”
88
第3章 网站系统设计 关于链接结构的设计,在实际的网页制作中是非常重要的一环。采用什么样的链接结构直接影响到版面的布局。例如,主菜单放在什么位置,是否每页都需要放置,是否需要用分帧框架,是否需要加入返回首页的链接。在链接结构确定后,再开始考虑链接的效果和形式,是采用下拉表单,还是用DHTML动态菜单等等。 随着电子商务的推广,网站之间的竞争越来越激烈,对链接结构设计的要求已经不仅仅局限于可以方便快速地浏览,而更加注重个性化和相关性。例如,在爱婴主题网站里,在8个月婴儿的营养问题页画上,需要加入8个月婴儿的健康问题链接、智力培养链接,或者是有关奶粉宣传的链接,以及图书和玩具的链接。因为父母不可能到每个栏目下去寻找关于8个月婴儿的信息,他们可能在找到需要的问题后就离开网站了。如何能尽可能地留住访问者,是网站设计者必须考虑的问题。
89
第3章 网站系统设计 上述内容本质上都是围绕网站功能、结构、内容等方面的策划和设计进行阐述。实际上,站点内容和功能的设计是网络营销策略的直接体现,从单纯的企业介绍、企业形象树立、企业产品与服务信息的发布到网上直销,网站的内容与功能设计既要符合企业的需求,又要参考当前技术的发展状况和应用水平。以网络营销为主业的企业站点不但要充分运用多媒体技术实现信息发布功能,更重要的是要发挥Web的交互特性,实现网站信息检索、在线客户服务、用户反馈信息收集,甚至在线订单、在线购物、在线支付等功能。 3.5 网站设计的成功要素 总结本章的内容,应该汇总一下成功的网站应该具备哪些特点。设计一个网站,应该考虑下列基本因素,这些因素对网站的成功与否有着重要的影响。
90
第3章 网站系统设计 3.5.1 整体布局结构清晰便于使用
第3章 网站系统设计 整体布局结构清晰便于使用 如果人们看不懂或很难看懂企业的网站,那么,他如何购买企业的产品或服务呢?因此,尽量使用一些醒目的标题或文字来突出企业的产品或服务,并且始终牢记即使企业拥有最好的产品,如果用户从网站上小清楚你在卖什么,或不清楚如何受益的话,他们是不会购买的。 对于网页的构架,若网页是多页数的,那么站点管理人员可制作—个流程图,使客户容易在网页上浏览。切记中小企业的对象是买家及企业集团,并不是普通大众。特别是国外客户,往往通过网页了解了中小企业的运作后才进行接触,故此网页便是我们初步留给准客户的印象。不少的网页并不是常常更新的,可能我们并没有新的资料补充,但这并不表示不去更新。注意,要保证每星期或每月更新网页,给准客户以信心,增加网站的竞争力。 一般来说,好的网站应该给人有这样的感觉:简明清晰,条理清楚,有专业水准,引人入胜。网页应该力求抓住而不是淹没浏览者的注意力,过多的闪烁、色彩、下拉菜单框、图片等会让访问者无所适从,只好选择离开。
91
第3章 网站系统设计 提供有价值的信息 无论商业站点还是个人主页,必须给人们提供有一定价值的内容才能留住访问者,所以网站必须提供某些有价值的东西,当然并不是说必须提供某些免费的物品,如免费书籍、免费入场券、免费度假等。这些“有价值的东西”可以是:信息,娱乐,劝告,对一些问题的帮助,提供志趣相投者联络的机会,链接到有用的网页,等等。 如果是企业网站,需要提供关于产品或服务的信息:容易理解,容易查询,容易订货,等等。 提供有价值的信息就是找出最受欢迎以及突出的企业产品作为网页的招牌。中小企业的管理人要深思,找出白己企业与众不同的卖点。若不能显示出企业的竞争力,网站的访问者会日渐减少。
92
第3章 网站系统设计 快速的访问速度 页面下载速度是网站留住访问者的关键因素,如果20~30秒还不能打开一个网页,一般人就会没有耐心。为确保主页速度尽可能快,最好不要用过大的图片。应该时时提醒自己,网站主页就像一个广告牌,当开车经过一个广告牌时,没有时间阅读上面的详细说明,也不可能赞赏其复杂的图案,广告标志从眼前一闪而过,必须在一瞬间给人留下印象。网上访问者也是“一闪而过”,应保证网站的首页简单而明快。 良好的文字、版面设计 对商务网站的文字、版面设计应注意到文字的可读性,版面的可欣赏性,同时导航要明确,导向要清晰。
93
第3章 网站系统设计 1. 很强的文字可读性 许多网站的设计者使用了动态GIF图片和Java动画,以使网站上的图形或文字产生动态的效果。这不仅仅网页下载时间,它更会分散用户对网站其他信息的注意力。由于浏览Internet的大多是一些寻找信息的人们,因此,你要确定网站将为他们提供的是有价值的内容,而不是过度的装饰。我们仍然用广告牌的比喻来说明,文字要在广告牌上突出,周围应该留有足够的空间。 此外,文字的颜色也很重要,不同的浏览器有不同的显示效果,有些在一种浏览器上很漂亮的颜色在其他浏览器上可能无法显示。版式可参考报纸的编排方式,为方便或快速阅读,可将网站的内容分栏设计,甚至双栏也要比满满一页的视觉效果要好。 另一种能够提高文字可读性的因素是选择的字体,通用的字体最易阅读:特殊字体用于标题效果较好,但是不适合正文,因为阅读费力,网民的眼睛很快就会疲劳,不得不转移到其他页面。
94
第3章 网站系统设计 此外,使用词语要正确得体。一个网站如果只有漂亮的外观而词语错误连篇,语法混乱,同样是失败的。这会对网站所有者和负责人产生很坏的印象,从而影响企业的整体形象。 2. 良好的版面设计 图形和版面设计关系到对主页的第一印象,图像应集中反映主页所期望传达的主要信息。如果是系列商业站点,不必让过分显眼的动画出现在首页,但如果是游戏站点,动画将是必不可少的一部分内容。 图片是影响网页下载速度的重要原因,根据经验,把每页全部内容控制在30KB左右可以保证比较理想的下载时间。图像以在6KB~8KB之间为宜,每增加2KB会延长1秒钟的下载时间。 颜色也是影响网页的重要因素,不同的颜色对入的感觉有不同的影响,考虑到网站希望对浏览者产生什么影响,为网页选择合适的颜色。
95
第3章 网站系统设计 通常阅读时眼睛从左上方开始,逐行浏览到达下方,插入图像时不要忘记这种特性。任何具有方向性的图片应该放置在网页中对视觉最重要的地方,如果在左上角放置一幅小鸟的图片,鸟嘴应该放在把浏览者目光引向页面中部的地方,而不是把视线引走。这种思路可以用于所有图片:面部应该“看”网页的中部;汽车的“停靠”面向网页中部;道路、领带等图片的放置都应该在有助于吸引目光从左向右、从上向下的移动;一般总是把网站导航栏放置在页面左边,也是出于这种考虑……,不断地出现在浏览者最佳视野之中。 3. 良好的标题设计 为使网页易于阅读,除了分栏之外(将页面纵向分割),也需要利用标题和副标题将文档分段。 为所有标题和副标题设置同一字体,并将标题字体加大一号,所有标题和副标题都采用粗体,这样便于识别,使浏览者一眼就可以看到。标题的重要性不言而喻,要认真编好每个标题,也可以将整条标题采用粗体或以不同的颜色突出某些内容,不过不要使用难以阅读的颜色。
96
第3章 网站系统设计 4. 导航明确,导向清晰 使用超文本链接或图片链接,使人们能够在网站上自如地前进或后退,而不要让他们使用浏览器上的前进或后退。记住,在所有图片上使用ALT标识符注明图片名称或解释,以便那些不愿意自动加载图片的用户能够了解图片的含义。 由于人们习惯于从左到右、从上到下阅读,所以主要的导航栏应放置在页面的左边。对于较长的页面来说,在最底部设置一个简单导航也很有必要。确定一种满意的模式之后,最好将这种模式应用到同—网站的每个页面,这样浏览者就知道如何寻找信息了。
97
第3章 网站系统设计 作业三 1、 系统设计的原则和步骤。 2、 模块划分的标准。 3、 简述如何在网站设计中运用结构化设计方法。
第3章 网站系统设计 作业三 1、 系统设计的原则和步骤。 2、 模块划分的标准。 3、 简述如何在网站设计中运用结构化设计方法。 4、 Web站点的设计原则和设计要点。 5、 Web站点的设计流程。 6、 Web站点包含哪些基本模块 7、 网站的首页设计应注意写什么? 8、 页面的可视化设计包括哪些内容?
98
第3章 网站系统设计 作业三 1、 1、 如何搭配页面的颜色? 2、 常用的页面版面布局的形式 3、 网站的栏目和版块设计应注意些什么?
第3章 网站系统设计 作业三 1、 1、 如何搭配页面的颜色? 2、 常用的页面版面布局的形式 3、 网站的栏目和版块设计应注意些什么? 4、 如何设计网站的目录结构和链接结构? 5、 网站设计常用技术有哪些? 6、 如何设计一个成功的网站系统?
99
实践题:根据第2章作业中的网站规划书书写一份网站设计书。
第3章 网站系统设计 实践题:根据第2章作业中的网站规划书书写一份网站设计书。
Similar presentations