电子商务的网页设计篇（1）

关键词：电子商务；网页设计；感性；理性

引言

自互联网的出现，人们的生活不再受时间和空间的限制，人们可以随时随地的与地球上任何一个地方的人进行沟通交流，拉进了人与人之间的距离。在因特网的大背景下，电子商务出现了，它是以信息网络技术为手段，以商品交换为中心的线上商务活动，这个世界是网络的世界，没有人或者企业可以忽视网络的力量。国内，线上电子商务活动主要是基于阿里巴巴网络平台，而线上网络平台需要吸引客户来购买卖家的产品，这就需要卖家将自己的产品呈现在客户面前，这就往往需要借助于网络网页设计，有人调查，网络店面越符合人性化，产品就卖得越好。当然此处说的人性化自然是将产品真实的展现在客户面前，同时添加一些理性和感性的思维，达到吸引客户的作用。

1.现代电子商务中网页设计的重要性

电子商务是近些年来发展迅速的一种从事经营和商务的一种主要形式，其涵盖的范围广泛，主要包括国内和国外两大板块，主营国内的是国内电商从下单到采购到发货到收货等一系列流程，主营国外的是跨境电商主要平台是阿里巴巴国际站等，主要客户是国外客户，也是从采购到收货等一系列流程，只是客户对象不同。无论是国内还是国外电商都离不开店面网页的设计，产品的展示等步骤。只有将产品真实的展示在客户面前才能赢得客户的喜欢，在网页设计中加入合适的理性元素和感性过程可以让产品更好的的展现在客户面前。总的来说，就是增加网页设计的视觉效应，给用户一个更佳的购物体验。

2.网页视觉设计的理性过程和感性思维

何为理性过程？理性过程是指由概念，判断、和推理过程得出的客观的结论，它是认识高级事物，抽象思维的一种概括和反应。不加任何感彩，客观的分析事物的本质，有利于提高对新事物的认识。在B2C的模式下，设计师应抓住产品的优势，放大其优势特点，客观的描述产品在各个方面的性能，同时对页面图片的处理也有较高的要求，这些都是从理性的角度进行网页设计。那在电子商务网页设计中加入理性元素又有什么作用呢，在网页设计时，设计师们会在设计网页前对目标群体有一个清晰的定位，明确目标消费群体对于网站页面的直觉反应。从而增加消费者的消费欲望，为电子商务卖家增加资金收益[1]。

另外在进行网页设计时，考虑客户的感性因素也有利于提高经营者的收益。感性因素大部分情况下都是客户自己主观的感情，在设计网页之前感受用户的心理体验尤为重要，用户的感性体验通常包括选择产品，选择店面，店面停留时间，这些都是客户主观决定的。比如，同一个产品不同的店面该如何选择，相同功能的两个产品该如何选择。店面是否吸引客户等等都是感性认识，那么设计师如何在设计网页时加入这些感性认识的因素呢，通常设计师们会将用户按性别、年龄、教育水平，婚姻状况分成不同人群。这些人群因为不同的工作生活环境养成了不同的购物心理，也因为环境产生巨大差异。因此设计师们需要综合考虑不同的人群设计出最优的设计方案。

3.电子商务视觉设计的理性过程

（一）科学合理的网页布局

电子商务网页布局的重要标准是使消费者能够快速方便的访问电子商务页面，短时间内快速的获得消费者需要了解的信息，井然有序的陈列出商家的特色商品，供消费者选择。当然，电子商务网站具体需要选择怎样的结构形式是由不同的营销内容和不同的网站性质所决定的，因为页面的结构布局对消费者来说是第一视觉感受，起着至关重要的作用。

（二）电子商务网页设计中色彩设计

色彩在我们日常生活随处可见，无论是衣食住行还是大自然的花草树木，都无处不在，那么在网页设计中该如何巧妙的利用色彩呢，如何才能作出让访问者亲睐的适合电子商务网页的色彩呢。想要自己的网页与总不同，色彩的调配是网站成功与否的决定因素。在电子商务的网页设计中色彩的恰当使用对网站受众具有强烈的吸引力[2]。

（三）电子商务视觉设计中的图像设计

整个电子商务店面除了良好的产品展示，色彩调配，图像设计也至关重要，在整个设计中图案设计不是单纯的用来装饰或者表面的，图像与文本结合起来更是一个店面的核心内容，图像作为门面的第一感觉，在消费者眼前起到了主导的位置，不难理解，消费者打开店面首先映入眼帘的便是图像和结构框架，它第一时间让阅读者接受信息并产生记忆和感受，因此对图像的真实处理会给店面带来意想不到的效果。

结语

在现代生活中，网络广泛普及，互联网的应用极大推动了电子商务的发展，人们日常生活当中无处不见互联网的应用，加强电子商务营销的各种方法，电子商务PHP网页设计表现尤为突出，也是其中的一个关键因素。同时电子商务网站也越来越受消费者的关注，在设计师设计网站页面时首先要做的就是对页面的定位，定位包括消费人群的定位，卖家对店面的定位然后才开始对网站进行一个结构框架的定位，一个好的设计师是不会在不知道网页定位的情况下，开始贸然搭建框架，配置色彩等等。

直观的判读、理解客户的理性过程和感性认识是制作电子商务网页设计的前提。只有明确的理解了网站的具体目标，产品定位，才能对症制作符合其特点的网站，电子商务网站的网页设计是设计师在对营销主体以及消费群体有了感性认识后，尽可能的满足其情感上的需求和理性认识过程中所体现的视觉需求。科学高效的完成对电子商务网页设计的任务，站在经营者的角度，以尽可能获得最大的效益为出发点，综合考虑消费者理性认识和感性认识的影响，做出最符合要求的电子商务网页。

