网页设计的流程范文

引言：寻求写作上的突破？我们特意为您精选了12篇网页设计的流程范文，希望这些范文能够成为您写作时的参考，帮助您的文章更加丰富和深入。

篇1

网页是网络传达信息的主要载体，网页设计作为人机界面的一个重要对象，其视觉形式直接影响网络最终的传播效果。网页版面设计的视觉流程是人在观看网页时候的视觉线路走向。根据人的生理特点和心理特点，人们在观看网页时通常是从第一感觉印象到具体信息传达、最后产生整体印象的过程。下面，笔者分析一下网页版式视觉流程的设计原则和表现形式，以及网页视觉流程中的变化性特点。

一、网页版面视觉流程的设计原则

网页版式设计是网页设计的重要组成部分，它遵循一定的认知心理学和审美原则。通过设计创意和设计原理构成网页页面，能更好地实现信息传达和视觉效果传达。承载网页设计的媒介终端的数字化特点，决定了网页版式的视觉流程在具体设计中要遵循以下原则：

1.科学性。网页版式设计的视觉流程以人眼的生理结构和视觉心理认知特征为依据，因此网页版式的视觉流程是符合一般视觉原理和大众认知基础的[1]。根据视觉流程的特点，网页版式在设计上遵照从左到右、从上到下的原则，因此设计中要选择最佳的视觉区域，设计符合科学理性的视觉流程方法。如图1所示视线流动的一般规律，在网页版面中，1区即左上区域，一般为观者视觉进入版面的区域，因此一般放置比较醒目、鲜明、简洁的视觉元素，如标志等。这些元素一般以图形或是文字设计的形式出现，让观者在第一时间了解到网页的代表符号，对网页产生深刻印象，并能同其他网页区别开来。区域2即页面的右上角，虽然不是视觉进入版面的区域，但同样处于页面上方，因此也可放置一些重要信息，在具体设计中，banner、导航条常布置在1、2两个区域。网页的中间部分，如图3区左中和4区右中为放置主要内容的区域，这部分一般放置内容性文字或者图形，属于元素集中区域，是观者阅读和获取信息的主要区域；而3区由于位于页面左侧，处在视觉进入区域一侧，因此在设计中也常常将导航内容放置在3区左侧，便于操控。5、6两个区域靠近屏幕下方，6区一般是视觉线路的终点，因此这两个区域一般放置非重要的信息。

2.识别性。在网页版式视觉流程设计的过程中，最终目的是保障网页内容被更准确、快捷地识别。识别性在视觉流程的设计中关系重大，设计行为都应该围绕着识别性这个主题而展开。根据设计内容的需要，对视觉元素进行处理，如区分主次关系进行设计、通过色彩区别元素、加强设计的整体性等，都是加强页面识别性的设计手法。视觉传达设计的内涵与形式也不是一成不变的，无论采用哪种视觉表达形式，终端受众都必须借助视觉感知来接受信息。[2]

3.合理性。合理性是指在网页版式视觉流程的设计中依照设计的原理合理地展开视觉流程的引导。网页的浏览过程是动态的、互动的，观者获取信息的过程不尽相同，有时浏览者可能会从其他网页链接跳过主页直接进入网站子页面中；同时网页的互动性也容易吸引受众。因此，合理地处理每个网页的视觉流程，让各级页面都拥有设计清晰、可操作性强的导航，便于受众在各种情况下进行浏览。

二、网页版面视觉流程样式

视觉流程在运动的过程中受各种外部因素和主观因素的影响，会产生各种运动形式。结合网页版面设计的特点，主要有如下几个方面：

1.线性视觉流程。线性视觉流程是最常见、最基本的视觉流程样式。文本阅读的方式就是以线性视觉流程的形式呈现的。主要的线性视觉流程有直线、斜线、曲线3种形式。直线视觉流程在版面中引导人的视线做直线的视觉流动，具有直观、确定、一目了然的特点。斜线视觉流程动态性很强，具有较强的个性特征，常用在表现突出动态或个性化的设计中；斜线视觉流程稳定性相对较差，要注意画面的整体均衡。曲线视觉流程是颇具韵律感的视觉流程形式，曲线在版面中的融会贯通让版面舒畅、自然、饱满且充满张力，如“S”曲线形态的视觉流程使页面元素上下左右运动，能在有限的空间中穿插回旋，具有一定的张力。

2.导向视觉流程。在网页设计中使用能诱导观者视线的诱导性元素，令观者的视线能通过诱导按照设计者的布局进行一定顺序的运动，将所有元素从主到次、从大到小构成一个有机整体，形成一个重点突出、流程动感的视觉组合。诱导性的元素有很多种，常见的有文字导向，利用文字的排列组合后的线、面特点来引导视觉走向；肢体导向，利用人体的肢体语言或是手部动作的方向性，来引导视觉走向；指示导向，利用符号箭头的方向性特点，将视线引向主体；形象导向，利用众多的事物形象特征来引导视线，如人或者动物的视线、钟表的指针等。

3.反复视觉流程。反复视觉流程是指由于相同或者相似元素的规律出现，而产生的一种有秩序和节奏的运动。反复视觉流程构成的版面动感性差，通过元素的处理方式能产生很强的节奏和秩序的美感，吸引视线。由于网页技术特点决定了这种反复视觉流程是比较常见的视觉流程表现手法，在网页的导航设计、图片排列、文本信息等设计中常见这种排列手法。

4.散点视觉流程。散点视觉流程使用了后现代的视觉表现中的一些特点，自由、随意、新颖。散点视觉流程指版面中的视觉元素，包括图形、文字等视觉元素及其各元素之间的组成关系不拘泥于规则、严谨的理性编排方式，而是强调感性、自由、随意、分散的排列组合状态。散点视觉流程在初始感官上给我们以散乱的感受，信息获取过程不如其他视觉流程顺畅，但是只要稍加观察我们就会发现散点的视觉流程通常是“形散而神凝”。在对待元素的处理方式、版面的整体协调、主次的关系处理、色彩的利用等方面，都更加刻意精心地遵循着一定的规则，这就使散点视觉流程的表现在灵活、感性、生动之余，不乏理性的雕刻。

5.复向视觉流程。复向视觉流程是从页面的中心点开始，产生向心或离心等形式的视觉运动，画面中心突出、主题明确，视觉冲击力比较强，常用在对某一事物进行强调的页面设计中。

三、网页版面视觉流程中的变化性

网页版式设计同传统媒介版面设计虽然都是在一定的空间中进行视觉元素的组织，但由于二者在最终显示方式上存在差别，因此网页版面在具体的视觉流程表现中必然会受媒介变化的影响。

1.网页版面中的变化性。网页版面设计同传统的版面设计有着一定的联系，但也有着很大的不同，这就是它的动态变化性。对于同一个网页版面而言，观者所见的第一感觉印象未必是最终的感觉印象。由于网页版面互动性的特点，在观者和网页版面的不断接触过程中还会出现各种动态的图标或悬浮导航条等，这些都是带来变化的元素，都会对初始页面视觉流程产生一定的影响。变化会打破最初视觉状态下的相对稳定，在视觉流程的设计中都应该整体考虑。变化的视觉流程可以使网页页面更加生动、多样化，但这也为设计增加了很大的难度，这种变化的视觉流程多用于一些娱乐性的或追求与众不同的个性化网页设计。

2.页面之间跳转的变化性。除了同一网页版面内部的变化性以外，在不同网页页面之间的非线性跳转也是网页设计不同于传统媒介的特征之一，超链接改变了网页内容空间的前后关系。由于网页具有超链接功能和多维性的特点，使得不同站点以及同一站点的不同页面之间跳转成为网页变化性的又一表现。通常来讲，一个站点是由多个页面构成的，观者的浏览顺序是不固定的，可能从主页开始，也可能从二、三级页面开始，因此保持整体的视觉流程至关重要。这就要求设计者尽可能在一个网站的整体设计以及页面的跳转过程中保持视觉元素设计的连贯性，保持视觉流程特征的连贯性，保持整体设计风格的连贯性，来更好地适应页面跳转过程中的变化。

3.视觉元素的动静变化性。网页既包含了传统媒体的形式，其本身又是新的媒体，它具有极大的兼容性和互动性。网页设计中既包含传统的静态设计，又存在具有互动性的游戏、动画、影像和线性播放的影像、广告等元素，这就构成了页面中的动静对比。

对网页浏览者而言，视觉流程的变化还受页面元素动静变化的影响。通常来讲，事物要引起人注意应具备两方面的特点，一是有刺激物出现。在这里网页上的动态元素，如视频、动画、广告等外界刺激具备引起人无意注意的行为，即浏览者事先没有目的也不需要做意志努力就能注意到的，这类变化节奏越快越能吸引人的视线。这是一种动态的吸引，可以改变人的视觉流程，能较先吸引人的视线。因此，在一些页面上，常将一些重点信息进行动态化处理以吸引人的第一注意力。二是视觉主体的意向性。浏览者作为视觉主体，更容易受动态元素的吸引。动态元素的视觉形象力更加明显，受人注意的程度要多于静态元素。因此，我们可以看到，新的媒介赋予了设计以更丰富的内容，网页版式的视觉流程同传统设计相比较增加了动态效果对其的影响，网页上的动态元素可以吸引观者的视线，使观者能按照设计者给出的特定视觉线路进行视觉移动，而页面上的静态元素较之动态元素，其视觉吸引力相对较弱。

结语

视觉是一种主动性很强的感觉形式，新技术在很大程度上要依靠人类的视觉感官去获取、传达和交流，技术的进步让我们开始更加关注网页信息传达的品质。[3]网页视觉流程的设计直接关系着网页版式构成并影响到网页信息传达的效果；在网页设计中组织视觉元素进行视觉表现，使设计形式的组织达到对浏览者视觉线路的引导，能更好地发挥设计元素的功能。总之，加强网页设计的视觉文化基础，利用视觉表现达到提升网页信息传达的目的，对于网页信息传达来讲具有重要的意义。

参考文献：

[1]方新普，陆峰，孟梅林.视觉流程设计[M].安徽：合肥工业大学出版社，2004：49.

篇2

关键词： 农牧养殖；业务流程优化；Petri网模型；ECRS原则

Key words： agriculture and animal husbandry breeding；business process improvement；Petri nets model；ECRS

中图分类号：TP39 文献标识码：A 文章编号：1006-4311（2013）02-0011-03

0 引言

