电子商务网站前台用户系统设计
第3章 电子商务网站前台用户系统设计
3.1 实训项目一电子商务网站首页设计
3.1.1 实训目的与要求
首页是网站的形象页面，一个网站能否吸引浏览者留在该站中漫游，全凭首页设计效果的好坏。所以，首页设计对于任何网站都是至关重要的。通过本项目的实训与练习，使学生熟悉电子商务网站首页的功能模块，掌握电子商务网站首页的设计方法，构造出主题鲜明、版面精彩、立意新颖的网站首页。
3.1.2 实训预备知识
1. 首页的功能模块
首页，从根本上说，就是全站内容的目录，也是一个索引。但只罗列目录显然是不够的，设计好一个首页，首先需要确定的是首页的功能模块。一般的站点都需要页头、页中和页尾这3个模块。
(1) 页头包括网站名称(Logo)、广告条(Banner)、导航等版块。页头用来标示网站和体现网站主题。它可以用企业的名称、标语、徽号或图像集中、概括地反映企业的经营理念和服务定位。导航提供了对关键页面的简捷链接，其超链接或图标应明确地表明网站其他页面上载有的信息；用户能够通过这样一个简单的功能化的界面，迅速地到达他们所需信息的其他页面上。
(2) 页中包括公告与新闻、产品推荐、广告条、搜索、友情链接等版块。在首页上预告即将有新资料推出，可吸引用户再次来浏览网站。为保持网站的新鲜感，应时刻确保主页提供的是最新信息，可以在页头以大字标题宣布新消息，也可以定期改变主页上的图像，或更改主页的样式。
(3) 页尾包括版权与联络信息、计数器等版块。在首页上标示一句简短的版权声明，然后用链接方法带出另一个载有详细使用条款的页面，这样可以避免首页的杂乱。在页面的底部设计简单的电子邮件链接，可使用户与负责因特网站点或负责网上反馈信息的有关人员迅速取得联系，使企业获得因特网站点外的信息反馈。
在这3个模块中，需要哪些版块以及选择实现哪些功能，都是首页设计首先需要确定的。
2. 首页设计的要点
首页设计应该遵循快速、简洁、吸引人、信息概括能力强、易于导航的原则，同时应纳入企业CIS(企业形象识别系统)计划，与企业CIS的其他内容协调起来。在一个网站的首页就要将自己企业的强势直接道出，所有绝活、高招、亮点等都用上，对浏览者形成兴趣
电子商务网站设计与管理
·58· ·58·
冲击力，将其吸引住，从而促使其深入浏览网站。在首页设计中，以下事项需要引起设计者的重视。
(1) 主题明确，重点突出。用户应能通过网站首页明确企业的主要任务。要达到这个目的，最好在文本或图像中设置阐明主题的句子——视觉兴趣点，这一点对于绝大多数的企业来说是很重要的。国内许多企业的首页设计很平庸，既无特色又显呆板，原因就是其缺乏让人“神往其间”的视觉兴趣点。
(2) 页面简洁，重在创意。设计并不是再现具体的物象和特征，它要表达的是一定的意图和要求，在适当的环境里为人们所理解和接受。它以满足人们的实用和需求为目标，因而要求简练、准确。页面创意涉及诸多领域，独特的创意会使首页极具吸引力，从而使用户深入浏览。
(3) 技术合理，浏览快捷。上网浏览需要的是快速、有价值的信息。在首页设计中充斥许多只是为了炫耀技术的东西，如多个风格迥异的动画(缺乏美感甚至是与主题无关的动画)，还有在首页设计中大量地使用JavaScript 和动态HTML 技术，这样的首页会造成页面的混乱，不管是从功能上还是从形式上都是不可取的。目前，电子商务网站首页的简洁化已经成为其设计趋势。
3. 首页设计的方法
首页设计需要经过以下几个基本步骤。
(1) 构思布局。
对首页设计进行认真构思，结合首页的功能模块与主题内容，充分发挥艺术想象力，锐意创新，大胆突破，全盘考虑。构思结果不仅要有独特的创意，还要考虑技术实现的可行性。如果构思巧妙，富有创意，但使用现有的计算机技术和网络技术却不能实现，创意也就变成了空想。
(2) 绘制草图。
我们在写作文前通常会列一个提纲，以便于写作时条理清晰。首页设计也是同样道理，要事先打草稿。绘制草图就是把大脑中构思的页面布局轮廓具体化的过程，可以在纸上绘出，也可以用Photoshop 或Dreamweaver 软件在计算机上绘制。在大脑中构思时，由于没有受到空间和技术等因素的限制，思维的“翅膀”可能飞得很远。但当在纸上或计算机上实现时，却会发现，有些想法是无法实现或不合理的。因此，在绘制过程中必须对大脑中的“蓝图”作必要的修正。绘制草图属于创造阶段，不讲究细腻工整，也不必考虑细节功能，只要用粗陋的线条勾画出创意的轮廓即可。在绘制时尽可能多画几张，最后选定一个满意的方案作为继续创作的脚本。
(3) 方案细化。
在草图基础上，按照平面设计的规律将网页页面元素，如站标、导航栏、栏目标题、广告、图片、搜索引擎、计数器等都罗列出来，然后设定网页的外形尺寸、网页色彩、字体大小、图形图像尺寸等，做出页面的基本样式。这个阶段的设计结果仍然是草图，但已经是一个比较完善的设计方案。除了文字内容之外，其他所有内容均已接近将来网页的实际效果。这个方案供客户和技术开发人员讨论以完成最后的定稿。
第3章 电子商务网站前台用户系统设计 ·59·
·
59·(4) 修整定稿。
根据客户和技术人员的意见进一步修整方案，直至最后定稿，这样就形成了首页效果图。
3.1.3 实训步骤
实训：用Dreamweaver 进行美滋滋瓜子网站的首页设计与制作。
(1) 规划与构思。
规划美滋滋瓜子网站，把它分为关于美滋滋、品牌战略、新闻中心、产品中心、网上订单、招贤纳士、联系我们、留言板这8个栏目。首页页头应包括Logo 、导航、Banner 等版块；首页页中应包括新品推荐、新品展示、行业新闻、企业新闻、最新公告、食品知识、在线调查等版块；首页页尾应包括联络信息、计数器等版块。
(2) 定义首页尺寸规格、背景与布局安排。
① 设计版面布局，绘制草图，
如图3.1所示。
图3.1 草图
电子商务网站设计与管理
·60· ·60·
② 在Dreamweaver MX 2004中新建文档，将其命名并保存。然后设置其页面属性，如图3.2所示。
图3.2 网页页面属性设置
(3) 设计页头。
① 用布局表格工具绘制表格，表格宽度为779像素。用布局单元格工具绘制单元格，如图3.3所示。
图3.3 布局表格工具绘制表格
② 在左边的单元格内插入网站Logo ，如图3.4所示。
③ 在右上部单元格内插入导航1，如图3.5所示。
第3章 电子商务网站前台用户系统设计
·61·
·61·
图3.4 插入网站Logo
图3.5 插入导航1
④ 在右下部单元格内插入导航2。由于导航2为Flash 制作，所以选择菜单栏中的“插入”|“媒体”|“Flash ”，如图3.6所示。
⑤ 制作Banner 。插入一个779像素宽的表格，在表格中插入Banner 动画。最后的页头效果如图3.7所示。
电子商务网站设计与管理
·62· ·62·
图3.6 插入Flash 导航
图3.7 插入Banner
(4) 设计页中。
① 确定网页内容部分分为3列。插入一个宽为779像素的表格，将其拆分成3列，宽度分别为“159、338、219”，如图3.8所示。
② 制作左边的表格。插入一个百分比表格，然后将其拆分成6行，如图3.9所示。
第3章 电子商务网站前台用户系统设计 ·
63·
·63·
图
3.8 插入3列表格
图3.9 插入百分比表格
③ 在第一、第四个单元格内插入栏目标识，在第二个单元格内插入文字，将第三，第五个单元格高度分别设置为159像素与140像素，并将背景图插入，如图3.10所示。
电子商务网站设计与管理 ·64·
·64·
图3.10左列布局安排
④制作中间部分的内容框。插入一个百分比表格，然后将其拆分成6行。在第一，第三，第五个单元格内插入栏目标识，在第二，第四，第六个单元格内插入背景图，单元格高度分别设置为“130、137、103”，如图3.11所示。
图3.11中列布局安排
第3章 电子商务网站前台用户系统设计 ·65·
·65·
⑤ 制作内容部分的最后一栏。将表格宽度定位百分比，再将表格拆分成4栏。在第一、第三个单元格内插入栏目标识，在第二、第四个单元格内插入背景图，
如图3.12所示。
图3.12 页中整体布局
(5) 设计页尾。
① 插入一个宽为779像素的表格，设置其高为10像素，以红色填充(#C30000)
，如图3.13所示。
图3.13 插入表格
电子商务网站设计与管理
·66· ·66·
② 插入一个779×76像素的表格，在其中插入背景图，效果如图3.14所示。
图3.14 插入表格与背景图
(6) 填充内容。
① 整个网页的样式设计已基本上完成，接下来要填充内容。
② 在插入网页内容时，中列表格用到了表格的CSS 定义。在此，具体说一下如何给表定义CSS 样式。选中单元格，然后右击鼠标，在弹出的菜单上选择“CSS 样式”|“新建”，如图3.15所示。由于网页中只用到虚线的表框，所以在弹出的对话框内选择“边框”，再根据自己的需要对表格进行定义，最后应用到所要定义的表格上，如图3.16所示。
图3.15 选择新建CSS 样式表
第3章 电子商务网站前台用户系统设计
·67··67·
图3.16 设置边框样式
(7) 完成设计后，浏览一下整体的效果，
如图3.17所示。
图3.17 浏览效果
3.1.4 思考与练习
(1) 电子商务网站首页有哪些功能模块？
(2) 电子商务网站首页设计的方法是什么？
(3) 为卡西欧手表销售店设计首页。
电子商务网站设计与管理
·68· ·68·
(4) 分析阿里巴巴网站首页的功能模块。
3.2 实训项目二 电子商务网站二级页面设计
3.2.1 实训目的与要求
网站给人的第一印象是首页，但并不是说只要首页做好，网站的整体形象就好。因为用户在对整个网站的浏览的过程中，会自然而然地形成一种对网站的看法。而这种看法是带有感情色彩的，比如喜欢、不喜欢、没有什么感觉等，这就是网站整体形象的体现。网站整体形象是靠首页和其他的页面相配合来呈现的，所以在设计网页时，既要考虑怎样将网站好的一面体现给用户，又要考虑体现的方式与侧重点，不能都放在首页上，造成杂乱的现象。通过本项目的实训与练习，使学生熟悉电子商务网站二级页面的组成，掌握电子商务网站新闻、产品、客户支持等二级页面的设计方法，构造出站点整体和谐、风格统一的网站页面。
3.2.2 实训预备知识
1. 新闻页面设计
电子商务网站都应有一个新闻页面，该页面担起双重作用，既可以用来动态发布有关新产品、新开发项目或公司活动的情况，又可以作为公司的活动年表。有了电子商务网站，公司就可以以较低的成本及时地发布新闻。
建立新闻页面，首先可以在首页上编写并设置可点击的新闻标题，然后再编写完整的新闻页面，新闻标题与这些页面通过超链接相连。在设计新闻页面时，应遵循清晰、简单、快捷的原则以便于打印，不要使用那些不利于文本阅读的背景图片和颜色。
1) 首页中的新闻标题
标题要能够清楚地描述新闻的要点，以便于用户能大致地了解新闻的内容。通常标题的文字不宜过长，其主要的功能、组成要素与版面布置的方法如下。
(1) 新闻标题的功能。
① 提示新闻内容。新闻标题是以最精炼的文字将新闻中最重要、最新鲜的内容提示给读者。
② 评价新闻内容。标题不但要简明扼要地介绍新闻内容，而且要能够体现对新闻内容的评价。一个好的新闻标题具有鲜明的思想性，它不仅能向读者提示新闻内容，而且能帮助读者理解新闻内容的性质和意义。
(2) 新闻标题的组成要素。
① 用一个动词来描述该新闻的目的，如说明产品或公司发生了什么。
② 着重表示该新闻直接涉及到的产品或企业。
③ 用提示语激发浏览者的兴趣，如用字样表示新闻是最新的或加一个“new ”图标。 ④ 将新闻日期置于标题的结尾。
(3) 新闻标题的版面布置。
主页中新闻标题的版面布置要简单、清晰、引人注目，通常采用以下几种方法。
第3章 电子商务网站前台用户系统设计·69·
①新闻标题的排列按降序进行排列，最新的新闻排在顶部，最旧的新闻排在底部。
②在新闻标题前采用项目符号、项目编号或小图标作点缀，增加页面的可读性。
③将新闻标题的列表放在一个可上下滚动的窗口中以容纳更多的新闻。
2) 新闻页面
新闻页面要满足易于导航的要求，首先要方便用户从新闻页面到网站中其他内容页面的跳转，其次还要方便用户迅速地到达其他的新闻页面。通常可以在新闻页面中通过以下几种方式来实现。
(1) 建立科学的菜单栏导航系统以便于实现新闻页面与网站中其他页面间的无缝跳转。
(2) 建立与前面或后面新闻的链接，以便于用户浏览。
(3) 通过检索和搜索引擎使用户可根据时间或内容查看其感兴趣的新闻。
(4) 在新闻页面中包含与该新闻有关的图片、声音或其他多媒体文件。
(5) 将新闻中出现的关键字或人名链接到其因特网页面上或其E-mail地址。
(6) 添加客户、舆论对该新闻稿主题的见解，丰富新闻内容。
2. 产品页面设计
电子商务网站产品页面通常采用信息分层、逐层细化的方法展示公司产品或服务。所谓信息分层就是按一定的分类方法将信息放在不同的页面上详细介绍，从而使用户能找到最适合他们需要的信息层。比如，首先建立一个产品/价格清单(第一层)，该清单允许用户为每一项选择一个产品页面(第二层)，这个页面又能引出具有详细信息的页面(第三层)。层的数量不做限制，如果三层不够，可以进一步建立具体到多个按产品系列或公司业务领域分类的产品/价格清单的链接页面。每个信息层都允许用户在相应的信息深度范围内通过导航条进行浏览。
产品页面主要内容应包括因特网产品/价格清单、单个的产品页面、产品名称到产品页面的链接，还可以利用高级的表格给目录增加新的风格和生动的图像。产品页面的创建主要在于掌握产品目录的层次结构和导航方法。产品目录设计的思想和整个站点结构的思想是一致的，都是由概括到详细的层次结构。这样，首先就要将信息分层，将它们放在不同详细程度的页面上，从而允许用户能够自上而下找到最适合其需要的信息层。
通常把产品目录分为三层。
第一层：首先建立一个产品/价格列表，该表使用户能够全面浏览公司的产品。
第二层：对应每个产品的页面，该页面将对此项产品的有关信息进行全面的介绍。
第三层：产品更深层次的信息。如果浏览者还要深入了解该产品的技术细节、设计维护等，可以通过本页面获得这些信息。
如果浏览者对第三层的信息还不满足，我们可以建立第四层以进一步描述信息。
总之，产品页面应尽可能包含产品的有用的信息。同时要操作方便，应包含站点的导航菜单及其到产品/价格列表目录的链接。另外要注意的是，不要在产品页面上设置太多无用的链接。
3. 客户支持页面设计
在设计客户支持页面时，尽可能地站在客户的角度，预测各种潜在的需要，向客户提供有用信息，使他们对企业和产品产生亲切感。我们利用因特网这种服务工具，目前，因
·69·
电子商务网站设计与管理
·70· ·70·
特网的最佳用途可能是与消费者通信并为其提供服务。许多用户上网并不是要购买，而是要寻求帮助，因特网站点应尽其所能为客户提供服务和技术支持。令人满意的服务能更好地满足客户需求，这种投资必定会获得回报。
支持页面的内容不受限制，既可以帮助用户了解购买方法，也可以对产品的行业信息进行咨询。
4. 企业信息页面设计
网上企业的特点之一是企业资信不易确定，这是网上购买者不轻易下订单的主要原因之一。 因此，企业应尽量提高企业资信的透明度，让浏览者了解企业的状况。企业信息页面能达到这个目的，它主要包括公司状况、发展规模、与投资者关系等页面。
3.2.3 实训步骤
实训：设计美滋滋瓜子网站的二级页面。
(1) 设计美滋滋瓜子网站的二级页面页头，如图3.18所示。
图3.18 二级页面页头
(2) 设计新闻中心页面。
新闻中心页面设计要求页面简洁与清晰。该页面包括行业新闻与企业新闻两个栏目，新闻发布顺序由新到旧，并从上到下依次排列，如图3.19所示。
图3.19 新闻页面
第3章 电子商务网站前台用户系统设计 ·71·
·71·
(3) 设计企业信息页面。
企业信息页面设计要求突出企业形象，展现企业文化。该页面从公司简介、企业荣誉、企业文化、企业发展这4个方面来介绍
企业，如图3.20所示。
图3.20 企业信息页面
(4) 设计产品页面。
产品页面设计要求条理清晰、便于查找。该页面将产品按类别分类，如图3.21所示。
(5) 设计订单页面。
订单页面设计要求订货过程简便，操作性强，如图3.22所示。
电子商务网站设计与管理 ·72·
·72·
图3.21产品页面
图3.22订单页面
第3章 电子商务网站前台用户系统设计·73·
(6) 规划其余二级页面，完成所有二级页面设计。
3.2.4 思考与练习
(1) 电子商务网站的二级页面通常有哪些内容？
(2) 新闻标题的特点与版面布置是什么？
(3) 为卡西欧手表销售店设计二级页面。
(4) 分析阿里巴巴网站的二级页面。
3.3 实训项目三电子商务网站界面艺术设计
3.3.1 实训目的与要求
电子商务网站在满足网页功能需要的前提下，需要有针对性地采用一些美的形式。美的形式规律同现代的网页设计的具体问题相结合起来，会使网页更加有生气，更吸引人。通过本项目的实训与练习，使学生熟悉电子商务网站界面艺术设计形式美的规律，掌握界面设计的创意方法，构造出视觉冲击力清晰、张力巨大的电子商务网站。
3.3.2 实训预备知识
1. 界面艺术设计形式美规律
自然界的万事万物，从宏观的宇宙到微观的原子、分子，到处都存在着内在的规律性。在形式美感方面，对自然和人为的美感现象加以分析和归纳所获得的共同结论，是人们对外在形式秩序的理解，这些艺术原理是人们解释和创造各种视觉表现形式的主要依据。在网页界面艺术设计过程中，设计者必须去研究、掌握并主动有意识地运用形式美的规律，才能创作出好的作品。
1) 统一和变化
统一是部分之间的内在关联，而变化是各个组成部分之间的区别。在网页设计中运用统一与变化的规律，是处理形象和组织的对立统一过程。完美的网页设计，形式上要丰富而有条理；组织上要有秩序而不单调、不混乱。在网页设计中恰当地利用这种规律，在把大量的信息发布到网页上去的时候，考虑怎样把它们合理地用统一的方式来布局编排，使页面丰富而更有生气，使网站作品整体感强同时又有变化，看起来就不会感到枯燥。很多网站在编排新闻时从上到下几十条，没有一点变化，显得单调乏味，就是违反了这种形式美的规律。所以在编排的形式上或者颜色上都可以充分地运用变化来改进它。
2) 条理与反复
条理是“有条不紊”，是对事物有规律、有秩序地组织和安排，是使物象单纯化、统一化。反复是“来回重复”，是有规律的连续与延伸，有组织的变化与扩展并加以归纳，概括而富于条理化。条理与反复即有规律的重复。条理与反复的原则是页面整体的秩序美的基础，是变化中的统一，也是运动发展中求得协调一致的表现方式，由它可以演化出多种多样的图形变化。由于很多网站内容丰富，信息含量大，不得不运用一定的方式将其条理化，同时又在一定程度上对其加以归纳，然后再重复地利用。这样就使网页较为整齐，脉络清
·73·
电子商务网站设计与管理
·74· ·74·
楚，同时读起来也能找到重点。这种法则在很多优秀网站中都得到体现。当然，内容较少的网站同样需要条理与反复，以达到富有变化和更为清晰的视觉效果。比如文字的合理编排、图片和文字的结合、页面的相互呼应等。
3) 对比与调和
对比是指在质或量方面相互差异较大的两个要素同时配置在一起时，由于两者之间有相互作用的特点，更加令人感到彼此强烈地相互衬托。对比是为了使主题画面具有变化和生气而运用的方法。而调和是构成美的对象在部分与部分之间的相互关系。它无论是在质的方面还是量的方面都没有矛盾，各部分所传达给人的感受和意念不是相互分离或排斥，而是通过部分多样性的整体统一来表现美的状态。在网页设计中，可以利用对比与调和来达到很好的效果。首先合理地利用对比的因素，例如文本的编排、字体的大小、字体的粗细、字体的颜色、图片的宽窄、比例的反差、透明度的大小以及位置的放置等，最终达到的目的就是取得较为强烈的视觉效果。不仅如此，还要恰如其分的利用调和因素，即构图的联系点，使整体感觉突出，不至于因为对比而造成割裂的感觉。只有做到对比与调和的相辅相成，才能使网页页面鲜明、突出，更好地传达出设计者的意图。
4) 对称与均衡
对称是指形态以某一点为中心，其左右或者上下因同等、同量、同形而形成的平衡。对称的形式法则是自然法则在设计上的具体体现。对称包括以中轴线为轴的左右对称、以水平线为轴的上下对称和以中心点为基准的放射对称。对称的网页设计稳定、庄严、整齐、秩序、安宁、沉静，如同中国古代宫殿一样庄重、严肃，体现了一种古典主义的风格。当然在设计时片面地追求静止的对称，那是僵硬的、不生动的，同样会失去美感。均衡是指版面以某一点为中心，左右或者上下等量不等形的配置。均衡是一种造型上有变化的平衡状态，它具有变化的统一性。它揭示了形式内在的、含蓄的秩序和平衡，体现了造型动与静相结合的动态之美。均衡的形式灵活且富于变化，易于产生现代感。进行网页设计时，根据内容的逻辑性，将各要素按主次、强弱关系进行设计，将会获得视觉上的均衡感。表现为呼应关系或起承关系，即由一个要素转移至承接它的另一要素，二者之间必然产生呼应关系，引发浏览者的情感效应。对称与均衡都是平衡的。平衡使人产生稳定、平静、安全、信任的心理感受，而不平衡则给人以危机感和不信任感，给统一的整体造成干扰。
5) 节奏与韵律
运动中的事物都具有节奏和韵律的形式规律。节奏是指单体按照一定的条理、秩序、重复连续地运动，形成一种律动形式。节奏本身没有形象特征，只是表明事物在运动中的快慢、强弱以及间歇的节拍，它带有机械的秩序美。韵律是一种规律性的变化，是比节奏更高一级的律动。韵律是每个节拍间运动所表现的轨迹，它带有形象特征。在具体的网页设计的运用中，按钮的编排就经常会遇到这个问题。如果按钮做得好能够使排在一起的诸多按钮富有音乐般的美感，同时丝毫不损其实用性。运用节奏与韵律的形式法则，能创造出形象鲜明、形式独特的视觉效果，表达轻松、优雅的情感，使网页界面产生不可思议的活力与魅力。
2. 界面设计的创意方法
在页面艺术设计中，针对不同的信息要求，可以采用不同的创意方法。
1) 针对不同信息类别采用不同的创意方法
不同类别的信息需要实现的社会效果截然不同，所以在设计上也不能相同。时尚类产
第3章 电子商务网站前台用户系统设计 ·75·
·75·
品的网站与传统类产品的网站，设计起来就差异很大。时尚类产品的网站页面设计相对来说比较夸张、图片较多，而传统类产品的网站通常信息条目清晰，页面整洁、舒服。
2) 针对不同信息受众群采用不同的创意方法
不同年龄、性别、职业、文化程度、社会地位的人，有着不同的心理特征、理解能力和爱好。在设计时应先明确是针对怎样的信息受众群，然后采用他们能够并愿意接受的语言方式以及视觉形式来有效地表述信息。例如，儿童类站点、男性类站点和女性站点等分别针对了不同的人群，对设计的要求也会截然不同。
3) 针对不同传播竞争对手采用不同的创意方法
在创意之前，应先对竞争对手予以研究，做到知己知彼，然后采用相应对策，才能使设计在竞争中脱颖而出。这里说的竞争对手是指两个方面：一是同行业者和同类信息的传播者；二是在信息媒介中并列相处的其他具体信息媒介。
4) 根据不同条件采用不同的创意方法
任何设计最终都要体现在不同的媒体和材料之上，而各种媒体形式、不同的媒介材料均有其表现上的优势和劣势。一个纯HTML 的静态页面设计和一个要求使用Flash 动画来表现的页面设计，它们的处理方法也是不同的。静态网页要求强调其页面插图的精美、结构的精巧，而动态效果则要注意其可以展示的互动效果和视觉冲击力。
5) 根据不同时机采用不同的创意方法
在网站改版前后需要整顿栏目设置、调整信息内容，并且针对前一段时间的不足去规划下一步将要做的事情。每逢节日庆典，则应根据不同的节庆设计出不同的页面来表示喜悦等。
3.3.3 实训步骤
实训1：分析图3.23、图3.24、图3.25远洋城网站界面
艺术设计的形式美规律。
图3.23 远洋城网站页面(1)
电子商务网站设计与管理
·76· ·76·
图3.24 远洋城网站页面
(2)
图3.25 远洋城网站页面(3)
远洋城网站在界面艺术设计时充分运用了对比与调和的表现手法。在图3.23、图3.24页面中既存在方圆、曲直、大小、彩度的对比，又在字体、色调等方面协调统一，让浏览者浏览后在心理上获得平衡与满足、在精神上产生一种高层次的审美快感，达到了美学中多样的统一。
在图3.25页面中平面与立体之间的空间对比、剪影人像与立体人物的造型对比强化了视觉效果，同时又统一在网站的整体风格中。
实训2：分析图3.26艺泰安邦房产网站界面艺术设计的形式美规律。