电子商务的网页设计篇（2）

扁平化设计

密斯凡德罗的“less is more”是对扁平化设计风格的最佳诠释，这种极简主义的设计风格，抛弃了拟物化设计中的一切阴影、纹理、高光、渐变等拟真的视觉修饰元素，将简洁明了的艺术语言应用到设计之中。扁平化设计中往往采用单一的纯色块和简单的图形元素进行组合设计，以达到直观易懂的界面视觉效果。所以扁平化设计的原则就是：单纯色块、色彩艳丽、抛弃特效、拒绝阴影，利用简单的设计元素与用户产生交互。扁平化风格以其新颖简便的设计美学深受设计师及社会大众的喜爱，其鲜明的设计特色让人印象深刻，记忆犹新。

扁平化设计的优势与特性

相对于追求细致逼真“隐喻”效果的拟物化设计而言，扁平化设计丝毫不掩饰其鲜明的极简主义特色，不仅能够给于用户简洁明了的视觉感受，而且能够在人机交互上带给用户舒适便捷的交互体验。为了让扁平化设计的简洁性达到极致，设计师们往往将矩形、方形、菱形等简单的纯色块与素雅的无衬字体相结合，这样既能够在保持高度交互性的前提下降低设计成本，又能保证界面的直观性及易用性。

极简主义是由具象视觉到抽象视觉的一个变化过程，扁平化设计的极简主义特性并不是一味的只做减法，去除不必要的图像与色彩让界面变得更加简单，而是从心理学、人机工程学、人类视觉原理等学科角度出发，针对轮廓的形象思维进行界面优化设计。其真正极简的宗旨在于使简化后的图像元素在视觉传达过程中让用户顺利的感知，并最终服务于便捷的人机交互体验。如此极简主义的扁平化风格在目前的电商网页界面设计之中是具备了实际应用价值的。

扁平化与电子商务结合的历史必然性

随着天猫、淘宝、京东等电子商务平台的不断兴起，人们对于电商网页视觉界面设计的需求也越来越高，但是目前许多电商网页因其复杂烦琐的视觉设计效果，无法在第一时间让用户接收到店家所要传达的讯息，也使得用户无法快速准确的挑选到自己所要购买的商品，从而遭到“选择性观看”的待遇，增加了网页跳失率。而扁平化设计以其极简主义的鲜明特点很好的弥补了这一不足，其简洁明了的视觉效果设计，不仅减轻了烦琐界面带给人的视觉疲劳，让浏览者在选择购买商品时更加便捷，而且也因其舒适简单的操作体验给人完美的互动享受，从而提高用户在网页中的停留时间、访问深度、点击率，提升转化率。所以极简主义的扁平化风格在目前的电商网页界面设计之中是具备实际应用价值的，扁平化与电子商务的相互结合并不是偶然产生的而是当今主流设计发展的必然趋势。

扁平化电商网页整体风格设计

电商网页界面设计应遵循一定的规律，符合一定的设计原则。通过对网页布局和编排的严格要求、反复推敲，使店家所要传达的信息在扁平化网页设计中展现的更加清晰合理，给于用户一个轻松愉快的视觉交互体验。

1.页面整体布局

将扁平化设计简约时尚的设计理念运用于网页整体布局之中，对店铺LOGO、Banner广告、按钮及页尾进行扁平化处理使其更加直观易懂，使客户操作更加便捷，从而提升人机交互的舒适性。注重首焦与次屏中图片与文字的整体布局，及二者所占版面的比例关系，加大图片所占用的面积，这样能够更加直观地展现店商所要传达的讯息，增强客户的浏览兴趣，提高购买欲。

2.网站的商品展示区域设置

商品展示区域是电商网站构成要素中的重要组成部分，应用扁平化设计原则将该区域进行块面分割设计，增强不同商品之间布局的灵活性。用纯色块作为商品标价及按钮的背景图片，抛弃一切装饰元素，让信息传递更加直观易懂，提高点击率。

3.网页色彩

2014年流行的柔和色彩在扁平化电商网页设计中运用的越来越广泛。这样的色彩基调将在2015年得到进一步的延续，马卡龙色系随之也逐渐为人熟知出现于各类网页设计之中。网页的色彩规划需要看整体，而不能针对性地看局部。网页中色彩的合理搭配往往是表达网站思想和意图的一部分，属于优秀网站构成要素中的一个关键环节，所以在电商网页设计中为了让色彩与色彩之间真正融合，可以选择素雅的粉彩系透明色，让网页看起来清新脱俗，提高客户浏览欲望的同时也增强人们内心的情感共鸣。

4.扁平化首屏

首页的首屏位置在整个网站中都称得上寸土寸金，正因为如此，此处展示的图片与文字更应该简约精悍，采用扁平化设计理念尽可能用精炼的图文搭配把信息表达清楚。首屏中包括了Banner广告、导航条、店招等视觉元素。运用扁平化设计原则在Banner广告中，将不同色彩的纯色块依据一定的规律按照主次空间大小关系进行合理的搭配组合，并配上简洁明了的产品图片，在视觉及感官上增强广告带给人的舒适感，降低视觉疲劳；为了让用户在浏览网站过程中不至迷失，并且可以轻松便捷地定位到其他相关内容的页面，将导航条扁平化，去除导航栏背景色块的质感、渐变，改用纯色替代并配上相关文字信息。这样的设计可以使文字信息更加清晰直观地表达出来，符合网页扁平化的整体风格，给人予流畅的视觉体验；店招是电商首屏构成中不可或缺的一部分，集品牌定位、产品定位、价格信息于一身。浏览者通过搜索进入详情页，首先看到的也是店招，第一眼的印象判断往往对用户是否选择进入店铺首页浏览其他商品起到了一定的作用，用扁平化的设计理念将店招背景图片用同类色块或对比色块进行切割组合设计，并在一定程度上降低色彩的纯度以突显文字信息，加强店招版面的视觉冲击力。