随着人们对农牧产品需求的增多，农牧产品供给能力不断扩大，农牧养殖业信息化步伐不断加快，加之食品安全问题频出，消费者希望养殖信息透明，吃上放心农牧产品，一些大型农牧养殖公司已经开始引入信息化管理养殖过程。母鸡是人们生活中最频繁食用的农牧产品，目前主要采取公司+农户方式养殖，即公司负责育种和孵化鸡苗，孵化出的鸡苗分发到农户管理的散养基地养至130天左右，公司回收这些小母鸡到育肥舍精养至180天左右，最后将达标的老母鸡出舍运往销售点销售。其中的育肥环节主要为了让农户散养的小母鸡统一达标并过滤药残，在此过程中同批进舍育肥的母鸡，到期出舍时有些母鸡可能会因不达标导致需要转舍继续喂养，为了能够准确追溯每只母鸡的养殖过程和核算养殖成本，需要引入RFID[1]等标签对母鸡进行识别。因此，需要对原母鸡转舍流程进行优化以适应信息化管理养殖。

业务流程优化首先需要对流程建模，然后对模型分析，最后针对分析的结果提出优化方案。目前使用的流程建模工具主要有：业务流程图法（Flow Chart）、IDEF模型系列、事件流程链（Event-driven Process Chain，EPC）、面向对象分析（OOA）、Petri网模型等[2]。

业务流程图建模法理解性良好，但是对流程改进能力较弱；IDEF模型系列[3]主要面向功能建模，有抽象机制，但是理解性一般；事件流程链主要面向客户建模，支持流程改造，但是计算机化能力较弱，而且无抽象机制；面向对象分析法建模以业务中的对象及其之间的关系为基础，计算机化能力较强，但是对系统分析评价太简单；Petri网[4]的建模方向是面向混合型，有计算机化能力和抽象机制，对系统分析评价能力强。综合考虑后，选择Petri网建模工具对母鸡转舍业务流程建模分析，并依据ECRS优化原则对业务流程优化。

1 母鸡转舍原业务流程建模分析

1.1 原业务流程描述 为了优化母鸡转舍业务流程，选择某鸡养殖公司开展调研，整理得到母鸡转舍原业务流程如图1所示。

1.2 原业务流程Petri网模型建立 根据原业务流程图建立母鸡转舍原业务流程的Petri网模型如图2所示，Petri网模型的库所、变迁含义以及耗费时间见表1。

对原业务流程的Petri模型分析是优化业务流程的基础和依据，先对建立的模型进行结构分析，然后选取指标进行性能分析。

1.3 Petri网模型的结构分析 结构分析主要对业务流程的Petri网模型进行正确性等基础性分析，保证其与实际业务过程是等价的，不存在死锁、冲突等异常结构。运用基于关联矩阵[5]的分析方法对所建立模型的结构进行分析。

假设母鸡转舍业务流程对应的关联矩阵为C，得出转置为

C■=-1 1 0 0 0 0 0 1 0 0 -1 1 0 0 0 0 0 0 0 0 -1 1 0 0 0 0 0 0 0 0 -1 1 0 0 0 0 0 0 0 0 -1 0 1 0 0 0 0 0 0 -1 1 0 0 0 0 0 0 -1 0 0 1 0 0 0 0 0 0 0 0 0 -1 1

由公式CTX=0可解得S_不变量：

x1=（1，1，1，1，1，1，1，0，0）T x2=（1，0，0，0，0，0，0，1，1）T

在方程组解中得到的S_不变量，当分量为1时表示托肯流经此库所，分量为0时表示托肯不流经此库所。托肯流经何条路线是不确定的，只要托肯的分布符合CTX=0就能保证结构上有界且守恒，但是S_不变量的个数是一定的，即由线性方程组CTX=0的自由变量个数来决定。

根据活性、有界性、可达性[6]的定义可知， 图中Petri网模型是活的、有界的和可达的， 从而验证了模型的正确与可行性。

1.4 Petri网模型的性能分析 性能分析主要考察流程中的评价指标，比如有效性、适应性、流程周期时间、效率、流程成本等，流程周期时间和效率具有相关性，而有效性和适应性度量起来比较困难，所以，一般选择流程成本和流程周期时间作为主要评价指标。选用流程周期时间作为母鸡转舍Petri网模型的主要性能评价指标。

在Petri网中时间参数[7]的计算主要依靠实体托肯的数据传递来实现。一般情况下，一个变迁中，托肯的时间参数发生如下变化：

OutToken.Time=InToken.Time+Waiting.Time

+Act.Time （1）

其中，InToken.Time表示变迁的输入时间；OutToken.Time表示变迁的输出时间；Waiting.Time是等待时间；Act.Time是处理时间。

Petri网模型中并行结构的时间计算公式是

OutToken.Time=

■■（InToken.Time+Waiting.Timei+Act.Timei） （2）

其中m是并行结构中每个串行结构的变迁数，n是并行结构中的串行结构个数。

Petri网模型中反馈结构的时间计算公式是

OutToken.Time=N×■（InToken.Time+Waiting.Timei

+Act.Timei） （3）

其中m是变迁的个数，N是反馈的次数。

在实际业务中，流程完成的时间在某一区间内是随机分布的，因此将随机性引入业务流程的模拟分析中以使得分析与实际更吻合。故设定部分任务的完成时间服从某一区间上的均匀分布。

由公式（1）（2）得公式（4），此业务流程平均周期时间计算公式为：

■=■■■（InToken.Time+Waiting.Timei+Act.Timei） （4）

其中InToken.Time初始为0，在这里我们假设所有变迁在托肯输入库所后立刻发生，即Waiting.Time=0。n是流程个数，m是每个流程的变迁个数。得出图1母鸡转育肥舍业务流程的平均周期为：

■=■■+2+■+■+

■+max2，■+2+30=72（min）

利用上述公式（1），得出每个变迁发生后的时间结果如表2所示。

通过对Petri网模型的结构分析，可知整个模型是正确可行的，与实际业务吻合。整个业务流程包含两个子流程，即P1P2P3P4P5P6P7，P1P8P9。结合模型定性和定量分析，可以总结出以下时间瓶颈：

①流程中最耗费时间并且对整个流程周期影响最大的是变迁T6，即会计将产品验收单送给财务部。实际上P5P6是图中并行结构流程中的一个子流程，所以T6与T7属于并列结构，T7较T6花费时间极少，从而T6的长时间花费严重影响了整个流程的效率。

②变迁T3分拣过称进舍耗时且费大量人力，最重要的一点是，进舍时，有可能会与上一批母鸡混养在一起，对母鸡的日龄很难掌握；

③对于耗时很短的T5和T7，仍然是纯手工填写单据，耗时耗力。

④产品码单与产品验收单中很多数据元素重复，会计统计时填写两张单据繁琐费时。

2 母鸡转舍业务流程优化

2.1 优化原则 在母鸡转舍业务流程优化过程中，采取ECRS原则[8]。

2.1.1 Eliminate（取消） 业务流程首选考虑某些动作有无取消的可能性，如不必要的辅助活动，不必要的搬运，等等，可一律取消。如果不能全部取消，可考虑部分取消。

2.1.2 Combine（合并） 合并即是将两个或两个以上的对象变成一个，如动作与动作的合并。当业务流程中出现能力不平衡，出现人员忙闲不均时，就需要对这些流程进行调整和合并。有些相同的工作完全可以合并在一道流程内。

2.1.3 Rearrange（重排） 重排就是通过改变业务流程中的环节，使工作的先后顺序重新组合，以达到改善工作的目的。如，前后流程的对换。

2.1.4 Simplify（简化） 经过取消、合并、重排之后，再对该项工作做深入的分析研究，使现行方法尽量简化，以最大限度地缩短作业时间，提高工作效率。

2.2 优化思路 根据分析发现的问题，遵循ECRS原则，母鸡转舍流程优化思路如下：

①通过使用ERP系统，自动生成需求单据，工作人员只需网上填写，多部门共享，省去很多时间，如原流程中变迁T6就可以取消，财务部直接在系统中可以调出产品验收单。T5、T7同理也可以取消。

②将产品码单与产品验收单合并为验收单，减少整个系统的数据类。

③引入RFID射频识别技术，在变迁T3分拣过称后给母鸡带上脚环，随时跟踪母鸡的饲养情况，解决了对母鸡的日龄和养殖成本很难测算的难题。

2.3 优化后的流程 根据优化方案可以得出母鸡转舍优化后的业务流程如图3所示。

3 优化后的业务流程Petri网模型建立与分析比较

建立母鸡转舍优化后业务流程的Petri网模型如图4所示，优化后Petri网模型的库所、变迁含义以及耗费时间见表3。

假设育肥舍进母鸡业务流程对应的关联矩阵为C，得转置矩阵为：

CT=-1 1 0 0 0 1 0 0 -1 1 0 0 0 0 0 0 -1 1 0 0 0 0 0 0 -1 1 0 0 0 0 0 0 0 -1 1

由公式CTX=0可解得S_不变量：

x1=（1，1，1，1，1，0，0）T x2=（1，0，0，0，0，1，1）T

根据活性、有界性、可达性的定义可知， 图中Petri网模型是活的、有界的和可达的， 从而验证了模型的正确与可行性。

同理利用上述公式（4），其中InToken.Time初始为0，在这里我们假设所有变迁在托肯输入库所后立刻发生，即Waiting.Time=0。得出图3的平均周期为：

■=■■+2+■+■+

■+2=49.5（min）

本文选用流程时间减少率和变迁数量减少率作为评价流程效率的综合指标，用流程时间减少率反映流程优化后流程总体时间减少的效果，用变迁数量减少的比率来评价过程改进因子。从上文模拟计算得出优化前后母鸡转育肥舍业务流程的平均周期分别为72分钟和49.5分钟，优化前后流程的变迁数量分别为8个和5个，整个流程时间减少率为31.25%，变迁数量减少率为37.5%。所以采取的优化措施是正确的，有效地简化了母鸡转育肥舍业务流程，缩短了流程周期，提高了流程执行效率，从而一定程度上地降低了流程的成本，增强了企业的核心竞争力。

4 结束语

文章研究利用Petri网对农牧养殖育肥舍业务流程建模分析，找出流程瓶颈问题，并依据ECRS原则优化流程。将此建模分析优化方法应用在某公司其他所有部门业务流程优化中，优化后的业务流程提高了业务效率，减少了流程周期时间。这对提高整个农牧养殖效率具有重要的作用。结果表明该建模分析方法在农牧养殖业业务流程优化过程中是有效的。