5.字体设计

字体的编排与设计对于一个成功的电商网页而言是至关重要的，扁平化设计中除了注重文字字段之间的合理区分之外，也对字体的选择与字形的轮廓有一定的要求。为了与扁平化简约时尚的整体风格相呼应，在字体的应用上往往采用简单素雅的无衬字体进行编排设计，这样能够使电商网页内容更具活力与灵动性，便于用户阅读。

6.图片

在电商网页中图片所占比重最大，图片的优化设计对于提高用户点击率、停留时间及访问深度起到决定性的作用。极简主义的扁平化视觉图像是当今设计发展与指示符号进化的必然结果，图片显示区域抛弃一切多余的细节与装饰，拒绝渐变与阴影，这种设计方式更利于产品图片的展示，便于用户在第一时间接收到图片所传达的信息。

7.优化层级

电子商务的网页设计篇（3）

在版式设计中，我们最常用的几种对比：图形对比、颜色对比、面积对比、粗细对比、质感对比等，这些对比都需要建立在画面平衡的基础上，一旦失衡，我们的对比手法将不再起作用，那将是打破常规的不规律美学原理。在保持画面平衡的基础上，采用图形对比和颜色对比也可以起到一定的强调作用。在网页设计中常常用到的十三种类型分别是：骨骼型、满版型、上下分割型、左右分割型、中轴型、曲线型、倾斜型、对称型、重心型、三角型、并置型、自由型和四角型。这些常用的类型目的在于将内容利用版式设计的变化分割出重点与次要的关系，以达到内容本身表现出来的清晰美观。骨骼型，是最普通的类型，通常以竖向分栏为多；满版型，将主体物占据整个版面，一般以图像为主，给视觉强烈的冲击力，能够立马抓住视觉眼球。上下分割和左右分割型，就是将画面进行分配，其中文字与配图组合根据画面的需要进行合理选择。中轴型，就是将图形以竖轴或者横轴方向进行排列。曲线或者倾斜型，都是讲版面进行结构上的安排，如进行曲线排版或者倾斜排版。对称性，我们不言而喻，就是将版式进行有规律对称的完整性进行的设计。重心型分别有向心型和离心型，向心型主要向里聚拢而离心型向外扩撒。中轴型加重心型，这种版式比较新颖，不是完全的对称型，主要集中在一边字体排版上，比较讲究一种字体粗细大小的不同设计，色调也比较统一，采用黑白灰的形式居多。三角型就是在画面版式上构成三角的稳定结构。四角型，我们也常见，但是这个版式在构图上有点过于僵硬，就是版面的四角以及连接四角的对角线结构上进行的编排。并置型和自由型，在设计中版面的要求可自行進行选择，也可以根据位置的不同主观的重复编排。 

电子商务的网页设计篇（4）

一、电子商务的概念

电子商务是各种具有商务活动能力和需求的实体（生产企业、商贸企业、金融企业、政府机构、个人消费者等）为了突破时空限制，提高商务活动效率，降低交易成本，而采用计算机网络和各种数字化传媒技术等电子方式实现商品交易和服务交易的一种贸易形式。[1]按照戴建中所著《电子商务概论》中的表述，电子商务的定义包括广义和狭义两种。狭义的电子商务是指通过使用互联网等电子工具在全球范围内进行的商务贸易活动。[2]一般来说，比较多的学者采用狭义电子商务定义来阐述相关的电子商务概念，目前我国大多数普通高等学校电子商务专业都是按照狭义电子商务定义来设置课程的。本文所有以下论述均按照狭义的电子商务概念涵盖的范围进行阐述。

二、美术设计与电子商务的结合形式

由于电子商务这种贸易活动中，消费者是通过访问商家介绍商品的网页来获取商品相关的信息的，所以这与传统的实体店销售有很大的区别。传统的销售方式，消费者是到卖场直接了解或试用商品，而电子商务活动中，商家需要制作详细的商品介绍页面供买家浏览，以获取商品详细信息，而这些信息主要是通过网页的设计与制作来实现的。所以，美术设计与电子商务的结合形式主要体现在网页设计（非印刷形式），另外，还有与电子商务相关一些宣传单、宣传画册、促销广告、退换货回单等印刷形式。

（一）非印刷形式

非印刷形式，按照网站的基本架构来分，主要可以分为网站首页、框架页和商品详情页。网站首页一般主要有两种形式，一种是以企业形象（或网店形象）展示为主，另一种是信息罗列型。[3]网页首页的设计非常重要，这关系到消费者对企业的第一印象，所以，需要设计者具有良好的审美能力和设计能力。好的首页设计，应该能够恰当地体现企业性质、企业精神和企业文化，在消费者心中树立起初步的良好的企业形象，进而让消费者对企业的产品或服务产生信任感。框架页是网站的主要结构页面，又称次首页，大型网站往往框架页即首页。因为内容繁多，这就要求框架页的设计结构和布局合理、分类明确、简洁明了，以利用于浏览者快速找到自己需要的相关信息。对电子商务类的网站而言，商品详情页是消费者了解商品和服务的最基本最主要的形式，也是页面停留、浏览时间最长的一种网页形式。详情页设计的好坏，直接关系到消费者对商品的认知和评价，直接关系到从浏览到购买的转化率。

如果按网站的基本构成要素来分，非印刷形式包括文字、图片、色彩和版式；如果按电子商务网站的基本构成版块来分，则主要包括以下主要内容：网站标识、网站导航、分类信息、网页广告；商品详情页的商品主图、标题、商品制作或使用中的详细展示、产品细节展示、使用说明、同类产品对比和售后服务承诺等内容。在设计、处理这些内容时，一定要注意各层级页面在风格、色彩等方面的整体感和统一性；商品详情页的页面设计还要做到主次分明、条理清晰、版式美观、清晰明了，否则，很容易因为条理性差、内容零散冗长、色彩杂乱等因素，让浏览者产生厌烦和抵触情绪，从而失去详细了解商品的耐心和兴趣。消费者一旦离开页面，就相当于流失了顾客，本质上就是一种无效浏览，直接影响网店的转化率。

（二）印刷形式

印刷形式和传统的商贸活动中用到的美术设计类型没有什么太大差别。主要形式有：名片、商品内外包装、随商品寄送的商品说明书、商品广告单页或小画册、促销活动广告、退换货回执单、赠品等等。这些形式人们都已经十分熟悉了，在此不再赘述。不过，除此之外，也出现了一些比较新颖的形式，比如，有的商家会以手写或手绘与电脑设计相结合的形式，给买家写一封信，随商品一起寄送，达到沟通商家和消费者之间情感的作用。这种信的语言和信纸一般都经过精心设计，由于形式独特，且看起来用心良苦，所以比较容易在消费者心中产生一定程度的好感。

三、美术设计与电子商务专业结合的发展状况

如前所述，电子商务的迅猛发展对很多领域都产生了十分深远的影响，由于电子商务这种销售方式的特殊性，使其与美术设计产生了非常紧密的联系。这至少体现在两个方面：

第一，出现了大量电子商务领域内的专业美术设计师。就拿中国来说，光著名的大型电商网站就不少，如阿里巴巴、淘宝网、京东商城、唯品会、当当网等，以淘宝网为例，专业女装的天猫商家目前有2071家，而淘宝普通女装店铺达到惊人的2094886家（2016年7月16日搜索结果），而这个数字，每天都被刷新。这么多的店铺，每一个店铺又有那么多的在售商品，每一件商品都需要专业的美工设计师将它们在网页上一一展示出来，从事电子商务的商家们都意识到视觉营销的作用和力量，所以每一个商家都缺不了几个专业美术设计师，这催生了一个新的就业岗位――电子商务美术设计师。比起一般的网页美工，这个岗位名称体现出分工更细致、更具体、更专业的特点。可以说，随着电子商务的发展，这必将是一个更加广阔的就业领域和空间。

第二，催生了中高等相关专业教育课程体系内容的更新。因为市场对专业电子商务美术设计师有如此之大的需求，市场需求会倒逼人才培养的类型。现在，电子商务专业的学生必须知道一些艺术设计相关的美术知识，艺术设计专业的学生也不能对电子商务相关的计算机和网络技术、软件和广告营销等知识一无所知。因为，这两种看似互不相干的专业已经彼此渗透、交织在一起了，相关各专业之间的差别已经没有那么界限分明了，而是在某些方面必须互相结合，才能使自身更加完整。

（作者单位为江西省九江学院艺术学院）

[基金项目：本文系2014年江西省艺术科学规划一般项目，项目名称：平面设计与电子商务的专业结合及发展状况研究，项目负责人：何海燕，项目编号：209。]

参考文献

电子商务的网页设计篇（5）

网页设计与制作是技工院校电子商务专业的核心必修课，课程培养目标是从事网站建设与维护、网页美工等岗位的高技能型人才。因此，网页设计与制作对于电子商务学生就业具有举足轻重的作用，值得电子商务专任教师高度重视，并在教学中不断探索与改革。

一、技工院校电子商务网页设计与制作课程教学中存在的问题

近几年来，随着技工院校内涵建设的不断深入，教学改革取得了一定的成效。技工院校创新教育、专业建设等教学成果也频频出现在研究文献中。但是，在网页设计与制作课堂教学方面，研究成果非常少。为此，笔者对本院和兄弟技工院校的电子商务专业网页设计与制作课程教学进行了调研，对国内学者有关网页设计与制作课程教学的文献进行了综合分析，然后结合自己的教学实践，综合得出该课程教学存在以下问题。

1.教学内容设计不合理

虽然大多技工院校所选择的网页设计与制作授课教材是基于一定的教学方法编写的，比传统教材更为合理。但是，在教学实践中普遍存在老师直接按教材编排的内容顺序从头讲到尾的情况，教学效果并不理想。比如，笔者学校选择张苏中、吕威飞、尤胜编著的《网页设计与制作》（高等教育出版社出版，2014）。这本教材是按项目教学法编排的教材，以了解网页设计工作、元素的添加与操作、页面布局编排等项目进行编排内容，虽然符合从易到难的规律，但是，设计的不同项目选择了不同的网站实例，并不能使学生了解网页设计的全貌，不利于课程教学目标的实现，而且该教材很少有关于网站维护管理以及网络编辑等的内容，没有考虑到电商岗位要求学生掌握商品图像处理、网页的美化等技能训练的需要。这样的教学内容设计，导致培养的电子商务毕业生与社会实际需要的人才脱节。