参考文献：

[1]张玉洁，刘军，贾利民，徐杰.RFID技术在铁路集装箱堆场进出口的应用[J].物流科技，2008，（2）：34-36.

[2]张玉洁.基于Petri网的铁路集装箱运输流程建模与优化研究[D].北京：北京交通大学，2007，12.

[3]李建中，陈良猷. IDEF 方法族在企业过程再造中的应用[J].工业工程，2000，3（3）：6-9.

[4]Murata T.，Petri Nets： Properties， Analysis and Applications. Proceedings of the IEEE，Vol.77，No.4，pages 541-580.April 1989.

[5] 徐新卫，方乐，周小东. 基于“ABCM-CPM-Petri”模型的销售配送流程优化[J].现代管理学，2011，（10）：51-54.

篇3

网页能否有好的发展，不仅体现在好的创意上，也体现在网页的设计上，好的网页设计可以吸引网民的眼球，提高浏览量，但是我国目前网页中的图片视觉效果依然停滞不前，没有太大的发展，在图片的浏览上，缺乏灵活性，图片设计方面没有创意，网页设计人员的技术得不到提高，图片的视觉效果很差。

一、网页视觉设计的原则

要想有展现出完美完美的图片视觉效果，需要了解网页视觉设计的原则，依据原则进行图片设计，从而达到是事半功倍的效果，在设计网页的时候，为了使网页中的图片与内容合为一体，遵循形式美与内容美，要从以下几点出发：

（一）比例尺寸得当,对称均衡适度

合理的比例是美的前提。比例得当不仅适用于绘画，同样也适用于网页设计。在网页设计中，要想把握好比例，需要做好组版元素间和谐的关系。把握好比例尺寸，可以以中心线为轴线，这样做出来的网页图片，带给人一种大方、稳定、端庄的感觉，既体现了秩序的原则，又给人高贵的美。在网页设计中，点线面是很注重的要求之一，首先要在平面中找到平衡点，让绝食产生舒服的感受，接着要找到对称的部位，最后要以整个尺寸为基调，找到平衡点。

（二）动静变化有序,节奏韵律明快

网页中的动态和静态的变化是根据三维空间和图片的比例等因素体现出来的。同种元素因为布局与层次的变化会造成不同的视觉体验。在网页设计中，对空间的要求是很高的，需要考虑动态与静态的结合，节奏韵律的快慢。在网页的设计中，运用动静结合的方式，给人生动活泼的视觉感受，对节奏韵律把握明确，可以增加网页图片的感染力，同时又可以渲染气氛，展开联想。

（三）繁简互衬,多样统一

网页设计，需要考虑好网页的内容和图片版面，既不能使网页看起来太过繁杂，也不能使网页太过简单。在设计网页的时候，可以针对内容的多少进行合理的排版，同时也可以通过色彩搭配来对网页中的内容和图片进行分开。对网页的合理布置，使网页看起来繁简互衬,又能够使整体多样统一，各个元素独立而统一.按照视觉艺术的原则，给人以美的感受。

（四）图形

在网页设计中，图形的设计也是很重要的，图形和图片的比例需要恰到好处。图形是图片的缩小化，它可以帮助网页中的文字更加清晰，使整个网页看起来更加的美观和立体。小的图形在视觉上给人带来一种清新可爱的感觉。对图片的位置和形式的合理的布置，可以使网页更加美观大方。

二、提高网页设计图片视觉的方法

网页设计需要遵循形式美和内容美的有机结合，需要比例尺寸上把握得当，动静变化有序,节奏韵律明快，繁简互衬,多样统一的原则，同时也要做好图形的设计，要想提高网页设计图片视觉，就要从以下几点来进行：

（一）单项视觉流程

网页设计的单项视觉流程是指对网页中的图形、文字和符号等在平面上进行不同方向的变化，可以表现为横向、纵向和斜向这几种形式，然后对其进行构图。单项视觉流程在操作起来简单，同时也能够使网页的平面结构看起来更加的清楚直观，能够直接明了地升华主题，在视觉上给人鲜明的层次感，表现出单项视觉流程的稳定、端庄的效果，具有坚定、直观的感觉。

（二）反复视觉流程

网页设计的反复视觉流程是把相似或者同样的视觉元素进行三次或者三次以上的编排，使网页的图片画面有规律、有节奏、有秩序。运用反复视觉流程，给人的视觉带来冲击性，同时有体现出了网页图片的韵律美、节奏美和秩序美，给人眼前一亮的感觉。

（三）曲线视觉流程

网页设计的曲线视觉流程只要根据人眼来回摆动舒适感的舒适感进行设计，人们的眼睛可以依据弧线的运动变化方式来观看网页中的图片。其中曲线视觉流程主要包括了弧线形（c形）视觉流程和回旋线形（s形）视觉流程。弧线形（c形）视觉流程给人饱满的感觉，具有明确的方向感和扩张感，回旋线形（s形）视觉流程给人流畅，柔美的感觉，使图片生动起来，有很强的动感美和节奏美。虽然曲线视觉流程不如单项视觉流程看起来直观，但是却有飘逸美。

（四）焦点视觉流程

网页设计的焦点视觉流程主要是用焦点来吸引人们的眼球，聚集浏览者的目光。焦点视觉流程为了更好的吸引人们的眼球，往往还要用鲜明的颜色来对焦点进行强化，与网页图片的背景形成对比，同时也会别出心裁的设计焦点，分从从焦点的形式、焦点的层次和焦点与图片的结构进行。焦点视觉流程通常是以图形为主要元素，形成视觉磁场。

三、结语

随着信息科技的不断发展强大，图片对网页的影响也是极其重要的，快节奏的生活，使人们更加倾向于借助图片来获得自己想要的信息。因此只有遵循网页图片的设计原则，分别从单项视觉流程、反复视觉流程、曲线视觉流程和焦点视觉流程出发，才能更好地发挥出图片的价值，给社会大众带来美的感受。

参考文献

[1]刘青玲.图片优势效应在网页设计中的研究与应用探讨[J].科技创新与应用,2015,(21):86.

[2]林欢,谭浩,赵江洪.图片优势效应在网页设计中的应用[J].包装工程,2014,35(18):13-16+24.

篇4

在进入21世纪以后，我国逐渐向信息化发展，人们的日常生活水平也得到了有效的提高，互联网也成为人们在日常生活、工作中必不可少的工具，成为人们在交流、信息查找的重要途径之_。在互联网的发展过程中，网页设计、开发是人们使用互联网工作和生活的重要工具，其中DIV+CSS的布局技术在网页设计和开发的过程中占有重要的地位。但是在传统的网页布局技术运用的过程中，出现了很多隐藏的弊端，并在发展的过程中逐渐显现出来。同时，在这样的情况下，IT行业在网页设计、开发过程中，对DIV+CSS布局技术给予了高度的重视，并且也得到IT行业的广泛应用。DIV+CSS布局技术也是网页设计、开发过程中一种较为流行的技术和术语，开发人员通过利用DIV+CSS布局技术对网页设计过程中的对象进行准确的定位，从而增加了网页在使用过程中的效果和传输、下载速度，也在最大程度上方便了开发人员对网页维护和更新的操作流程。

1网页设计中DIV+CSS布局技术的含义

在网页开发的过程中，DIV+CSS技术布局占有重要的地位。其实DIV+CSS技术也可以分开来说，DIV，CSS在网页布局的过程中，所代表的含义和意义也是不一样的，下面对DIV+CSS布局技术的含义进行了分析：

第一，DIV是DIV+CSS布局技术中的重要组成部分，也是网页设计和开发过程中重要的应用语言和标记元素，为网页设计、开发过程中的文档，提供了网页中的布局结构和网页的背景，在网页设计、开发的过程中也可以将DIV称为定位技术。DIV在起始和结束的过程中都进行了一定标记，并且都是网页设计、开发过程中的文档构成服务的，DIV对网页设计和开发过程中的一些元素进行了有效的控制。

第二，CSS的全称是Cascading Style Sheet，按照中文翻译为层叠样式表，是在网页设计、开发过程中，网页形式和网页信息之间的一种标记语言。在网页设计的过程中，DIV+CSS布局技术中的CSS技术可以准确控制网页中的页面的颜色、布局、背景等，网页中的页面效果更加的丰富，并且开发人员在进行网页设计的过程中，操作流程也相对简单，也使网页中的语言更加简洁化。

第三，DIV+CSS布局技术在某种程度上将也是XHTMDCSS技术。人们在使用网页文档的过程中，对网页中的结构也在进行了一定程度上的规范。DIV+CSS布局技术将网页设计中的结构进行了一定的规范化，将页面中元素进行了一定的规整，使页面中的样式和内容分离，成为一个单独的个体。并且在将2种技术合为1种技术的过程中，可以使网页在操作的过程中，更加灵活、方便。

2 DIV+CSS布局技术在网页设计中的作用

2.1和搜索引擎可以相互融合

搜索引擎在网页设计的过程中起到了重要的作用，是根据Spider程序查找互联网中的内容。Spider程序一般是由少到多地进行网页内容的查找，等到将所有的内容查找扫描后，引入到其他网页中，然后访问网页页面，重复扫描、更新，直到内容出现为止。在使用传统的数据代码的过程中，在内容浏览和操作时不仅复杂，多余的代码也较多，但是在DIV+CSS布局技术中，可以将浏览和操作的流程相对地简单化，并且在搜索内容的过程中，时间也相对较短，其执行的效率也相应提高。另外，在DIV+CSS布局技术的应用过程中，将代码也进行了一定程度的简化，和搜索引擎配合良好。这样，不仅提高了网页设计中的执行的效率，也有效提高了网页设计、开发过程中的质量。

2.2简化了网页维护、更新等操作流程

设计人员在对网页进行设计、开发的过程中，利用Table对网页进行版本的更新设计时，需要对网页中所有的代码进行一定程度上的整合，这样造成网页维护和更新的工作效率在一定程度上的降低。但是，随着时代的不断发展，我国IT行业将DIV+CSS布局技术有效地应用到网页设计。更新、维护的过程中，在一定程度上降低了网页中的内容，并利用DIV+CSS布局技术进行一定程度上的控制。当设计人员对网页中的某一个部分进行一定程度上的更新时，可以有效地提出这部分内容和代码，设计该区域代码，设计人员利用DIV+CSS布局技术对网页进行设St.维护、更新，对其他部位也不会造成任何的损伤。

2.3加强了传输的效率