2.教学案例不连贯

电子商务网站是一个完整的系统。网站各网页的设计应该围绕某一个或者某一些产品进行营销服务，因此，设计的各网页应该考虑整体风格。但是，在实际教学中，老师依照教材提供的案例进行教学，各案例主要是服务于本项目的教学任务，彼此之间缺乏统一性，导致各案例成为“孤岛”，比如我院选择的张苏中等编写的教材共涉及10个项目，每个项目各有一案例，案例之间缺乏整体性。这往往会影响后续学生实践教学的效果，难以培养学生独立完成一个完整的网站。

3.课程与专业的关联性不强

从调研结果发现，许多技工院校老师在讲授网页设计与制作课程时，在处理教学内容等只考虑该课程，而没有和专业建立必要的关联性。该课程培养目标是能适应电子商务企业工作岗位的人才，因此，教学中应该把握商务特点，而不能一味地为讲技术而技术。

二、技工院校电子商务网页设计与制作课程教学建议

针对以上存在的问题，笔者根据自己多年的教学实践经历，结合当前技工院校电子商务网页设计与制作课程教学现状，提出以下建议，旨在抛砖引玉，与同行交流。

1.专业视角设计教学内容

电子商务专业课程应该考虑该专业的特征，也就是说，教学内容应该着重考虑“商”的特点，以某一产品营销平台构建教学内容，比如在讲授网页编辑时，可以按照电子商务企业岗位工作任务要求，把图像美化等内容充实到课程教学中，提高学生技能。

2.专业角度选择教学案例

教师在教学中，应该尽量选择完整的电子商务网站案例。假如不便于选择完整的电子商务网站案例进行课堂教学，可以在布置学生作业环节中以完整的电子商务网站内容安排课外作业。教师在围绕完整的电子商务网站案例教学时，可以将总教学任务分成若干模块，每一模块完成一定的教学任务，在结束整个学期的教学后，学生就能掌握网站建设的全过程技能。这种贴近实际工作的教学有助于提高学生就业的竞争力。

3.考核方式改革

该课程的考核可以采用“形成性考核+阶段性考核+终结性考核”的综合性考核方式。其中，形成性考核的内容包括学生出勤率、课堂表现、作业完成情况和平常实训教学中动手操作能力等，分值建议确定为考核总分的30%。阶段性考核指的是老师要求学生调研后，自己确定网站主题和网站策划书，自己完成创作过程，老师考核学生完成的最终作品，分值建议确定为考核总分的35%。终结性考核是老师提供模板网站，学生现场独立完成网站的制作（这是为了防止学生课外找而蒙混过关的有效手段），分值建议确定为考核总分的35%。

电子商务的网页设计篇（6）

（2）按照功能内容建立相应的子目录

为每个主菜单（主要功能）建立一个相应的独立目录。譬如，在“网上书店”这个实例网站之中，将邮箱列表以及用户管理等功能建立相应的目录。

（3）在每一个独立的目录之下，都建立独立的Images目录

在刚开始进行网站制作的时候，很多人都习惯将所有的图片存放在这个目录之中。但是在后来却发现极其不方便，经过多次的实践发现，为每一个栏目建立一个独立的Images目录，但是根目录下的Images目录仅仅用来存放首页上的一些栏目的图片。

（4）网站的文件名称和目录名称命名要规范化

在通常情况下，一个大型的电子商务网站均由很多的子页面组成，所以在设计的初期阶段，需要为网站设计一些合理且新颖的页面名称，这样以来不仅方面维护与管理，而且也能够使其快速被搜索引擎检索到[5]。

3 结束语

随着时代的进步与发展，人们已经不仅仅在于满足单调乏味的生活模式了，在这样的背景之下，互联网技术开始慢慢地融入到人们的生活和生产之中。这也就使得方便人们生活的电子商务日渐壮大起来。目前大多数人的生活，都开始与电子商务紧密地联系到一起，然而，电子商务的后台网页设计以及网页管理均之间关系到整个电子商务模式的运行。

总而言之，作为一个优秀的电子商务网站的设计人员，一定要将网页文件管理的因素考虑进去，设计出最优化的方案，从而方便网站的管理，为人民的生活提供更大的便利。

参考文献

[1]穆翠霞，周琳琳.电子商务网络资讯管理系统的设计与实现[J].电脑开发与应用，2014，10（4）：12-15.

[2]周艳萍，蔡玲.网页设计与制作在电子商务中的应用[J].电子商务，2016，8（6）：57-58.

电子商务的网页设计篇（7）

二、高职国际贸易专业《电子商务网页设计与制作》课程现行大纲

《电子商务网页设计与制作》课程作为国际贸易专业学生新增的一门必修课程，旨在通过教学使学生掌握电子商务网页设计与制作的基本知识与基本技能，即熟练掌握HTML语言的基本规则，运用DIV与CSS布局设置，使用网页编辑工具制作网页以网页的知识与技能，从而使学生更好地适应国际贸易专业的岗位需求。

该课程现行大纲包括以下内容：电子商务网站的定义及功能、电子商务网站的构成、特点和分类、电子商务网站的开发工具介绍；HTML简介、HTML概述、HTML文档结构、通用属性、文本格式的应用、标题标签、字体标签、格式变化标签、特殊符号、列表与超级链接的应用、列表标签；HTML超级链接、背景标签、背景颜色、背景图片、网页中的图片、显示图片、设置图片大小、边框、水平与垂直间距、图片对齐方式；网页中的表格、合并单元格、单元格对齐方式、表格背景、表格边框、单元格间距；网页中的表单的创建、表单元素的添加；CSS样式表介绍、字体设置、排版；颜色和背景设置、超链接设置；层的基本概念、层的基本操作、层属性设置、层边框、边距、使用层进行网页布局；CSS+DIV列表设计、CSS+DIV列表应用；CSS+DIV导航设计及应用；品牌销售网页设计、商品详情网页设计、促销专题网页设计、网页综合实训。

三、高职国际贸易专业《电子商务网页设计与制作》课程教学中的特点及问题

（一）课程教学中的特点

1.国际贸易专业的学生对该课程的学习表现出了浓厚的学习兴趣：该课程作为一门计算机技术类课程，在内容及上课形式上使学生感到新鲜这是他们对课程表现出兴趣的最初原因；其次，通过该课程学习，他们自己编写相关HTML文档，通过浏览器可以看到预期效果，是他们产生更为浓厚兴趣的根本原因。

2.国际贸易专业的学生对标记的理解与掌握较计算机类学生更好。通过分析，我认为国际贸易专业的学生较其他专业学生（比如说计算机类专业学生）具有强大的英语方面的优势，他们的英语功底普遍扎实，因此对标记的含义理解和记忆更为容易。当然作为文科生扎实的记忆功底以及良好的学风也不无关系。

（二）课程教学中存在的问题。

1.团队协作方面不够好。在实际工作中网页的设计与制作是需要多人合作完成的，但是在教学过程中存在这样的问题，让学生独立完成一个任务的效率通常要高于两人或多人的效率，尤其人数越多效率越低下。

2.网页设计能力较弱。由于没有先导课程以及课程课时相对较少，多数学生的网页设计能力相对薄弱。页面看起来很花哨，但是缺乏设计主题且页面之间风格无法统一，因此网页的视觉效果欠佳。

3.逻辑思维相对欠缺。在使用DIV进行页面布局时需要用到空间及数学计算等知识，但是由于专业特点，逻辑思维相比理工专业学生逻辑思维相对欠缺，对于空间及空间长宽计算处理能力较弱，甚至理解有一定困难。

4.课程与专业结合不够紧密。课程开设目的是为了适应国际贸易与信息化及电子商务技术的日益紧密融合。但是由于现行大纲教学内容设置以及授课教师对国际贸易专业了解把握度有限，使得课程与专业结合存在，但是不够紧密。

四、对高职国际贸易专业《电子商务网页设计与制作》课程的教学建议

1.在课程教学中融入对学生团队协作能力培养。

2.在大纲设计中突出网页设计能力培养。该课程的两个技能点是设计与制作，其中设计更难把握。由于没有先导课程，需要在课程中加大设计能力培养与训练，并相对增加这方面课程的课时量，相对应总的课时也需要相应增加。

电子商务的网页设计篇（8）

前言

互联网技术的推广与发展进程不断加快，对人们的日常生活与工作各方面都产生了重要影响。网页的设计与制作随着网络技术、科技水平的发展受到人们的高度重视，其主要是将网络作为主要载体，将各种信息以更加快捷、方便的形式传达给人们。根据相关数据统计显示，从事网页设计制作的人员达到了300万之多，但在网页设计发展过程中还存在诸多问题，因此应突破网页结构单一、空洞等问题才能将网页的设计与制作水平进一步提升[1]。

1Web标准技术概述

1.1Web标准内涵

Web标准不仅仅作为标准，其主要是对一系列标准进行组合。一般的网页中主要由结构、行为、表现三部分共同组成，并与XML、XHTML相对应，表现对应的标准可以将其成为CSS。1.1.1结构在结构中主要的技术可包含拓展超文本标记语言与可拓展标记语言，在网站王者设计中主要将其应用在网页数据分类以及整合方面。在两个标准中，XML的表现形式为源语言，其主要是让用户字自身的语言进行标记与重新定义，具备较强的数据转换功能。1.1.2行为在Web标准的行为中，主要包含ECMAScript[2]与对象模型。其在网页设计与制作中主要可以应用在交互式的操作网页文档方面。其可以将界面上操作对象实施的交互操作有效实施，利用DOM可对对象有效定义与修改，还可将对象之间存在的各种关系有效处理。1.1.3表现其中最主要的技术便是CSS，通常人们将其成为层叠样式表，在网站网页设计中可应用改在控制浏览器的显示方面，其也是决定网页设计风格的主要因素。

1.2基于Web标准前提下的网页设计流程（略）

2基于Web标准标准的电子商务网页设计与制作流程

在基于Web标准进行电子商务网站网页设计的过程中，主要包含内容分析、结构设计、方案设计三部分。在进行布局设计的过程中，可利用XHTML与CSS对页面进行合理布局，可实现网页布局的目标。在进行设局实际过程中，可利用CSS与美工设计元素互相结合，将设计方法转化为最终的网页。

2.1内容分析

网页设计作为视觉语言的主要表达方式，应进行合理的编排与布局，从而确保网页的布局更加清晰、合理、内容充实。在进行网页版面布局的过程中，应将网页设计的更加醒目，使用户在使用过程中对各项功能一目了然，其他部分的版面设计应与主页的风格保持一致。较为常见的布局模式包括国字型、厂字型等。本文将以汽车用品为主的销售网站作为案例分析，由于汽车商品类型多样[3]，在设计网页过程中，应将商品的导航以及产品展示作为重点。案例中采用的网页布局为框架型布局方式，可将页面分成各种模块。在网页左边为纵向的导航栏，右边则为商品的展示栏。在网页底部呈现了网站的基本信息与商家的联系方式等信息。在网页模板的顶部与底部都会出现在每一个网页的同一位置中。