在传统的网页设计的过程中，往往只注重网页页面的效果和带给人们的视觉冲击，在这种情况下，设计人员在网页中的传输效率较慢，也给网页使用带来一定程度上的影响。但是设计人员在使用DIV+CSS布局技术进行网页设计、开发的过程中，可以对网页中的代码、文字、图片进行灵活的设计，设计人员利用网页中的过滤软件，取代了图片带给网页的视觉冲击。同时，DIV+CSS布局技术也将网页中的中体布局分为不同的层次，在网页开始使用的过程中，无需将网页的内容储存到一个较大的表格中，这样在一定程度上加快了网页的传输效率，在人们的日常生活、工作使用的过程中最大程度地提高了便利性。

2.4有效地提高了网页设计中的视觉效果

软件设计人员在进行网页设计、开发的过程中，利用传统的Table对代码进行整合，在网页的页面中，图片、文字等效果的分辨率并不高，页面的效果并不是很好，同时在设计的过程中，需要大量的设计人员。不同的设计人员所设计的网页形式也是不同的，这样对人们使用的网页造成了一定程度上的影响。但是，在DIV+CSS布局技术对网页设计、开发的背景下，DIV+CSS布局技术能够有效地统一设计人员的设计理念、风格、特点等，并且DIV+CSS布局技术可以有效控制网页中的结构，提高了页面中图片、文字的分辨率，也给人们在使用网页的过程中带来一定程度上的视觉冲击。

3 DIV+CSS布局技术在网页设计、开发中的应用

在网页设计、开发的过程中，设计人员要想有效地利用DIV+CSS布局技术对网页中的结构进行一定程度上的规划，就要对网页中的语言代码的结构进行一定程度的分析。网页中的语言代码其实就是网页结构中的构成元素，网页结构其实就是网页设计、开发过程中的构架。换句话说，就是在网页设计的过程中，对网页中的内容进行有效的规划。下面就对DIV+CSS布局技术在网页设计中的应用进行简单的分析。

3.1 DIV+CSS布局技术在网页中内容规划的应用

设计人员在网页设计、开发的过程中，应当对网页中的内容的几个基本组成要素进行具体的分析。网页内容中的几个基本的要素一般情况下可以分为：网页的头部、网页的主体、网页的页脚和网页中的版权区域。另外，DIV+CSS布局技术在网页设计的过程中，可以使网页形成基本的框架。并且在具体的编写的过程中，DIV+CSS布局技术可以有效整合网页中的代码，最大程度地简化操作流程，为设计人员提供了方便，提高了设计人员的工作效率，同时也使人们在使用网页的过程中可以一目了然。

3.2 DIV+CSS布局技术在网页设计中信息的应用

设计人员在利用DIV+CSS布局技术进行网页设计、开发的过程中，可以灵活地将网页中的信息进行一定程度上的整合，并有效地展现出来，给人们视觉的冲击。在网页设计的过程中，要对网页中的信息元素进行定义，合理安排网页页面中的信息，这样不仅简化了设计、开发的流程，也有效地减少了设计人工作人员的工作负担，从而提高了工作人员的工作效率。同时，也使网页中的形式更加丰富，例如：新闻、通知、公告、天气等信息形式，也有效地节省了网页中的空间，给人们使用网页提供了最大程度的方便，也给人们带来了视觉上的冲击。

3.3 DIV+CSS布局技术在网页设计中的链接的应用

篇5

前言：

互联网时代的到来，改变了人们以往的生活习惯，而且对很多行业岗位产生了较大的影响，尤其催生了一批新型以电子商务为主要经营模式的企业。电子商务网站的网页设计在现代企业的实际运营管理过程中十分重要，不仅起到了宣传企业文化作用，而且也是企业拓展新业务、维护客户的重要平台，这是互联网时代的发展为现代企业单位开辟的新路径。

一、新形势下电子商务网站网页设计与制作的目标

所谓“新形势”指的就是当前快速发展的互联网时代影响下的社会环境的变化，以及人们思想意识的转变。随着各领域贸易的日益频繁，使得商家更依赖电子商务平台，因其成本低、信息资源丰富等特点受到了广大社会群体的认可。

（一）电子商务网站设计与制作的根本目的

在电子商务平台之上，我们可以清晰的看到商品本身的形态、特征以及价格，而且，越来越多样化的网站网页设计形式层出不穷，促使电子商务平台建设的格局逐步升级，新技术的涌现更是突显了电子商务模式的优势。从网站网页设计与制作的目标来看，能够以最直观、最有效的网站网页设计方案来吸引更多的顾客及促使其参与交易才是新形势下电子商务网站网页设计与制作的终极目标。

（二）网站网页设计与制作要能够技术合规且突出重点

具体来分析，对于电子商务网站的设计要突出其功能性，需要最新的电子计算机技术来为其做支撑，程序的设计一定要能够顺利运行，通常要经过测试以后才能够上线运行。对于电子商务的网页设计而言，结构和形式要突出层次感，内容要尽可能丰富，从而将电子商务的关键内容呈现在网页的重点区域，便于人们登录浏览。

二、电子商务网站网页设计与制作所需技术

对于电子商务网站网页设计来说，能够依托网络载体使得开展电子商务业务的企业将其业务有效的推广出去，就是一项成功的设计。在实践过程中，需要应用到很多计算机技术及电子商务设计软件。就以web标准为例来看，电子商务网站网页设计的思想是通过缜密的开发流程来体现的，通过对SHOPEX网上商店系统的制作，进而达到管理网店、拓展业务的目的。从实质上来看，Web标准不是单一的技术标准，而是一个完整的技术体系，其层次较为清晰。在Web标准的支撑下，设计者可以很好地将网站网页结构分割清楚，并能够提升网站开发的效率，降低设计及维护成本。总之，从Web标准的关键技术来看，整个技术体系都是以Web标准基本思想为基础，采用一套有效的开发流程，对SHOPEX网店系统进行电子商务网站的网页设计与制作，最终，这种开发流程在实践过程中得到了验证。

三、电子商务网站网页设计与制作过程

在具体进行电子商务网站网页的设计与制作的过程中，首先要分析目标网站网页的设计内容、方向、网站所要突出的重点等问题，然后，要缕清设计思路，规划出详尽的设计方案，做好网页结构的编排，最后，细化网站结构，完善网页制作的细节。只有按照规划好的流程来，采用合适的网页设计技术及软件，才可以将电子商务网站网页设计和制作的过程完成。

（一）电子商务网站网页的设计内容分析

通常情况下，网站设计的方案要符合当下人们的审美观，简单来说，就是要符合大多数人的视觉习惯，并需要做好合理规划。对于电子商务网站的设计而言，要能够利用大块区域来突出贸易活动的主体内容，并让企业的产品、服务等项目列在最为突出的位置上，只有本着重点突出的原则，才能让浏览网站的客户清楚的看到企业的业务及文化，从而令其产生交易的想法。

（二）网站网页结构编排与方案设计

以Web标准下的网店系统开发为例来看，在进行网页方案设计之前，网页模版的开发较为重要。在实际设计及制作的过程中，采用了SHOPEX网店系统开发的模版来为其做支撑，在每个设计模块区域放置一个独立的设计内容、产品或服务，这样就会令用户对电子商务平台上的功能及业务模块一目了然。最后，要进行网站网页内容的填充，逐步细化网站结构，增添时尚感的素材完善网页制作。

结束语：

通过分析电子商务网站网页设计的特殊性，结合基于web标准的制作技术，来进一步探究网络时代的发展对于电子商务网站网页设计及制作的影响，并提出完善电子商务网页网站设计和制作的具体策略。在web标准基本思想的推进下，开发了一套高效制作电子商务网站网页的系统，并且将其应用于实践，取得了良好的实践成果。总之，以web标准下为例来看，新形势下电子商务网站网页设计与制作已经不同以往，需要改换新型设计内容、结构设计、方案设计等内容，只有这样，才能突出现代电子商务网站网页的设计特点，抓住人们的视线，从而促进电子商务的快速发展。

参考文献：

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

篇6

中图分类号：G642文献标识码：A文章编号：1009-3044(2012)18-4468-02

近年来，高职院校的职业教育课程取得了很大成效，高等职业教育的迅速发展，然而在高等职业教育人才培养的效果与市场需求、高职毕业生的职业能力和实际职位要求之间存在差距，其原因在于现行课程教学与职业教育特征之间的差距，使课程及其教学模式改革成为当前高职院校教育发面临的关键任务。

从网页设计实际工作任务来看，“工作过程（项目）为导向”的教学摸式，是以教学实践为主线，以实操、讨论、项目推动等互动教学，培养学生的职业技能，突出了职业教育的新型教学模式。项目设计是可实践性的，以保证学生可操作并有所收获。每个项目以“成果―＞技能知识”为序，安排各项任务，充分调动学习者的积极性，逆向形成“知识＋技能＋成果”的职业岗位本领。

从职业能力培养目标及网页设计职业岗位要求的角度调查和分析，学生职业能力是使学生熟悉网页设计工作的全过程。围绕岗位核心技术技能，按照“必需、够用”的原则，将Dreamweaver、Photoshop、fireworks等网页设计与制作的主流工具有机地融为一体。

1构建工作过程（项目）为导向教学模式

工作过程（项目）为导向教学模式是以项目教学法为主体来进行。其主要特点强调团队成员的分工合作和主动制定实施方案，在项目的执行过程中训练学生的知识和职业所需技能，项目管理和质量监控办法作为过程控制的必须条件。

工作过程导向（项目）课程开发模式帮助学生获得最受企业关注的工作过程知识和基本工作经验，以满足企业和劳动力市场的需求方面显现了强劲的生命力和适应力。“以培养职业能力为核心，以工作实践为主线，以工作过程（项目）为导向，建立以行动（工作）体系为框架的现代课程结构”的教学模式的理念，已达到良好的效果。

作为职业教育的高职网页设计课程，其特点决定应打破传统学科体系，课程开发过程应以工作过程（项目）为导向，着力于工作过程的实践性。因此，以工作过程为导向的课程必然要以实训项目来展开，实践性是课程的主体部分。

为此，工作过程（项目）为导向教学模式，就是以项目任务为中心建立的教学情境，围绕项目任务的实施来展开职业技能的提升。

2工作过程（项目）为导向《网页设计与制作》教学特点

《网页设计与制作》在电子商务专业中属于“摄影及美工专员”岗位的课程，该岗位的任务是网店商品拍摄、文案的整合，网店VI设计与印刷等，因此在教学中形成如下教学特点：