2.2结构设计策略

在对汽车销售网站进行网页开发过程中，可将其乘坐为模板，将其抽象地分为不同区块，其中包含核心流程业务模块、展示功能模块等。在将模块开发完成后便可投入使用。在用户浏览、操作网页的过程中，程序员可通过后台进行可视化的管理与操作，用户可以将不同的模块进行拖放配置，构建个性化的网页布局设计，方便用户的使用与浏览。用户在操作汽车销售网页过程中，其中的框架作为页面的骨架，决定了页面的整体布局与模块摆放区域。框架通常采用的是HTML文件，其主要为了将页面进行区分，还会在适当的位置对模块进行放置，可用<{widgets}>代码进行表示，方便用户在使用过程中利用可视化编辑将模块进行合理配置。对于板块区来说，其能将汽车销售网站最为个性的地方进行呈现，可利用模块内容将网页的更新实现，在网页页面中的各个模块都有指定的ID，模块的区域能呈现竖向摆放的形式，或呈现多个商品内容。模块为独立形态，可对不同的边框进行切换，从而将呈现样式进行改变。在网页模块的顶部与底部都会出现在各个网页中的同一个位置，对于任何电子商务网站来说，应将网站顶部合理设计，才能拥有功能完善、结构清晰的网站顶部，从而提升网站的效益。

3结语

基于Web标准对电子商务网站网页进行设计与制作，可促进电子商务网站的运作效率，为用户提供巨大的便利，从而促进网站的使用效率与综合收益，还可提升电子商务网站的运行效率与性能。

参考文献

[1]朱淑琴，魏威，张嘉萌.基于Web标准的电子商务网站网页设计与制作[J].计算机与现代化，2012，03：106~109.

电子商务的网页设计篇（9）

一、对电子商务的理解

1.电子商务是实施整个贸易活动的电子化

2.电子商务是一组电子工具在商务活动中的应用

3.电子商务是电子化的购物市场

4.电子商务是从售前到售后支持的各个环节实现电子化、自动化

二、网上书店——购物车实现过程

1.主要功能模块如下图

(1)书籍管理

(2)购物车

2.书籍管理设计

(1)设计书籍信息表

当我们拿到一本书的时候，我们可以从上面找到很多关于这本书的信息如书籍的名称，作者、出版社等，我们要创建的书籍信息表就需要收集这些信息。因此，我们可以按照下表中所列内容创建书籍信息表。

按照这个表进入Access建立书籍数据库（Bookstor）设计数据库表（Bookinfo）。

注意：在保存表Bookinfo时Access会提示“是否创建主键”要回答“是”，只有定义了主键，才能定义该表与数据库中其他表间的关系。

(2)设计书籍管理各个页面

书籍列表页面

书籍信息页面

书籍信息增加页面

更新书籍信息页面

书籍列表页面——用于显示书籍的简单信息，包括书籍的名称、作者和出版社。

书籍信息页面——用于显示书籍的详细信息，包括书籍的名称，作者，出版社，出版时间，ISBN号码及备注。

书籍信息增加页面——用于增加书籍。

更新书籍信息页面——用于修改书籍的信息。下面我们逐个进行设计。

①显示书籍

有关书籍的信息可能会比较多，如果都显示在一个页面上，势必会显得非常拥挤杂乱.这种情况下，我们可以通过两个页面，将书籍的基本信息和详细信息分开显示，这样就会使得书籍管理页面显得清楚，浏览方便。

显示书籍列表

显示书籍信息

②增加、删除或更新书籍信息

书籍可能变动的问题，可以将书籍信息（包含商品代号、名称、价格等）放在数据库里，而各分类网页从数据库中读取商品信息，如此一来，当商品有所变动时，只要更新数据库即可，不必修改网页。

3.网上书店——购物车设计

(1)书籍搜索

设计搜索页面（方便用户分类查找书籍）

设计书籍显示页面 （查找后的书籍详细信息）

(2)组建购物车

页面的设计要简单明了操作方便

(3)提交订单表

浏览者在选好需要的书籍以后，可以将订单提交给网站管理者。

设计订单表，进入ACCESS在已建好的数据库Bookstor建立订单表。

完成并提交表单，这里用ASP编程完成。

(4)处理表单

网站管理者可以通过处理订单的页面处理浏览者提交的订单。

设计处理订单页面

显示订单在显示订单这个页面上，网站管理员可以查看浏览者提交的订单，并可以删除处理过的订单。

三、各模块设计及注意的问题

1.制作电子网站购物系统的设计最重要的事情就是商品的分类，好的分类能使上网者更轻松地找到自己的产品，增加购买的机会，网上书——购物车的设计也是如此。

2.有关书籍可能变动的问题，可以将商品信息（包含商品代号、名称、价格等）放在数据库里，而各分类网页从数据库中读取书籍信息，如此一来，当商品有所变动时，只要更新数据库即可，不必修改网页。

3.在“书籍信息”数据表中，除了书籍名称、书籍作者、出版社、出版日期、价格、ISBN序号、等基本信息外，书籍的“分类代号”也很重要，因为一个ASP程序来显示所有分类书籍的网页，此时“分类代号”便是不同分类书籍得以显示在不同网页的根据。