1）从职业行动领域出发,基于网页设计(制作)人员的实际工作流程和工作任务,以项目引领为“纲”，以任务驱动为“目”，组织教材结构和内容。

2）每个项目以“成果技能知识”为序，安排各项任务，充分调动学习者的积极性，逆向形成“知识+技能+成果”的职业岗位本领。

3）围绕岗位核心技能，按照“必需、够用”的原则，例如将Dreamweaver、Photoshop、fireworks等网页设计与制作的主流工具有机地融为一体。在教学中不直接使用Adobe的Flash软件，而是行业通用的阿里妈妈广告栏来制作网店Flash。它做为专门面向广告型的Flash制作，使教学难度大大下降。

3过程（项目）为导向“网页设计与制作”课程实施

基于工作过程分解的模块和知识结构，可能与教材按知识体系编排的顺序不一致。某个模块可能涉及前后几个章节的相关知识点，因此需要教师能灵活地运用各种教学策略，遵循“够用”的原则。

通过对网页设计师的工作过程和工作流程的分析，结合职业院校学生和初学者的特点，《网页设计与制作》课程教学按4个层次8个项目组织教学结构和内容：第一层，基础层，包括项目一（网页赏析）、项目二（网站规划与创建）；第二层，实战层，包括项目三（网页布局）、项目四（页面制作）、项目五（网页美化），是课程的重点；第三层，提高层，包括项目六（网页特效制作）、项目七（动态网页制作），是本书的难点；第四层，运营层，包括项目八（网站与维护）。

3.1以实训项目为任务的组织“网页设计与制作”课程

过程（项目）为导向“网页设计与制作”课程实施在教学中的一大特点就是教师按照一个现实的项目的工作流程来实施教学，让学生在实际项目操作过程中，训练职业技能。达到人才培养目标。

过程（项目）为导向“网页设计与制作”课程实施是教师与学生以团队的形式共同实施项目进行的教学。在《网页设计与制作》教学中按照“工作过程（项目）为导向”的新设计课程项目。通过项目训练教学过程提升学生的网页设计等工作能力。各小组成员合理分工，团结协作，完成整个项目。结束后，各小组进行工作结果评比及比对讨论，结果由教师评审及打分。让学生参与到“教学”的活动中来，激发学生的职业技能兴趣和竞争意识，还可以培养学生的职业道德、团队合作意识等能力，提升高技能人才素质。

学生将为课程实施工作的主体，教室、实训室成为学生们工作的模拟职场，学生作为员工角色扮演，学生的学习活动将模拟为职工的实训活动，学生根据工作内容的进程自我调整细节。项目导向课程实施，对教师提出了更高的要求，教师以督导角色出现，教学策略从注重“教法”转变为注重“学法”。

3.2工作过程（项目）为导向教学的考评

构建科学合理的评价机制，是电子商务学生学习方式形成乃职业技能提高的标尺。因此，我们在实践中探索，形成了相对实用及科学的考评方式。采用不单纯笔试为主的考试，灵活多变考评方式。例如：电子商务是以开设网店及对应的网店营销方案作评分标准。“数码拍摄与制作”的考核方式就是工作流程“选商品-找模特-拍摄-网店上架”。“阿里巴巴企业课程”则要求学生用英语在阿里巴巴国际站向外国商人询盘为主要评分标准。虽然这些考核方式不一定是最科学合理，但却比单纯笔试更能学习到实际的岗位技能。

4结束语

工作过程（项目）导向的《网页设计与制作》课程开发与教学实践是以课程建设与教学质量改革为目标，将教学过程的职业化、项目化作为改革的基点，并对高职院校职业教育理论和教学创新思想是一有益尝试。

电子商务专业的特性是知识更新较快。学生就业两三年后专业知识就慢慢落后，职业道路出现首个瓶颈。本课程开发与教学实践的应用和实施，将使高职院校培养目标准确定位，增加教学效果与职业需求的契合度，提高毕业生就业竞争能力及就业质量。

参考文献：

篇7

一、影响网页版面和空间设计的生理和心理因素

1、视容量

视觉容量是指在一定时间内，视觉所能容纳的信息量。人眼的视觉容量一般用比特作为计算单位，每一秒钟正常的视觉容量是25比特，约四个信息单位(如文字)。视觉容量的接受程度受到视觉对象的清晰程度，照明对比程度以及人们的文化程度和实际经验等因素的影响，各人略有不同。一旦视觉接受到的信息超出一定的视觉容量，人们就会产生相应的抵触反应，引起不快。这就是为什么浏览一些超大容量的页面时，人们容易产生视觉疲倦和心理抵触的主要原因之一。

在网页设计过程中应当重视视觉容量的限制。网页上的内容容量需要多大?文字、图片等信息应该如何归类?页面级别应如何区分等等，在进行网页设计初始时需要进行认真规划，才可能将网站信息有效快捷地传递给用户。

2、视觉流程

人们在阅读中，视觉有一种自然的流动习惯，视觉流程的形成是由人类的视觉特性所决定的。受生理结构限制，人眼只能产生一个焦点，不能同时把视线停留在两处或更多的地方，所以人们只有依照一定的顺序浏览观察。

网页浏览过程是一个动态的视觉流程。一般来说，我们的视觉习惯于从左向右，从上向下看，所以一个空白的网页给我们带来的自然视觉流程是从左上方到右下方的一个弧形曲线。在这个弧形曲线上，视觉优势从上到下递减。合理运用视觉流程原理，有助于我们合理地布置网页中视觉元素的位置，划分相关的页面版式区域，提高信息传播的效率。

二、通过合理的设计有效传达信息

1、合理借鉴传统信息载体的信息规划方法

“版面编排”实际上就是中国古代画论中的“经营位置”。而网页的版面设计也遵循着同样的规律。尤其是起着门户作用的首页，其版面的设计规划更需要慎之又慎。作为版面内容的文字和图片都需要第一时间展示给用户，所以决不能简单地罗列在页面上。首页的作用就像书籍的目录：作为传统的信息载体，书籍的目录主要起着引导浏览的作用，而作为网页的首页也起着相同的作用。因此在设计过程中就要尽量避免将过多的信息内容堆放在首页上，只需将主要导览信息列入即可，这样反而更有助于浏览者快速找到所需信息，提高信息传达的效率。这也正是中国传统绘画中所讲的“少即是多”。

在网页设计中，网页的空间结构反映了网站内各种信息之间的关系，是直接影响视觉信息传达效果的重要因素。网页之间的关系就像书籍中各章节之间的联系一样，形成一个无形的“空间”。这个“空间”包含物理和心理两个方面：物理空间如首页与各级页面之间的联系。各级页面之间的设计风格的相互统一，内容的相互协调，都对这个“空间”的形成起着至关重要的作用。从心理方面来讲：为网页创造人性化的视觉和心理空间也是必需的，我们可以从整个WEB站点的角度出发，考察页面之间的空间关系，充分利用网页这种信息载体的特点，创造更高效的思维互动心理空间。

2、传统形式美法则同样适用于网页版面设计

作为传统平面媒体版面设计的一些基本原则，依然可以在网页的版式和空间设计中发挥其重要的作用，比如：

(1)变化和统一。

在图形设计中运用变化与统一的规律，是处理形象和组织的对立统一过程，那么在网页设计中同样要恰当地的利用这种规律。在我们把大量的信息塞到网页上去的时候，应该考虑怎样把它们用合理的、统一的方式来排列组织，使网页整体感强并且富于变化，使页面更丰富，更有生气。

(2)条理与反复。

条理与反复的原则是图形构成整体的秩序美的基础，这种手法在很多优秀的网页设计作品中运用的较多。这类网站信息含量大，需要运用一定的方式将信息条理化并加以归纳后重复利用，使页面整洁，脉络清晰，信息浏览方便快捷。当然，对于信息量较少的网站同样需要条理与反复，以达到更富有变化和清晰的视觉效果。

(3)对比和调和。

对比是指在质或量方面相互差异甚大的两个视觉要素同时配置在一起时，两者之间相互作用给人以更加强烈的视觉冲击力。那么在网页设计中，如何利用它来达到好的效果呢?首先合理地利用对比的因素，例如文本和图片尺寸、比例以及位置的排布等等，最终的目的就是如何取得较为强烈的视觉效果。此外还要恰如其分地找到调和的因素，即版面和空间的联系点，使整体感觉突出，不至于仅仅因为对比而造成割裂的感觉。只有做到对比和调和的相辅相成，才能使网页页面鲜明、突出，更好地传达出设计者的意图。

(4)均齐与平衡。

这是设计中求得中心稳定的两种组织形式。在网页设计中，平衡是一个动态的平衡，因为页面上两边的配置不会总是绝对统一的。更多的时候是版面中各个区域的相互平衡，这是一种动态的平衡。这种方法可以满足人们视觉上的整体平衡感，也是人的心理因素的一种图形化表现，当然不是片面地追求静止的对称，那种僵硬的、不生动的形式同样会失去美感。

(5)节奏与韵律。

运动中的事物都具有节奏和韵律的形式规律。在具体的网页设计的运用中，版面的编排就经常会遇到这个问题，优秀的版而设计富有音乐般的美感，同时丝毫不损其实用性，这需要不仅是从形状上，而且要从整体的色泽、大小等综合方面人手。

篇8

网页页面设计：主要应用Photoshop、Illustrator等图片处理和图形设计工具;

前端网页开发：主要应用Dreamweaver、Notepad++、Editplus等网页编码工具;

后台动态网页开发：主要应用Mysql数据库、PHP动态页面开发工具等。

这些工作岗位要求学生熟悉整个网页设计和开发的工作流程，具备所需的基本知识和操作技能，同时还要有良好的职业道德和团队精神，以适应行业发展需求。为了进一步实现职业院校的人才培养目标，提高职业教育的教学质量，围绕实际的网页设计和开发的工作过程，对《网页综合实训》课程进行改革和开发。

二、课程设计原则和设计依据

设计原则：以学生为主体，提高学生的学习兴趣;以职业岗位任务为导向，组织教学内容;以职业岗位需求为依据，突出职业能力培养;以项目为载体，训练学生职业岗位能力和自学能力。

设计依据：本课程以真实完整的网站开发项目为载体设计教学过程，以网站技术人员的岗位工作任务为依据，设计相应教学工作任务，以这些工作任务为载体设计学习情境。教师带领学生在网络机房完成网站项目的开发设计任务，学生以小组为单位开展工作任务。

三、根据岗位能力要求和专业培养目标，确定课程培养目标

1.岗位能力目标

（1）网页页面设计：要求学生能对网站结构进行规划及功能设计、能利用ps等工具设计制作网页页面效果图;

（2）前端网页开发：能将网页效果图重构为HTML网页、能为网页添加常用的js特效;

（3）后台动态网页开发：能进行网站后台数据库设计;能对常用的动态页面功能模块进行开发。

2.职业素质目标

完成具体工作项目，要求学生能自主学习和查阅资料。通过网络搜索资源，首先通过模仿然后举一反三，自主分析问题、解决问题;完成整个网站开发工作项目，要求学生具备良好的职业道德，能够团结协作共同完成工作任务，重在培养学生的团队合作能力和爱岗敬业精神。

四、根据工作流程，基于工作任务，设计学习情境

1.设计思路

网站开发实际工作任务主要包括网站规划设计、网站前端设计、网站后台开发、运营与维护。网站开发过程中的重要环节为设计与开发，即网站规划设计网站前端设计网站后台开发。遵循实际网站开发流程，本课程主要针对这一阶段设计开发一个实际的网站。

2.学习情境设计

遵循网站开发工作流程，以工作过程为导向，以项目为载体，把本课程设计成以下五大学习情境：（1）网站的整体规划设计;（2）网页设计与实现;（3）网页特效设计与实现;（4）网站后台数据库设计;（5）网站后台功能设计。

3.学习子情境设计

对应工作流程和能力目标，每一个情境又以工作任务为载体细分为若干个子情境，即学习任务。学习子情境要与整个项目的实际工作过程相结合，与每个工作阶段的能力目标相对应。下面以第二大情境――网页设计与实现为例，进行基于工作过程为导向的学习子情境设计与实施。

学习情境二：XX网页设计与实现

子情境设计及主要工作任务：

（1）网页版面设计：规划网页页面内容版块;绘制页面布局线框图;

（2）网页素材的搜索及制作：根据网站主题和风格，利用网络搜索，或利用工具软件制作网页素材;

（3）网页效果图设计与实现：利用ps完成网页设计psd效果图;

（4）HTML网页重构：根据psd网页设计图编写html网页代码。

4.考核评价设计

考核方法：本课程的考核包括平时过程考核和期末结果考核，两者各占一定比例。

篇9

如今，互联网已经融入我们日常学习生活的各个环节，并在全球范围内飞速发展。其打破了国界、地域、文化的限制，使信息传达的范围、速率都产生了质的飞跃。互联网中数以万计的网站中，每个网站都拥有自己不同的网页，一个个变换的网页构成我们互相交流的媒介。因此，网站制作过程中，特别是网页页面编排设计时，要展示出自己独特的设计风格。如何设计出视觉效果好，色彩搭配和谐，结构合理的网页版面是网页设计中的一个重要问题。

一、网页设计中的视觉流程

网站的宣传内容、整体风格、设计理念都要通过视觉感官被浏览者所欣赏、接受和感受。设计精美的网页版面能够让浏览者增加浏览兴趣，拥有美好心情，从而增加网站点击率。反之，网页页面凌乱不堪会严重影响浏览者观看阅读的情绪，离开网页。网页视觉元素能否引人注目会直接影响到网站的信息传达，若想想通过网页更好地传达信息，网页视觉效果良好是其基本条件，让网络真正意义上成为可读强性、新颖的媒体，为此网页设计者设计网页时，必须适应人们阅读习惯和满足人们的审美需求。对每个视觉造型元素之间的距离、位置、面积以及视觉流程等都要精心设计。

人们阅读文章时，视觉总会有一种先后顺序习惯，有一定的方向，整个版面的走势有一个主旋律。网页设计中的主标题、重要广告、更新的重要信息等突出信息通常选择放于此位置。但视觉流程与学习数学公式不同，属感性范畴，其只要符合人们认识过程的心理顺序和逻辑顺序，就可以根据感受灵活运用。网页设计时，合理的运用网页的视觉流程，能够引导浏览者按照一定的顺序阅读网页，组织好整个网页版面的视觉导向，从而影响到整个网站的信息传达和功能实现。因此网页的编辑设计，视觉导向是一个重要问题，信息传达是网页设计的一种功能性的体现，这种传达要符合人们普遍的思维习惯，做到视觉流程合理、顺畅、自如。好的视觉流程布置，能使网页上的各种信息要素在一定空间内合理分布，能使页面上各信息要素的位置、间隙、大小保持一定的节奏感和美感。一个网站主要说明的东西必须通过网站首页醒目位置加以体现和展示，以方便浏览者阅读和理解。

二、网页设计的审美需求

网页设计是近些年才发展起来的一门设计类学科，这些年随着网络的发展，人们越来越重视网页版面的设计和网站风格的整体设计。网页不仅是将各种想要传达的要素简单的罗列在页面上，而是要考虑如何使浏览者能更感兴趣的和更有效率的接收网页上的信息内容。这就要求我们从审美的方面入手，设计制作出美观、完整、新颖、合理的页面。使浏览者观看阅读起来心情愉悦，更好的接受网页所传达给我们的信息。我们可以把传统平面设计中的形式没的法则和现代的网页设计的具体问题相结合起来，运用一些平面设计中美的基本形式到网页版面的设计中去，增加网页设计的美感和浏览者的视觉审美需求。

（一）版面的规范化

页面编辑的规范化要求是网页设计的重要方面。比如使用Dreamweaver设计网页时，是选择左右型结构、左中右型结构、左右型结构框架，还是用表格系统来定位网页中版面的规划。要遵循一定的规范。在网页编排中应正确使用文字、标点符号、计量单位、规范使用术语、图片和Flash动画等。对网页版面中的文字、图形、色彩的设计，都要遵循形式美的视觉规律。网页的内容与形式的表现必须统一和具有秩序，形式表现必须服从内容要求，网页上的各种对象之间要分清主次，突出重点，有一定的整体感。

（二）版面的均衡性

网页的版面虽然有限，但在浏览者的眼里和平面设计要求一样同样要有视觉的均衡性。版面构图的基本元素是点、线、面，其中单个的字符是点，由字符组成的行是线，由行组成的段落是面。线和面的运动方向可以归纳为水平、垂直和倾斜三种形式。水平和垂直给人以安静和固定的感觉，倾斜则具有运动感。水平、垂直和倾斜组合起来使用会给版面带来丰富和生动的效果，从而使版面在整体上保持平衡的前提下具有动感和变化。

（三）版面的装饰性

“图”与“地”的对比中版面的装饰性中和重点。可以使用空白进行装饰，力求在平面中达到不平的效果。要注意立体的装饰效果，比如在文字大小、颜色的处理上要有对比，图片的摆放也要有大小、颜色的对比，包括和背景颜色的对比，从而使版面在整体上体现出层次感。给浏览者以赏心悦目之感。

（四）版面的统一性

网页版面设计中的统一，就是指在版面的整体感上要达到一致，风格上一致，色彩上统一协调，比如文字字体要统一，不能有的严肃，有的活跃，有的时尚，有的古板，同时色彩感受上也要达到风格统一。 转贴于

三、学会分析网页中各构成要素

网页设计就是通过各种要素向浏览者传达信息，以实现宣传的目的。其构成要素包括文字、图形、图像、标志、色彩等造型要素及标题、信息菜单、信息正文、标语、单位名称等内容要素，如何在网页版面中合理的设计安排这些要素是我们要细心研究的问题。

（一）文字的编排与设计

文字作为信息传达的主要手段是网页设计的主体，是所有宣传物中不可缺少的元素，也是网页中必不可少的元素，因此网页中文字将占据相当大的面积，文字表现的好与坏会影响到整个网页的质量。必须考虑文字编辑的整体效果，给人以清晰的视觉印象，切记不要使页面中的文字看起来凌乱、繁杂，过多的装饰会让人不容易辨认和理解。不可只为美观而创意文字，忽略了文字本身的传达信息功能。版面设计时要注意文字的大小变化，色彩变化，明暗变化，用这些变化使字体版面活跃，达到视觉上的美感，注意变化中的统一，以获得良好的心理反应，达到完美的文字编排效果。

（二）图片的编排与设计

图片是网页版面中文字以外的又一主要元素，是传达信息的有力途径，图片的参与可以加大网页提供的信息量，而且图片的引入也大大美化了网络页面。可以说，要使网页在纯文本基础上变得更有趣味，最为简捷省力的办法就是使用图片。对于一条信息来说，图片对浏览者的吸引力远超单纯的文字。图片的位置、面积、数量、形式、方向等直接关系到网页的视觉传达。在页面图片的合理选用时，一要注意统一，二要注意悦目，三要注意突出重点。

篇10

中图分类号：G712 文献标识码：A 文章编号：1674-7712 （2013） 04-0130-03

一、网页设计人才培养现状

高职院校网页设计课程体系与教学之间存在许多弊端，概括起来，主要有以下几个方面：

（1）课程与教学内容理论性强，实践教学方法、教学手段不适应行业需求，学生职业能力和创新能力的培养没有真正落实。

（2）师资力量存在缺陷，普遍现象是：大部分老师是从校门进校门，没有企业的从业经验，也没有实际项目开发经验，基本上是“照本宣科”，所谓的项目驱动，项目的开发流程属于模拟范畴，与实际客户的需求，还相差甚远。目前高职院校已意识到这个问题，通过各种方式寻求校企合作，实现校企互动的新模式，如何尽快解决师资在理论知识和实践应用方面的不足是十分迫切的。

（3）课程设置不尽合理，课程内容上重“设计”轻“技术”。教学上按照以往的教学模式，仅仅在多媒体教室中讲解操作步骤、做典型范例是远远不够的。应着重培养学生的创新意识和独立开发网站的能力。艺术性与技术性的高度统一是今后网页设计发展的大趋势，不断探索新的教学模式和教学理念，根据行业需求来构建合理的课程体系。

二、网页设计专业的职业岗位

根据对沈阳、大连地区IT行业的发展现状与趋势、人才需求状况、企业调研等方面调查分析，可以将网页设计岗位分为网页设计、网页制作、网站编辑、网站管理四大岗位群。

三、构建科学合理的网页设计人才培养体系

（一）网页设计人才培养目标的定位