4.至于购物袋的问题则比较简单，由于ASP的Session对象是同一连接者所有网页共用的对象，所以利用它来模拟购物袋的功能是轻而易举的事情。

5.设计用户注册表是必须的，在表设计用户帐号、用户密码、用户电话和用户地址时一定要设为必须填写的字段，也就是说这里的字段不能为NULL。

参考文献

[1]纪玉山:《网络经济与电子商务》

电子商务的网页设计篇（10）

根据日化客户的网页设计需求，进行市场调研，了解消费者需求、网页风格定位，初步规划板块结构、设计具有风格独特和整体形象清晰的网站，我们可以把一个复杂的网站设计把大小尺寸、主次模块进行草图划分和分割，划分成相互独立的二级导航，每个二级导航再划分成三级、四级等子栏目的草案。购物电商网站的重点划分应该是产品展示，也可以把日化产品按功能分类变成一级导航重点强调，可以直接展示产品相关信息和图片，让目标消费者迅速找到自己所需商品。其他如企业背景、客户服务都是辅助信息。每个产品的页面规划也尤为重要，麻雀虽小五脏俱全，能够在页面中力求平衡，导航清晰，起到了一个优秀导购员的作用。结构设计规范有序且有章可循，主次关系分明是网站设计的重要前提，结构设计就如同大纲，有了大纲才能对后续设计有整体的认知和把握。在此基础上与客户进行沟通与调整，根据反馈信息，进行协调修改，防止网页设计大功告成却突然结构调动，避免费时费力，尽量做到一步到位。

2网页的版式设计

网页的版式设计和平面设计有很多相似之处，是根据图文、动画、视频等要素有秩序、有机的组织在有限的屏幕空间，并且有一定的视觉导向感，能够使视觉有主次、合理律动地在屏幕中穿梭，并且获得轻松而美的享受。根据客户需求，可以强化页面整体构成设计，为了更好地让产品的功能效用和营销广告能被关注，需将各元素在版式编排中做整体视觉流程策划，根据视觉运动规律来策划，如页面上块面大小、色块的互补等都会引发视觉张力，引发受众亢奋感。在网页设计主页面的设计上，我们的视觉焦点一般在网页中心点偏上的位置，人的视觉对于版面视觉的关注度一般是上部比下部强，左半部比右半部强，才引发了“国”、“同”、“T”“、川”字的网页版式设计，后随着页面元素的强弱大小等相关规律视觉开始进行流动，最后完全吸收网页。例如，百雀羚的电商设计就结合当下和“好声音4”的合作广告和热销产品“年方十八”三生面膜五折热卖等营销广告翻转滚动来表现，其中式的红木柜作为整体网页穿插元素，表现了老国货持久弥新的经典魅力。产品描述中的视觉版式设计和一级页面的版式设计差异较大，产品描述如上图的分支结构一般有十几个小块面构成，如果每个小块面单一的版式设计会引发受众的视觉疲劳，没有耐心看下去，从而无法吸引消费。因此，我们在产品描述版面构成中要注意参考平面设计的方法，可以用直线、曲线、焦点、反复、导向、散点视觉流程，动静结合、刚柔并济、综合使用。

3网页的文字设计

汉字起源于象形文字，它既是字，又是画，自古就有“字画同源”之说。经过长期的发展，汉字由繁到简，由具象到抽象，成为一种规范化的符号。网页的导航条、广告语、网页标题、正文文字都是网页信息的重要组成部分。其中为了区别正文文字，对受众视觉进行传播信息和视觉诱导，导航条和广告语的设计要结合色彩、图形着重设计，文字之间的间距、大小、行距和字体要选择和网站设计风格保持统一性，文字和背景要形成鲜明对比，以便突出文字内容。同时，网页设计具有交互性，文字可以设计成色彩、大小等特效的变化，增加页面的互动性、生动性和可读性，更加良好而准确地表达文字的意义。其他标题文字和正文文字要和谐布局，字号、色彩统一，忌讳色彩繁多每个页面字体不一致。文字的设计和编排的好坏，影响到整个网站设计的品位和整体性。如欧莱雅，其中文字既有与图形设计相结合的层次性，又有阴阳大小虚实变化，其文字的块面信息只有两块，且面积形成鲜明的对比却很好地统一在蓝调子里面，还进行了留白处理，空间感、光感强烈。

4网页的图形设计

在快节奏忙碌的现代生活环境中，广告遍布大街小巷，人们已经无暇一一看广告的文字内容，广告的图形设计也变得很重要。同样，网页设计也进入了读图的时代，电商网页图形设计一方面直接展示产品或相关信息、技术来促使消费者购买，同时也满足消费者审美的心理需求，增加亲切感。产品图片的拍摄质量非常重要，加上后期修图就能够表现非凡品质。摄影图片和素材组合设计在网页中的面积和比重相对于化妆品电商网页来说尤为重要。点线面在网页设计中的需结合得恰到好处。一个汉字、一个按钮、一个标志都是一个点。点的形状、方向、大小、位置、聚集、发散，都能给人带来不同的心理感受。线是点的轨迹，起到强调、分割页面结构，引导视觉流程的作用。不同方向、长度、宽度、形态的线性会给人不同的感受。面的交替使用、合理分割，能使页面产生井然有序的和谐效果。例如，相宜本草（图4）的几套代表性的系列套装就较好的结合了点线面的设计，以线相连，让画面之间有了联系，诱导消费者的视觉自然转移，优惠价的文字突出作为互补色对比，格外耀眼，这个就是点的延伸。圆旁的细虚线使得产品层次更加丰富。