本专业培养适应社会与区域经济发展需要，德、智、体、美全面发展，熟悉网站的配色及制作流程，掌握网站设计与策划、网站的安全与服务器配置以及网站的搜索引擎优化技术；掌握动态网站编程技术，具有独立制作整站系统的能力，在企事业单位、网络公司、广告公司等IT行业从事网页设计、网站美工、各类网站的开发与维护等工作的网页设计师、高级技师和高级网站程序员。

（二）网页设计专业的课程体系

根据网页设计行业的职业岗位分析及人才需求，确定网页设计的人才培养目标。按人才的职业能力的培养为主线构建了该专业的课程体系。确定了该专业的核心专业课程，课程体系结构如图1所示。

按课程的培养目标，将网页设计的专业课程分成以下四个模块：网页设计基础模块、客户端开发模块、数据库操作模块和Web应用程序开发模块。

模块一：网页设计基础模块，对应的课程是《网页设计与制作》，主讲内容是“网页三剑客”，DW也就是Dreamweaver（网页制作），FW是Firework（矢量图形制作和图像处理），Flash（动画制作）。这三种软件能相互合作。比较实用的操作方式是：在Firework中做好主要页面，然后导出，在Dreamweaver中加以修改，添加链接等，便做出一个非常好看的页面。

模块二：客户端开发模块，对应的课程是《JavaScript》或《VBScript》，《JavaScript》是一种由Netscape的LiveScript发展而来的原型化继承的面向对象的动态类型的客户端脚本语言，该语言区分大小写，主要目的是解决服务器端语言（比如Perl）遗留的速度问题，为客户端提供更流畅的浏览效果。

模块三：数据库操作模块，对应的课程是《SQLServer》或《Access》或《mySQL》，作为网站的后台数据库管理系统，负责网站的实时更新，对数据进行存储，在网站的建设中起着至关重要的作用。

模块四：Web应用程序开发模块，对应的课程是《》或《JSP》或《PHP》，主要讲述动态Web页面的实用技术。

模块教学采用理实一体化教学模式，采用了“任务驱动”教学法，教学任务分为：课堂教学模拟、企业真实项目操作两部分，这些任务的设计遵循了由简单到复杂，由单人独立操作到项目组成员共同完成，充分调动了学生的学习积极性和主动性，有效提高学生的知识应用能力和创新能力。

教学评价建议改变单一的总结性评价的方法，采用评价过程、阶段评价和综合评价相结合的评价方法。教学中要注重学生学习的过程，精心设计对学生学习过程的记录及评价，如学习的形式、获取信息的方式、讨论的要点、设计的方案等进行记录，并对作品进行交流、自评和互评等，从而让学生学会学习。

（三）网页设计专业课程的教学评价标准

制订本专业各核心课程的教学评价标准，此标准以《动态网页设计》课程为例。

1.考核方式

本学习领域的课程考核宜采用过程考核、公共考核和期末考试相结合，具体考核内容及权重见表3。期末考试分为理论考试和实践考试。其中，理论考试主要考核8个学习情境中的主要知识点，试卷分值100分，其中填空题（占25%）、选择题（25%）、判断题（20%）、简答题（30%），试卷从不同角度考查学生基础知识的掌握能力；实践考试内容为2至3道上机操作题，主要考核学生的上机设计和调试能力，及对知识的综合运用能力。

（四）网页设计专业的师资建设

建立一支高素质的师资队伍是网页设计专业建设的关键，这支队伍不仅要具有网页设计相关的理论知识和实践经验的特长，而且还熟悉整个网站的运作和前台后台维护管理等方面的理论知识。教师的培养可以通过以下的方法：

1.以行业为基地进行专业培训，加快与行业的联系。

2.组织教师到其它兄弟学校进行交流和调研，提高教师业务水平。

3.积极从国内外及相关行业引进、或者借用专家人才，提高教师队伍水平。

4.专业教师自身应该时时刻刻跟踪、掌握电网页设计发展的最新动态，掌握网页设计最前沿的知识，不断地更新知识。总之，网页设计专业人才培养应当以企业需要什么样的人才为出发点，总结过去的经验和教训，从实际出发，严格按照客观规律来建立网页设计人才培养的模式和体系，这样才能培养出符合社会需要的合格人才。

参考文献：

[1]高云.高职高专《网页设计》课程改革探索[J].吉林省教育学院学报，2009，11：2.

篇11

中图分类号：F713 文献标识码：A

截至2012年12月，中国网络购物用户规模达到3.12亿，市场整体交易规模为10.2万亿元，同比增长29.9%。随着网络购物人数爆炸式的增长，越来越多的企业开始尝试利用网络平台开展商务活动。同时，企业对于电子商务人才的需求也越来越大。鉴于中小企业自身的特点，企业希望人才来了就能用，这就要求学生具有较强的专业技能。《商务网页设计与制作》课程是电子商务专业的一门核心专业课程，这门课程学好了，对于学生未来的成才和发展效果是非常明显的。笔者结合多年从事电子商务专业《商务网页设计与制作》教学实践经验，引入企业网站的生产流程，对课程教学内容体系进行了重构。

1课程教学现状及存在的问题分析

《商务网页设计与制作》是高职电子商务专业的一门核心专业课程，既是学生最期待、最向往的课程，也被认为是最艰难，最难啃的课程，以文科学生为主体的商贸财经类专业尤甚。之所以向往，是因为它如此之重要；之所以艰深，是缘自于技术的隔膜和不必要的恐惧。当然，究其原因，传统教材与教法，自然难辞其咎。

1.1课程设置不合理，知识内容落后

传统网页设计与制作教材，往往专注于“网页三剑客”等技术软件的操作，让学生从一个代码，一段文字，一张图片入手，来制作属于自己的网页和网站。这种教学模式，经过两到三年，学生还难以上手；而一名合格的网页设计师，往往只需一两天，就能开发出一个让企业签单付费、价值达几百上千元的小网站。网页设计思路不明确、网站栏目设置不合理、首页布局无特色，内容定位不清晰。总之，网页制作门槛高、学生动手操作难，美工不出彩、商务没感觉，这是传统模式的致命缺陷。

1.2课程教学模式落后

传统的《商务网页设计与制作》教学中，许多学校是以教师为中心，偏重于讲授为主，传授网页制作的工具、技术等专业知识，缺少对学生思考和解决问题能力的训练，没有引导学生去自主学习，这就导致很难培养学生的理性精神及创造能力、创业意识，也无法培养学生独立思考、敢于向权威挑战的学习态度和竞争精神，更无法引导学生的创业意识和创造性思维。

1.3实践教学方法有待完善

现有的《商务网页设计与制作》实践教学更多的强调技术层面的东西，很少有考虑到商务诉求。在教学过程中，大部分学生都有畏难情绪，导致教学效果不明显，学生网页设计的思路不清晰，动手操作难。

2《商务网页设计与制作》教学模式设计总体方案

2.1打破传统学术思维的束缚，遵循网站建设的业务逻辑

课程设计以典型企业网站为载体，通过商务网页设计导引、商务网页布局与设计、网页效果图制作、静态页面制作、DIV+CSS网页布局五个学习型项目的创设，对商务网页设计与制作的基本原理及实现方法进行了系统介绍及完整展示，让学生能在较短的时间内制作出不仅美观大方，而且能体现企业商务诉求的网站，打破传统学术思维的束缚，遵循网站建设的业务逻辑――企业怎么做，我们怎么做。商务网页设计制作流程如下图1所示。

2.2教学内容体系构建

本课程在教学内容的设计上以商务网页设计与制作业务流程为主线，将商务网页设计的基本原理与方法融入到典型工作任务的介绍和实训中。

第一个模块和第二个模块以典型商务网站类型、典型商务网页版面风格分析入手，使学生快速理解和掌握网页设计的基本原理和方法，并能完成网站栏目规划及商务网页版面设计的任务。

第三个模块以网页素材的选择为突破口，使学生快速地熟悉并掌握网页效果图制作的方法、步骤及要点。

第四个模块则要求学生在已有效果图的基础上能制作实现静态页面，以使学生掌握必要的html标记语言，并掌握常见的两种页面布局方式，为后续课程的学习打下基础。

在课程实训方面，则选择目前商务网站建设服务市场业务类型较多的企业网站建设业务为主线构建实训项目。这类网站建设业务中的页面设计素材丰富、规范化程度高，便于学生学习。

在教学内容的细节处理上将充分考虑本课程与艺术设计类及软件设计类相关课程的区别，降低学生学习难度，突出商务网页设计与制作的重点，使学生能举一反三，适应商务网站网页设计师岗位能力需求。

3课程教学的实施途径

3.1基于校企合作的课程项目开发

《商务网页设计与制作》要求教师教学应以企业真实需求为逻辑主线组织教学内容，以项目为知识学习、技能训练和素质养成的载体。为了保证与企业生产实践相结合，最大限度地利用企业有效资源，通过积极深入市场与企业一线，认真分析当地产业结构与发展趋势，寻找校企合作的结合点。目前，课程依照行业标准、岗位技能要求以及岗位工作流程等进行项目运作。在项目的开发过程中，企业高度参与，共同确定基于工作过程的典型工作任务。

3.2基于职场环境的教学实训基地建设

建设能够进行教、学、创于一体的基于职场环境一体化教学实训基地，是实施一体化教学的硬件保障，是实现教学模式转变的重要条件。目前，我们已经建立了三个学生工作室：网赢工作室、智越工作室和服务外包工作室。其中智越工作室的核心业务是中小企业网站建设与维护，每年吸纳30多名学生，完成10多个企业真实项目，收入1万多元。通过引进企业真实项目，和企业建站的标准流程，提升学生的专业技能和职业素养。

3.3考核评价体系改革

本课程的学习，是要求学习者联系一家有商务网站建设需求的真实企业，来完成课程模块的实训。本课程以学习者的实训作品为主要考核依据，兼顾学习者的学习态度、职业素养、团队意识及表达沟通能力。

4结束语

将企业真实的生产制作流程引入到《商务网页设计与制作》课程教学中，引导学生重视企业的商务诉求，制作出符合企业需求的商务网站，是本课程的重要特色。

参考文献

[1] 方玲玉.《网络营销实务》工学结合课程开发的实践尝试[J].职教论坛，2008（16）.

[2] 张婵.基于就业一创业导向的独立学院网络营销实践教学方法改革探讨[J].物流工程与管理，2012（5）.

[3] 周建良.以创业能力培养为导向的电子商务课程开发探索[J].科教文汇，2010（7）.

[4] 韩义.对电子商务课程教学改革的思考[J].天津电大学报，2008（9）.

篇12

中图分类号：TP393.092 文献标识码：B

文章编号：1671-489X（2015）08-0057-03

1 简约化及相关概念厘清

简约化与饱和化的辩证 饱和，在化学中的解释是：在一定温度和压力下，溶液所含溶质的量已经达到最大限度不能够再溶解时表现出的形态。也用来比喻事物发展到最高限度时所表现出来的状况和态势。从视觉接受的角度分析，饱和化是指视觉信息达到人们所承受的最大限度。简约化与饱和化是相对的。简约化就是对人视觉信息的简化，它是用简洁明快的视觉语言来满足受众对视觉环境感性的、本能的和理性的需求。

简约化与简单化的厘清 简约不同于简单。“简单”解释为结构单纯、容易理解，与复杂、困难、繁琐是相互对立的词语。在网页设计中简单表现为页面结构单一、色彩单调，在形式表达上比较呆板，无法给人视觉带来亮点，功能缺乏交互性等。简约并不是缺乏设计要素，它是一种更高层次的创作境界[1]。简约是针对不同对象，筛选适合于设计对象的、经过不断精心组合或者选择的精华。它遵从人类的生理和心理状态，强调的是以人为本的更为情感化的设计。

2 简约化网页界面设计的内涵分析

形式统一与和谐 凡是简洁美的东西都有一条共同的原则，就是在外观造型中的各元素存在一定的和谐、统一的关系[2]。人的视觉和心理惯于接受有序、简洁与和谐的形态。即使人们遇到一些看似凌乱无序的画面，也尽量从各种角度对其进行归类、整理，以求从中找出内在的规律与美的因素。因此。视觉美感产生于有序与和谐之中。有序与和谐让人对事物的心理感觉单纯化、规律化以及整洁化。

网页功能的简洁性 简约的网页在功能上能明确表达功能效用，强调用户体验，是一种人性化的设计。王晓蓉、杨治明曾经建议人性化网页界面设计要具有美观性、舒适性、简洁性、一致性、高效性和安全性[3]。简约的网页功能针对用户的心理动机、认知心理、智力发展状况进行设计，表达意义简明醒目，易被用户注意和认知，而不是浪费时间去寻找功能。

形态的易记性 从记忆的角度来说，简洁单纯的网页元素要比复杂的网页元素更容易被人们记住。简洁单纯的事物视觉点突出，不会分散用户的注意力，能够保持长时间的注意力稳定。

情感表达的丰富性 简约化的网页呈现的不仅仅是一个视觉画面，它还蕴含着深刻的思想和丰富的情感。针对用户的情感心境，使用合理的文字、色彩、图像，能使用户对产品产生亲和力，从而加深品牌印象。因此，网页不仅注重它的美观度，更注重它的情感表达的丰富性。

3 网页界面设计中简约化要素分析

简约化设计与文字元素 文字是人类用来记录语言的符号系统，在网页界面设计中占有十分重要的作用，因为人们大多信息的获知都是以文字的形式表达出来的。众多构成要素中文字具有最佳的直观传达作用以及最高的明确性。文字传达本身语义之外，还传递其他一些信息。文字视觉形态的大小、颜色、曲直、排列的疏密，以及语言的强弱、缓急、和谐或嘈杂，以及表情、姿态等，能够引起浏览者内心相应的不同感受。文字简约化设计表现为以下几点。

1）易读性：文字的表达要能被大众理解，在排版形式上能够符合人们的视觉流程，在文字颜色和大小设计上要符合网页的设计风格。

2）明确性：信息表达简洁明了，不繁琐不模糊，能够明确表达网页设计的中心主题；在语义的传达上不会让人产生歧义，传达的信息容易被用户理解。

3）美观性：文字的大小、颜色、编排等的设计要符合人的视觉审美，选择适合于网页风格的文字编排；通过文字形体的统一变化、文字编排的节奏韵律、文字量感的对比和谐来增强网站的美观度。

4）适合性：针对不同的用户，使用合适的文字大小、颜色、语气、形态，拉近用户的心理距离，引发用户的情感共鸣，达到产品宣传的最终效果。

5）创新性：将文字图形化、意象化，以更富创意的形式表达出深层的设计思想，能够克服网页的单调和平淡，从而打动人心。这种方式的处理既是文字内容的直观表达，又是文字含义的延伸表达。它增加网页的视觉亮点，给用户耳目一新的感觉。

简约化设计与图像元素 图像在网页设计中扮演着不可缺少的角色，能够简化网页设计的各种复杂的信息，这也是大多设计师喜欢它的原因之一。图像简化信息的具体表现包括以下几点。

1）图像的直观性和简易性：图像取代了文字多而繁杂的缺陷，相对于大片的描述文字，人们更愿意去选择简洁和直观的图片，它易被理解和认知。尤其是在体现产品特质的网页中，与其使用大量的文字耗费精力，不如使用更直观的产品图片，提高信息的传递效率。

2）图像的丰富性和真实性：图像含有丰富的色彩，具有设计艺术的美观度和视觉的空间感，所以能够吸引人们的眼球。同时，图像多是真实的生活采集到的摄影图片，在艺术的表达上自然、不做作、真实，更符合人们简约化思维的模式。

在新闻资讯类网站中，图文结合是经常见到的现象。网站中都会把今日的重点新闻配上小块的图片放在网页中，不仅简化了文字的数量，还提高了用户处理信息的效率。图片的应用就是对信息的简约化处理，图像将信息以最直观、简洁的形式呈现出来，省去了人们阅读大篇文字的时间，也避免了因文字过多而迷失重点。

另外，图形的简约化还表现在LOGO设计上。LOGO可识别性强，使用简单的图形表达丰富的含义。简约化的标志更容易获得受众的认知，更具有时代性，是信息简化的产物。

简约化设计与色彩元素 色彩在网页设计中占有很重要的位置，因为就生理而言，人们对色彩的敏感度特别的高。马克思说：“色彩的感觉是一般美感中最大众化的形式。”[4]当打开一个网页时，关注色彩元素比其他的元素都要强，色彩最具表现力与识别性，出色的色彩搭配可以在瞬间吸引用户的目光[5]。同时，它能够体现企业产品的特质，在不需要过多繁琐的文字、版式等元素的搭配下，色彩就能直接简洁明了地给用户第一印象。

简约化的网页色彩设计就是根据网页类型的特质，从复杂的客观色彩中提取出最能凸显设计神韵的一到三种主观性的色彩，通过色彩的色相、纯度、明暗、色块面积等的对比，简化用户的视觉流程，给受众带来视觉和心理的轻松，具体表现为以下几点。

1）配色的统一和谐：同一色彩的大量使用，可以使页面整体化和秩序化，能快速给用户留下深刻的印象。

2）配色的强调和突出：使用和其他元素颜色对比强烈的某一色彩，可以引起受众的注意力。

3）配色的留白使用：采用大面积色块的留白，增强了页面的节奏感和韵律感，能够使页面简洁大方。

简约化设计与版式设计 如果把网页界面中的文字、图形、点线面等元素比喻成员工的话，那么版式设计就是一个管理者，根据员工的职能特点，依据一定的管理理论和方法，有效地激发员工优势，从而更好地完成任务。因此，版式设计就是将文字、图像、色彩、图标等元素有机组合，表达美与和谐[6]。

简约化的网页版式设计并不是将各种元素杂乱无章地编排，而是按照人们的视觉流程规律以及形象思维，有秩序统一地进行规划整合。基于受众的视觉流程规律，简约化的网页版式设计应该具有以下特征。

1）清晰易读：网页的不同元素位置设计，框架构造上和谐统一。每个元素不是混乱的搭配，而是根据人的视觉流程特点，将设计元素进行合理规划，能够在人的大脑中呈现出清晰明了的信息。

2）统一有秩序：统一和秩序增强了网页各元素的联系和轻重关系，符合用户的阅读习惯、心理秩序和思维发展的逻辑认知顺序。

3）相互呼应：呼应是指两个以上的形态之间通过“呼

唤”和“相应”的关系达到画面的均衡。有效的网页元素呼应能够增加元素之间的内在联系，使网页整体感突出。

4）中心突出：视觉中心是人的视觉心理量感所偏向的视觉位置。视觉中心突出的网页能够主次分明地把网页的元素进行位置编排，以突出网页要表达的重点信息。

简约化设计与留白 顾名思义，空白区域是指不同元素之间的区域。在网页设计中，文字之间、段落之间、图片之间等网页设计元素之间的区域都是空白。网页设计的留白并非意指白色，而是设计界面中内容的空白。认知心理学的研究证明，留在空白之中的东西更容易被人注意和想起[7]，它是符合人们的认知需求的，人们的注意力和记忆力不可能长期保持稳定的状态，他们需要外界的事物给予一个“缓冲”和“喘息”，以获得视觉和心理的缓和，因此，留白体现的是一种单纯轻松的理念。

“留白”在某种程度上代表着简约[8]。留白正是用这种“此时无声胜有声”的视觉语言，诠释了简约化设计的以少胜多之美。留白能控制视觉量感，保持了网页整体的统一性和平衡感，增加了网页页面的内涵和丰富性。网页设计中一般包括以下几种常用的留白技巧。

1）背景和元素间隔的空白：它能够清晰地分离页面板块，增加页面的空间感，更容易引导用户的视觉流程。

2）页面大面积色块使用：页面大面积使用某一色彩，可以强烈渲染、烘托网页设计元素和网页主题，简约时尚而更具视觉冲击力。

3）统一页面主要设计元素的背景，呈现出规则图形组合：统一而有秩序的页面能简明地体现网页主题的特质，更容易让用户认知。

4 总结

简约化网页界面设计符合现代人们视觉和心理的需要，是时代大背景的选择，体现设计界最先进的设计理念。将简约化的思想和理念运用到网页设计中，创造性地处理网页中文字、图像、色彩、版式等网页元素的关系，便能正确把握设计流程的方向，给设计师和用户一个规范的参考。

参考文献

[1]黎浩.简约主义：现代设计的风格倾向[J].高教论坛，

2004（5）.

[2]杨大松.现代设计艺术的简洁之美[J].安徽建筑工业学院学，2004，12（2）.

[3]何亭.人性化网页界面设计的进展与展望[J].美与时代，2012（9）.

[4]欧阳丹.浅析现代平面设计中色彩的简约化趋势[J].湖南工业职业技术学，2009，9（1）.

[5]吴爱群.简约版式在平面设计中的应用[J].美术教育研究，2012（3）.