时间：2023-08-01 17:39:55
开篇：写作不仅是一种记录，更是一种创造，它让我们能够捕捉那些稍纵即逝的灵感，将它们永久地定格在纸上。下面是小编精心整理的12篇网页设计的流程，希望这些内容能成为您创作过程中的良师益友，陪伴您不断探索和进步。
随着我国经济的不断发展，我国的IT行业得到了有效的发展。网页设计是IT行业领域中发展中重要的组成部分，其中DIV+CSS布局技术是网页设计和开发过程中重要的技术组成部分。文章对网页设计中DIV+CSS布局技术的应用和实践进行了分析和阐述，并且对DIV+CSS布局技术的表现、内容、代码、搜索等形式进行了一定程度的研究，以此促进IT行业领域中网页设计、开发的长远发展。
关键词：
网页设计；DIV+CSS布局技术；应用
在进入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的全称是CascadingStyleSheet，按照中文翻译为层叠样式表，是在网页设计、开发过程中，网页形式和网页信息之间的一种标记语言。在网页设计的过程中，DIV+CSS布局技术中的CSS技术可以准确控制网页中的页面的颜色、布局、背景等，网页中的页面效果更加的丰富，并且开发人员在进行网页设计的过程中，操作流程也相对简单，也使网页中的语言更加简洁化。第三，DIV+CSS布局技术在某种程度上将也是XHTML+CSS技术。人们在使用网页文档的过程中，对网页中的结构也在进行了一定程度上的规范。DIV+CSS布局技术将网页设计中的结构进行了一定的规范化，将页面中元素进行了一定的规整，使页面中的样式和内容分离，成为一个单独的个体。并且在将2种技术合为1种技术的过程中，可以使网页在操作的过程中，更加灵活、方便。
2DIV+CSS布局技术在网页设计中的作用
2.1和搜索引擎可以相互融合搜索引擎在网页设计的过程中起到了重要的作用，是根据Spider程序查找互联网中的内容。Spider程序一般是由少到多地进行网页内容的查找，等到将所有的内容查找扫描后，引入到其他网页中，然后访问网页页面，重复扫描、更新，直到内容出现为止。在使用传统的数据代码的过程中，在内容浏览和操作时不仅复杂，多余的代码也较多，但是在DIV+CSS布局技术中，可以将浏览和操作的流程相对地简单化，并且在搜索内容的过程中，时间也相对较短，其执行的效率也相应提高。另外，在DIV+CSS布局技术的应用过程中，将代码也进行了一定程度的简化，和搜索引擎配合良好。这样，不仅提高了网页设计中的执行的效率，也有效提高了网页设计、开发过程中的质量。
2.2简化了网页维护、更新等操作流程设计人员在对网页进行设计、开发的过程中，利用Table对网页进行版本的更新设计时，需要对网页中所有的代码进行一定程度上的整合，这样造成网页维护和更新的工作效率在一定程度上的降低。但是，随着时代的不断发展，我国IT行业将DIV+CSS布局技术有效地应用到网页设计。更新、维护的过程中，在一定程度上降低了网页中的内容，并利用DIV+CSS布局技术进行一定程度上的控制。当设计人员对网页中的某一个部分进行一定程度上的更新时，可以有效地提出这部分内容和代码，设计该区域代码，设计人员利用DIV+CSS布局技术对网页进行设计、维护、更新，对其他部位也不会造成任何的损伤。
2.3加强了传输的效率在传统的网页设计的过程中，往往只注重网页页面的效果和带给人们的视觉冲击，在这种情况下，设计人员在网页中的传输效率较慢，也给网页使用带来一定程度上的影响。但是设计人员在使用DIV+CSS布局技术进行网页设计、开发的过程中，可以对网页中的代码、文字、图片进行灵活的设计，设计人员利用网页中的过滤软件，取代了图片带给网页的视觉冲击。同时，DIV+CSS布局技术也将网页中的中体布局分为不同的层次，在网页开始使用的过程中，无需将网页的内容储存到一个较大的表格中，这样在一定程度上加快了网页的传输效率，在人们的日常生活、工作使用的过程中最大程度地提高了便利性。
2.4有效地提高了网页设计中的视觉效果软件设计人员在进行网页设计、开发的过程中，利用传统的Table对代码进行整合，在网页的页面中，图片、文字等效果的分辨率并不高，页面的效果并不是很好，同时在设计的过程中，需要大量的设计人员。不同的设计人员所设计的网页形式也是不同的，这样对人们使用的网页造成了一定程度上的影响。但是，在DIV+CSS布局技术对网页设计、开发的背景下，DIV+CSS布局技术能够有效地统一设计人员的设计理念、风格、特点等，并且DIV+CSS布局技术可以有效控制网页中的结构，提高了页面中图片、文字的分辨率，也给人们在使用网页的过程中带来一定程度上的视觉冲击。
3DIV+CSS布局技术在网页设计、开发中的应用
在网页设计、开发的过程中，设计人员要想有效地利用DIV+CSS布局技术对网页中的结构进行一定程度上的规划，就要对网页中的语言代码的结构进行一定程度的分析。网页中的语言代码其实就是网页结构中的构成元素，网页结构其实就是网页设计、开发过程中的构架。换句话说，就是在网页设计的过程中，对网页中的内容进行有效的规划。下面就对DIV+CSS布局技术在网页设计中的应用进行简单的分析。
3.1DIV+CSS布局技术在网页中内容规划的应用设计人员在网页设计、开发的过程中，应当对网页中的内容的几个基本组成要素进行具体的分析。网页内容中的几个基本的要素一般情况下可以分为：网页的头部、网页的主体、网页的页脚和网页中的版权区域。另外，DIV+CSS布局技术在网页设计的过程中，可以使网页形成基本的框架。并且在具体的编写的过程中，DIV+CSS布局技术可以有效整合网页中的代码，最大程度地简化操作流程，为设计人员提供了方便，提高了设计人员的工作效率，同时也使人们在使用网页的过程中可以一目了然。
3.2DIV+CSS布局技术在网页设计中信息的应用设计人员在利用DIV+CSS布局技术进行网页设计、开发的过程中，可以灵活地将网页中的信息进行一定程度上的整合，并有效地展现出来，给人们视觉的冲击。在网页设计的过程中，要对网页中的信息元素进行定义，合理安排网页页面中的信息，这样不仅简化了设计、开发的流程，也有效地减少了设计人工作人员的工作负担，从而提高了工作人员的工作效率。同时，也使网页中的形式更加丰富，例如：新闻、通知、公告、天气等信息形式，也有效地节省了网页中的空间，给人们使用网页提供了最大程度的方便，也给人们带来了视觉上的冲击。
3.3DIV+CSS布局技术在网页设计中的链接的应用设计人员在网页设计、开发的过程中，DIV+CSS布局技术具有重要的作用，同时，网页动态链接是DIV+CSS布局技术中应用的重要的环节。a：link，a：visited，a：hover，a；active是网页动态链接过程中重要的组成部分。在网页设计、开发的过程中，要想将DIV+CSS布局技术应用在网页动态链接中，就要对a：link，a：visited，a：hover，a；active等一一定位，这样可以在最大程度上提高设计人员的工作效率，也给人们在日常生活、工作中使用网页提供了最大程度的方便，同时也有效地促进了我国IT行业的发展。
4结语
综上所述，DIV+CSS布局技术在网页设计、开发的过程中起到了重要的作用。文章中对DIV+CSS布局技术在网页设计、开发过程中的应用进行了简单的介绍，随着我国经济的不断发展，DIV+CSS布局技术成为一种较为流行的网页设计、开发技术，简化了操作流程，使设计人员的工作效率得到有效的提高，也给人们在日常生活、工作中使用网页提供了最大程度的方便，同时也有效促进了我国IT行业的发展，为我国的经济建设作出了自己的一份努力。
[参考文献]
[1]车元媛.基于DIV+CSS的网页布局技术应用[J].电脑知识与技术，2011（9）:2019-2020，2023.
[2]赵清华，林学华.基于DIV+CSS的网页布局技术应用研究[J].现代计算机：专业版，2010（5）:140-142.
[3]温盛萍.DIV+CSS布局技术在网页设计中的应用[J].信息化建设，2015（10）:75.
而目前国内网页设计的现状是：为了追求页面内容的丰富，无论网站属于何种性质都尽可能将页面内容做多、做长；首页被分为若干个相应区域，每两块之间再加一条广告，更有甚者会在页面的最上端加一个所谓重中之重的综合区域。一些企业类的网页还会尽量将该公司所有的产品介绍都罗列到网页上。这些网站将文字、图片、动画等各种信息不加考虑地塞到页面上，不分主次，不进行规范化、条理化的归类，更谈不上艺术处理，其直接结果是导致信息传播的效率低下，与设计者的初衷相去甚远。
一、影响网页版面和空间设计的生理和心理因素
1、视容量
视觉容量是指在一定时间内，视觉所能容纳的信息量。人眼的视觉容量一般用比特作为计算单位，每一秒钟正常的视觉容量是25比特，约四个信息单位(如文字)。视觉容量的接受程度受到视觉对象的清晰程度，照明对比程度以及人们的文化程度和实际经验等因素的影响，各人略有不同。一旦视觉接受到的信息超出一定的视觉容量，人们就会产生相应的抵触反应，引起不快。这就是为什么浏览一些超大容量的页面时，人们容易产生视觉疲倦和心理抵触的主要原因之一。
在网页设计过程中应当重视视觉容量的限制。网页上的内容容量需要多大?文字、图片等信息应该如何归类?页面级别应如何区分等等，在进行网页设计初始时需要进行认真规划，才可能将网站信息有效快捷地传递给用户。
2、视觉流程
人们在阅读中，视觉有一种自然的流动习惯，视觉流程的形成是由人类的视觉特性所决定的。受生理结构限制，人眼只能产生一个焦点，不能同时把视线停留在两处或更多的地方，所以人们只有依照一定的顺序浏览观察。
网页浏览过程是一个动态的视觉流程。一般来说，我们的视觉习惯于从左向右，从上向下看，所以一个空白的网页给我们带来的自然视觉流程是从左上方到右下方的一个弧形曲线。在这个弧形曲线上，视觉优势从上到下递减。合理运用视觉流程原理，有助于我们合理地布置网页中视觉元素的位置，划分相关的页面版式区域，提高信息传播的效率。
二、通过合理的设计有效传达信息
1、合理借鉴传统信息载体的信息规划方法
“版面编排”实际上就是中国古代画论中的“经营位置”。而网页的版面设计也遵循着同样的规律。尤其是起着门户作用的首页，其版面的设计规划更需要慎之又慎。作为版面内容的文字和图片都需要第一时间展示给用户，所以决不能简单地罗列在页面上。首页的作用就像书籍的目录：作为传统的信息载体，书籍的目录主要起着引导浏览的作用，而作为网页的首页也起着相同的作用。因此在设计过程中就要尽量避免将过多的信息内容堆放在首页上，只需将主要导览信息列入即可，这样反而更有助于浏览者快速找到所需信息，提高信息传达的效率。这也正是中国传统绘画中所讲的“少即是多”。
在网页设计中，网页的空间结构反映了网站内各种信息之间的关系，是直接影响视觉信息传达效果的重要因素。网页之间的关系就像书籍中各章节之间的联系一样，形成一个无形的“空间”。这个“空间”包含物理和心理两个方面：物理空间如首页与各级页面之间的联系。各级页面之间的设计风格的相互统一，内容的相互协调，都对这个“空间”的形成起着至关重要的作用。从心理方面来讲：为网页创造人性化的视觉和心理空间也是必需的，我们可以从整个WEB站点的角度出发，考察页面之间的空间关系，充分利用网页这种信息载体的特点，创造更高效的思维互动心理空间。
2、传统形式美法则同样适用于网页版面设计
作为传统平面媒体版面设计的一些基本原则，依然可以在网页的版式和空间设计中发挥其重要的作用，比如：
(1)变化和统一。
在图形设计中运用变化与统一的规律，是处理形象和组织的对立统一过程，那么在网页设计中同样要恰当地的利用这种规律。在我们把大量的信息塞到网页上去的时候，应该考虑怎样把它们用合理的、统一的方式来排列组织，使网页整体感强并且富于变化，使页面更丰富，更有生气。
(2)条理与反复。
条理与反复的原则是图形构成整体的秩序美的基础，这种手法在很多优秀的网页设计作品中运用的较多。这类网站信息含量大，需要运用一定的方式将信息条理化并加以归纳后重复利用，使页面整洁，脉络清晰，信息浏览方便快捷。当然，对于信息量较少的网站同样需要条理与反复，以达到更富有变化和清晰的视觉效果。
(3)对比和调和。
对比是指在质或量方面相互差异甚大的两个视觉要素同时配置在一起时，两者之间相互作用给人以更加强烈的视觉冲击力。那么在网页设计中，如何利用它来达到好的效果呢?首先合理地利用对比的因素，例如文本和图片尺寸、比例以及位置的排布等等，最终的目的就是如何取得较为强烈的视觉效果。此外还要恰如其分地找到调和的因素，即版面和空间的联系点，使整体感觉突出，不至于仅仅因为对比而造成割裂的感觉。只有做到对比和调和的相辅相成，才能使网页页面鲜明、突出，更好地传达出设计者的意图。
(4)均齐与平衡。
这是设计中求得中心稳定的两种组织形式。在网页设计中，平衡是一个动态的平衡，因为页面上两边的配置不会总是绝对统一的。更多的时候是版面中各个区域的相互平衡，这是一种动态的平衡。这种方法可以满足人们视觉上的整体平衡感，也是人的心理因素的一种图形化表现，当然不是片面地追求静止的对称，那种僵硬的、不生动的形式同样会失去美感。
(5)节奏与韵律。
运动中的事物都具有节奏和韵律的形式规律。在具体的网页设计的运用中，版面的编排就经常会遇到这个问题，优秀的版而设计富有音乐般的美感，同时丝毫不损其实用性，这需要不仅是从形状上，而且要从整体的色泽、大小等综合方面人手。
(6)适当留自。
关键词：网页设计；职业定位；人才培养
中图分类号：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.
[2]赵京丹，闫宁.任务驱动教学法在Dreamweaver网页制作教学设计中的应用[J].职业教育研究，2007，7.
>> 用Photoshop和Dreamweaver轻松布局网页表格 Dreamweaver网页设计中表格与层布局的比较 CSS+DIV布局与表格布局网页的对比 CSS+DIV与表格实现网页布局的比较 网页设计中的表格绘制 网页版面布局设计教学之我见 浅谈网页设计中页面布局的教学 网页设计教学中表格与层的应用研究 网页表格布局方式和DIV+CSS布局方式的比较研究 网页设计的布局和用色技巧 基于CSS页面布局的网页设计 网页版面布局设计的探讨 浅析网页设计中的页面布局 网页设计中布局模式的比较 浅谈网页设计中的布局工具 浅谈网页设计用图 基于项目化教学的“网页设计与布局”课程教学研究 表格与DIV+CSS的布局设计分析 “网页设计”课程中DIV+CSS布局技术的教学 DIV+CSS布局在网页设计教学中的应用研究 常见问题解答 当前所在位置：打开）请你将这个页面中的文字和图片排列整齐（文字、图片无法排列整齐，再打开bg2.htm）。现在请你将图片和文字分别放到表格中，看看效果。
教师：通过这个实验，你得出了什么结论？
学生：用表格可以很方便地将文字与图片排列整齐。
教师：说得很好，表格的作用就是将网页中的文字、图片等素材对象进行定位。网页都是用表格来进行布局的，请看两个范例（展示网页的表格）。
【设计意图】事先预设此环节，安排学生李彦在适当的时候提出问题，引出课堂知识冲突，为下一环节做好铺
垫；同时吸引学生的注意力，及时调整学生的学习状态。通过设计一个对比实验，用实验验证学生的猜想，让学生总结实验结论――表格在网页布局的作用，培养学生的钻研、思考、解决问题的能力。
插入表格
教师：插入表格之前，为了编辑的方便，我们通常要先设置网页大小。在通常情况下，我们一般将网页大小设置成默认状态的“当前网页大小”。
教师：接着请各位设计师在此页面中按照你的布局草图的行列数插入表格，最后将相应的文字信息填写到表格中，效果请参照大屏幕。
【设计意图】通过演示法讲解、回顾打开网站站点的技巧与方法、网页大小设置方法，快速进入任务二的学习中。
调整表格
教师：各位设计师，表格插入好的请举手。（环顾学生）若有不会的，请一个设计师演示。请各位结合Word中表格的相关操作，还可以结合教材中的步骤，完成单元格的合并与拆分的操作，使网页布局更加合理。
【设计意图】关于表格的插入、拆分、合并单元格等操作已经在Word、PowerPoint设计多媒体作品时学过，学生可以凭已有的知识完成，也可以参照教材的步骤完成，培养学生的自学能力与意识。
作品的保存与评价 要求所有设计师保存提交作品，展示1～2个设计师作品，并做好评价。
【设计意图】及时评价与反馈学生的作品，能够鼓励和督促学生认真完成作品的设计。
课堂拓展练习 如图3所示课堂提高练习，在第二行调整导航栏这一行单元格列宽，使他们平均分布时不影响第三列图片这一行，该如何实现？请参照教材的阅读材料一提供的方法试一试。
【设计意图】结合教材阅读材料，通过设计课堂拓展练习，能使学习有余力的学生在课堂上有充分发挥，培养其自学能力。
4 课堂总结
师生一起回顾所学知识，课堂小结内容如图4所示。
关键词：网页交互设计；视觉传达
因时代的进步互联网络的快速发展是必然的，作为一种全新的视觉传播媒介，具有迅速、价廉、及时、传播面广的特点。网页作为互联网的代表传播方式之一，它的设计既要有传统平面该有的设计特点，还要有现代技术的组成，将技术与艺术巧妙的相融为一体的交互性活动。本文尝试着从视觉传达设计中文字、色彩和排版对人生理和心理的作用应如何运用到网页设计的交互式上，帮助设计师更好地利用视觉表现让客户达到良好体验。
在笔者看来，一个好的设计师或互联网技术人员未必能够做好网页设计，因为它不只是光需要设计师的审美或技术人员的开发。一个好的互联网产品需要产品经理与设计师和技术人员的三方沟通，一个优秀的设计师其实可以胜任产品经理加设计师的工作。所以我们在做网页设计时，应该以一个产品经理加设计师的思维共同设计。心里的思路应该很清晰，例如我们的客户群体是哪些、他们有哪些习惯、我的颜色该如何搭配、字体用什么才能吸引让客户群体等等，这些都是在进行网页设计前所要思考的，至于如何正确地匹配到这些选项，还需要我们仔细地探究。
一个好的网页设计并不是简单地把文字图片放上去就够了，我们需要揣测用户的心理因素和生理本能，比如说网页的大小比例、字体大小、图片大小和整体的排版风格。下面就跟大家浅谈下网页设计中的信息视觉传达：
1 文字
对于在网页上的文字设计来说字体的基本要求是可阅读性，其包括文字的大小、字与字的间距、段与段的间距和行列长短间距等方面的处理。
很少一些网页对字体进行再次设计，原因是不同的计算机操作系统和字体文件安装都是不同的，所以必须选取一些常规的字体，否则一部分用户上的字体就会变成默认字体，这将与设计者本身的设计意图大大相否。
其次，用户使用的屏幕显示也对字体有一定的影响，设计是大多数会采用宋体或黑体两种字体，从用户心理感受来说，宋体字较为活跃、生动，阅读起来不容易疲劳。而黑体字方正端庄，线条粗犷醒目，但在缩小到一定程度时容易模糊，造成识别困难。
2 色彩
色彩设计对于一个优秀的设计来说非常重要，在网页设计中也是设计的关键，在互联网快速的阅读中如何第一秒吸引到用户成为视觉传播的关键。人对色彩是相当敏感的，当他们首次接触一个网页时，最先吸引其注意力的就是网页的颜色，其次是图像，最后是文字。色彩给其他人的印象特别强烈，所以设计师最容易通过色彩去表达他的设计意念，例如天猫和京东的红白色主页的设计，强烈的颜色冲击了人们的心理视觉给人强烈的购买欲望。
网页上的颜色主要表现在主导色、辅助颜色和背景颜色这几个方面。占颜色面积最大的是网页主色调。主色调像是一幅画中的主色，在创造特定的气氛与意境上发挥主导作用。第二大的是辅助颜色，起的作用是强调或调和。网页的背景色是增加画面空间感的重要措施。例如，较暗的背景色与鲜明的主导色形成鲜明的前后空间关系。
设计师对不同功能的色彩进行理解和分析，搭配好主色、辅色和背景色的运用比例才能给用户一个良好的视觉体验。
3 排版
排版设计在网页设计中也可以叫做页面布局，把零散的网页名称、导航栏、搜索栏、图形、文字和符号进行点线面排版。四周的“空间”并不是没有的，可以留白或留灰，突出页面主题物让网页在使用中更加简洁和便利。
设计师根据“以虚托实、以无衬有”和信息传达的要求进行合理排版，此时需要注重用户心理的潜意识和生理的行为习惯进行排版设计。比如用户在浏览页面时，第一眼优先注意到的是四周留白的文字，@就是视觉的边际效应在虚空间的一个体现。从而使设计师设计的平面网页能够充分与用户有所“交互”，使用户体验获得更佳的视觉印象。
4 视觉规律
视觉规律是根据人的视觉心理因素和生理习惯而决定的。人有两只眼睛但是因为人的眼球原理只允许产生一个视觉焦点，不能同时停留在两处以上（包含两处）的地方。因此人们自由阅读时，都会有一个生理习惯，从上往下和从左往右阅读。
心理学研究显示出，在一个平面内人在阅览上半部分时会让人感到轻松愉悦，下半部分时则会感到郁闷压抑。同样左半部分让人感到轻松愉悦，右半部分则会感到郁闷压抑。所以左上部分称为“最佳阅览区”。视觉流程导向又分为导向类视觉流程、重心视觉流程、反复视觉流程、散点视觉流程，我们在网页设计中就可以依据这些用户的生理和心理的“规律”来进行交互设计，从而使用户达到良好的使用体验。
优秀的网页设计师提供愉悦的交互式体验，不仅对文字、色彩和排版进行探究设计。网页上操作面板上的按钮和开关和导航的分栏等，设计师利用交互性及时让用户知道如何操作这是很重要的。那么设计师必须合理地运用示能、意符、约束、映射和反馈这几个心理学概念进行科学的设计。
参考文献：
关键词 网页设计 发展趋势 教学设计
中图分类号：G642 文献标识码：A
Improve Web Design Curriculum Teaching of Art
Professional with the Development Trend
XIE Tao
(Graduate Department, Hubei Academy of Fine Arts, Wuhan, Hubei 430060)
AbstractAs a digital media arts and visual communication in one aesthetic, as an integrated interdisciplinary curriculum, "Web Design" is developed as the core curriculum by many professional art and design colleges and universities. With the rapid technological development, professional web design courses for the Art features need continuously to improve teaching methods, enrich the teaching content in order to enable students to master the most practical web design techniques, to train highly qualified personnel for the different needs.
Key wordsweb design; development trend; teaching design
随着计算机技术的发展和Internet互联网普及化程度越来越高，网页设计与制作已经成为当代视觉设计师必备的专业技能之一。就网页设计课程教学而言，不仅要求学生掌握相关的计算机技术，更要具有专业的美工基础和艺术素养。培养能适应时展与市场需求的网页设计师，艺术专业网页设计课程就必须紧随技术更新步伐进行教学改革，以便适应时展需求。
1 设计软件与开发技术的发展与更新
网页设计软件众多，业界广泛使用Adobe公司的Dreamweaver，高校网页设计课程也基本以此作为软件教学内容。经过数年发展，最新版的Dreamweaver CS 5推出了许多新功能，因此课程的软件操作教学内容也需围绕新版本展开讲授。
早期的网页设计师在设计流程中主要追求良好的美学效果，不太关注语义化和可用性方面的问题。随着技术的发展进步，遵循网页标准（Web标准）进行网页设计和网站开发，已经成为当代网页设计师必备的技能之一。用Div+CSS布局来替代传统的table布局，使内容与表现相分离，页面信息结构更清晰，有利于内容的重用。网页标准还使网站开发与维护更简易，与未来浏览器也完美兼容，使访问者获得更好的浏览体验。
Flash曾经作为网页设计中的视觉元素之一，现在已经发展成能够开发整套网站的强大工具，提供了大量的远远超过 Html 所能够实现的视觉表现效果，Flash 使创建复杂的、互动性强并且拥有动画元素的网站成为可能。Flash流媒体技术的广泛使用也是网页设计的一个新趋势，页面元素不再是静态的文字和图片，也不再局限于二维的Flas效果，结合音频和视频技术的Flv流媒体技术由于不需要安装插件，有着优秀的兼容性及交互性，在网页设计中的应用达到一个新的高度。
3D技术是当前视觉艺术的一个热点，基于Internet具有交互性的虚拟现实建模语言Web 3D技术，使二维的网页向三维发展提供了很好的支持，代表了三维网页的发展方向。同时，更多的浏览器开始完美支持和表现新一代Web 语言、互联网标准Html5，视频播放、动画、3D交互图像、Web视频聊天及会议、音频的采样和混合都将是Html5的重要优点和应用趋势，并将引领下一代 Web 实现类似桌面的应用体验。
随着技术的进步，网页设计越来越重于表现多媒体的特性，这就需要网页设计师不仅要掌握基本的专业技能，还需拓展其他相关领域的专业知识，才能提高职场竞争实力。
2 审美的提高促进网页设计新思维
一个极具艺术感染力的网页设计作品会得到众多来访者的倾心，提高网站的亲和力与回访率。特别是在信息高速发展的今天，人们审美意识的提高，客观上将网页设计推向了更高层次的表现境界，网页设计风格个性化、技术多元化将成为必然的发展趋势。
网页的设计与制作，除了要表现动态效果及强大的交互功能，还应着力提高设计美感和艺术氛围，界面设计同样要符合视觉艺术的形式美法则。
（1）布局合理、排版简洁。结合优秀的版式设计，对页面元素及内容进行归档分类与优化，做到信息的主次分明。
（2）风格统一、整体性好。网站的整体性是通过好的界面设计风格体现出来的，色彩搭配要协调，图像图形的制作要精致，突显网站主题与格调。
（3）创新性的视觉特色。善于做创新性的视觉设计，让页面设计在同类网站中脱颖而出，带给用户愉悦的视觉感受和浏览体验。
（4）易用性。网页最终会于用户终端显示，简洁易用也是非常重要的设计原则，让美的页面建立在易用的基础上，在整个设计过程中都要始终贯穿这种思想。
网页设计师根据网站定位的需求，重视用户体验，并将独特的设计思维融合到网页设计中去才能做出最优异的网页设计。艺术专业的学生应充分发挥自己的设计优势，将技术与艺术紧密结合，使设计制作出来的网页达到实用性和审美性的高度统一。
3 根据市场的需求充实网页设计课程教学内容
艺术设计专业培养的网页设计师主要涉及网页前端架构，如网站的整体风格规划及版式设计、界面设计等，这些都属于网站开发流程中视觉设计的范畴。作为整个开发团队的一员，网页设计师不仅要胜任前端设计，还要与站点开发人员合作密切，熟悉网站后台的管理；不仅要精通静态Html（Xhtml）语言与CSS，还要了解各种动态网站架构语言如ASP、PHP、JSP、CGI等；除了能胜任网站的规划与设计，还要掌握网站建设相关方面的知识如服务器与虚拟主机的管理与维护、域名的注册与解析、网站备案、SEO搜索引擎优化等。除此以外，网页设计师还能借助各类CMS(网站内容管理系统)构建各种功能性的网站、论坛及博客系统。
竞争所需使越来越多的公司和企业开始开拓网络市场，树立其在互联网上的良好形象。市场的多元化发展趋势也对网页设计师的素质提出了更高的要求，不仅要精通专业技能，还要眼光敏锐及时把握网页设计相关领域的最新动向。这就要求网页设计课程教学在讲授理论知识与操作技能的同时，还需重视实践教学的重要性，从多方面拓宽学生的知识层面。
4 根据教学目标及内容调整教学方法
在传统网页设计教学中，一般沿用以教材为中心，教师课堂理论陈述及操作演示的教学模式，缺乏实践性，无法达到课程教学目标。因此，要充分利用多媒体教学环境，发挥教师在教学中的主导作用和学生在学习过程中的主体作用，采用适当的教学方法激发学生学习兴趣。
4.1 改进实践教学，锻炼学生独立创作的能力
在实践教学中，根据教学目的和教学内容选用典型案例，通过对网页设计案例的分析讲授其中所应用到的理论知识，在学生理解基本理论知识的基础上再演示案例，使学生进一步熟悉相关理论知识的应用及实际操作，有助于培养学生分析问题、解决问题的能力。同时，教师可以从威客网上搜集一些商业设计项目作为实训内容，让教学目标更加贴近市场的真实需求，提高学生学习的主动性和积极性。另外，还可以定期举办网页设计大赛，组织学生和专业教师进行评选，并将优秀参赛作品放在网站上作为教学成果展示，这些活动不仅能调动学生的学习兴趣，也极大地丰富了学生的学习生活。
4.2 借助网络技术实现教学互动，完善教学手段
在实际教学中，不是所有学生都能及时掌握教师课堂上所讲的内容，还需在课后对相关知识点进行复习巩固，网页设计课程本身的特点也决定了可以充分发挥网络资源的巨大优势。教师可以开设个人教学网站，将课件及相应的学习资料放到网站上供学生访问下载，同步与更新各种学习相关信息，学生也能通过在线留言板和学习论坛与同学或老师相互讨论，解决问题，教师则可以根据反馈信息及时调整教学内容。
4.3 理论与操作相结合，综合全面评价学生
考核是检测教与学的重要手段，也是教学中一个重要环节。一个好的考核方式不仅能全面真实地反映学生的学习水平，还能反映出教学中存在的问题。除了必要的理论知识考核，可以布置一个项目设计任务作为课程实践部分的考核内容，比如让学生设计制作自己的个人网站。先对个人网站的设计做总体规划，列出设计方案，由教师审阅并给予修改建议后再完善方案并实施，在设计过程中教师要关注进度并及时指出设计中的不足之处让学生解决。这种考核方式既强调了实践性教学，又培养了学生自己独立完成网站设计和制作的能力。
互联网作为一种新兴的数字媒体发展迅速，网页设计也成为视觉设计师最为关注的新领域之一。艺术专业的网页设计课程教学不仅要体现时代性，还要富于创造性，具备前瞻性。教师必须紧密关注网页发展动向，随市场和时代的发展趋势改进教学内容和教学方法，才能培养出适应市场需求的高素质设计人才。
参考文献
[1]张伟娜.《网页设计与制作》课程教学的探讨与实践[J].中国教育信息化・高教职教,2008(2).
[2]张丽香.高校《网页设计》课程教学探讨[J].大众科技,2008(5):104-150.
关键词：“职业岗位定位”，“工作过程”，职业教育，网页设计
1引言
近年来，我国高等职业教育取得了令人注目的成绩。但是，在高等职业教育领域仍然有一些问题没有得到很好的解决，其中之一就是高等职业教育人才培养效果与市场需求之间存在偏差。也就是我们高职学校培养的人才定位与企业需求人才岗位定位之间存在差异。高等职业技术学校的计算机专业主要是培养计算机技术应用型人才，重点是培养动手能力和解决问题的能力，学生参加工作后，能很快根据自己的定位进入角色。本文正是基于这一理念，提出了以“工作过程”为导向，面向“职业岗位定位”的教学模式，将企业人才岗位定位引入到课程职业定位中，将企业项目开发过程贯穿于整个教学过程中，并将企业人员角色进入教学环节中，同时采用“项目导入、任务驱动”的教学法。并将其实施于网页设计与制作课程的教学过程中，得到了很好的效果。
2.基于“工作过程”面向“职业岗位定位”的教学模式
基于“工作过程”面向“职业岗位定位”的教学模式是一种培养技术应用能力和综合应用所学理论知识解决实际问题的新模式。能够使得学生在一个仿真的职业环境中，为学生提供不同的工作岗位，使得不同性格，不同学习进度，不同兴趣爱好的学生都能找到自己的位置。让学生在毕业之前就能明确自己的职业岗位定位，并且学生可以充分了解企业中的业务流程，真正认识自己，为自己在今后的工作中进行进一步定位，在社会上找到真正适合自己的工作，在工作中能很快适应工作环境和工作方式。
2.1网页设计课程的岗位职业定位
通过“中山人才网”、“前程无忧”、“中华英才”、“智联招聘”等专业招聘网站对北京、上海、广州、深圳、中山、珠海等大中型城市的人才招聘信息进行分析，并对1万多份相关职业岗位的招聘信息进行统计，确定本课程职业岗位。与高职“网页设计”课程相关的职业岗位主要有：网页设计与制作、网页美工、网页制作、网站管理、界面设计、网页编辑、网站运营、搜索引擎优化，如下图1所示。
图1 相关职业岗位分析图
将技能要求相似的岗位进行合并，主要岗位有：网页设计与制作、网页美工、网站管理、网页编辑、网站运营。因此，通过对职业岗位的分析，对于《网页设计》这门课程来说，主要面向的岗位是：网页设计与制作员、网站管理员、网站编辑员。
3基于“工作过程”面向“职业岗位定位” 教学环节
基于“工作过程”面向“职业岗位定位”的教学环节是将企业的经营理念、企业项目开发过程和企业内部的人员岗位定位引入到传统实验教学环节中。这对传统的实验教学环节起到了很好的补充作用。“项目导入、任务驱动”的教学法是培养学生的基础知识运用，而基于“工作过程”面向“职业岗位定位”的教学模式是培养学生的综合知识的运用，并且模拟企业提供了许多不同的工作岗位，为不同个性的学生提供了更多的自我发展和培养机会，在这个真实的环境中，学生能了解企业中都需要哪些工作岗位，自己适合那种工作，为自己的将来定下目标，而且通过对“岗位定位”教学模式的实施，学生在毕业时基本上已经对网站开发流程有了基本的认识，这样能更好的适应企业的取药，学生能更好的融入工作角色中。
4网页设计课程教学环节实施
4.1 职业岗位定位
网页设计课程是以“项目导入、任务驱动”的教学方法来培养学生的基础知识运用。教师所设计的项目，应将培养学生的职业能力作为出发点，联系市场发展，从企业需要出发，以实际项目开发流程来确立课程的知识体系，使知识体系结构中的各个知识模块包含学生应掌握的能力素质。选取的项目要有一定的应用价值，可以直接从企业中获取真实项目，也可由教师根据教学需要，精心设计有市场适应性的项目。因此对于职业岗位定位模拟公司的内部结果，下面图2是模拟公司的人事结构图：
图2公司的人事结构图
对于网页制作部这块，主要有部门经理、项目经理、网页制作人员。。网页制作部的经理负责管理网页制作部门的各项工作，宏观控制各网页项目的完成情况。项目经理负责根据项目的客户需求，书写概要设计和详细设计；负责开发、测试、及验收的全过程；负责项目成员的管理以及项目组之间的协调和技术交流。网页制作人员负责按照项目经理的工作分配，根据详细设计编写代码和开发数据库，并对程序进行初步测试。。
教学正式开始之前,先对学生分组,一般4 - 6人一组,尽量使每一组学生的能力都比较均衡,并选定一个项目经理（在本教学中也叫项目组长）负责每个小组的工作。
4.2 基于工作过程教学环节的实施
4.2.1项目的确立
项目教学的关键在于项目的选取。一个项目的选取好坏直接影响到项目教学法实施后是否能取得较好的结果。好的项目不但锻炼了学生的学习和动手能力,还可以激发学生的学习兴趣,让学生在完成任务之后能获得成就感。因此,要选择切实可行并且是学生感兴趣的项目。
本教学环节一般是以小组为单位,走进社会进行网站需求调查,在小组通过调查、讨论之后,确定具体项目。这时教师根据学生的实际水平和网站的难易、典型性给出指导性意见,选择合适的网站主题并指导学生写出详细的内容策划书。在随后的课堂活动中,各个小组总结并由组长介绍本小组的网站项目,在全班开展交流讨论,由其他同学提出意见。最后确定网站的具体项目内容。让学生以小组为单位开发设计网站的主题、类型、风格,具体的计划、设计等工作都由学生自主完成。。
4.2.2项目的开发
要完成一个项目，即完成一个网站的建设，必须制定项目计划，有特定的工作流程，只要按照这个步骤，才能设计出满意的网站。项目计划如图3：
图3 项目计划
图3不仅是一个网站的开发基本流程，还是一个课程体系结构图。
对于网站的开发基本流程是：确定网站的主题、收集资料、规划网站、选择工具、制作网页、上传测试、推广宣传。
对于课程体系结构：以项目开发流程为出发点，将该课程分成网站策划、网站规划、网页风格设计、网页制作、网站测试和网站上传与更新维护等六个知识模块，每一个小的模块项目又具体细化为一个个小的任务。每个任务根据教学的实际情况可以再细化。
4.2.3 项目考核评价
项目的考核、评价在教学过程中也是非常重要的一个部分，对提高学生的开发能力有很大的帮助。本方法采取的评价方式有：
①小组团队自评
学生完成一个任务后，每个小组都要展示他们的成果，并由项目经理对他们任务的完成情况进行总结和评价。
②学生互评
其他同学也可以对该小组的开发提出问题或发表看法意见，营造各抒己见、相互学习的氛围。
③教师总评
最后，教师对各小组的成果做综合评价。教师的评价既要注意对技能和成果进行评价，也要对学生的态度和方法进行评价。既要肯定学生的成绩和进步，也要根据各小组的特点提出存在的问题，帮助他们进一步提高。此外，教师还要推荐优秀的学生参加能力鉴定考试，取得相应的证书。
本文应用于网页设计课程项目的考核评价模式结构图，如图4所示。
图4 项目与任务的实施与评价的模式结构图
5 总结
本文提出了基于“工作过程”面向“职业岗位定位”的教学模式，并将它应用于网页设计课程中，它使学生置于一种模拟环境中，呈现给学生具有挑战性、真实性、复杂性的问题。本文的特色在于在人才培养过程中将企业人才岗位定位引入到课程职业定位中，将企业项目开发过程贯穿于整个教学过程中，在教学环节中，模拟公司内部的结构和运作模式，是学生熟悉公司项目开发的流程和人员定位，增强了项目开发的实践经验，同时与就业零距离。
参考文献：
[1] 梁瑞玲.任务驱动法在《网页制作》课程中的应用实践[J].教育信息技术.2007年09期.
[2] 史瑞芳.”网页设计与制作课程中项目教学法的引用[J].山西经济管理干部学院学报.2008年04期.
[3] 余平.项目驱动在网页设计实践教学中的应用[J].实验室科学.2007年05期.
关键词：网页设计；视觉美感；审美价值 一、网页设计美的标准
对于美，每个人都有不同的标准，但是我们衡量一个事物的美丑不能只看外表。比如，一个真正美的人不单单是指外貌美，更重要的是指心灵美。网页设计亦是同样的道理，那么怎样评价一个网页的美丑呢？
从审美性上讲，一个优美的网页首先要有好看的界面设计，网页属于瞬间艺术，当浏览网页的时候浏览者首先看到的是网页的界面设计，因此网页的 “外貌”首先要吸引人的注意，使人们看着舒服，看着美。同时现阶段人们随着人们对网页设计重视程度的加大，设计师逐渐将字体设计、版式设计以及配色艺术等多种视觉语言应用于网页设计，使网页的界面设计更加美观。另外从功能性上讲，一个美的网页设计首先在功能上利于人们的阅读，具有科学的、合理的、符合人体工程学的视觉流程，能够使用户能够轻而易举的获取信息。新的科学技术、新的计算机编程语言相继被应用于网页设计中，使网页设计的交互性不断加强，人们在获取信息的同时也能够感受到人机互动带来的触觉、视觉双重感受，增加了网页设计的趣味性。
通过以上可以看出，美的网页设计不仅在形式外观上要能够取悦人心，在功能上还能准确有效的传播信息。因此只有兼备外在形式美与内在功能性的网页才能称之为美的网页设计。
二、网页设计面临的问题
通过实践与教学在具体网页设计过程中经常遇到的问题大体可以分成两大类：
（一）视觉引导性弱。造成这样问题的主要原因是页面内容的失控，没有分清主次，想要传递的内容太多太庞杂，没有处理好信息之间的关系从而造成了大量文字、图片等构成元素的堆积，而忽略了整体条理性。同时没有设计章法与秩序对它们进行约束，导致页面的布局的混乱，从而影响浏览者的阅读。
（二）设计细节。第一种是只顾及内心感受，只凭自己的感觉设计，缺少理性思考，没有细节处理。无论是图片质量、字号字体还是颜色搭配，处处都能体现出网页设计的细节问题。第二种，过于在乎细节，将细节当成主要设计元素尽享处理，喧宾夺主，忽视了基本功能，这些过多的细节装饰打破了页面整体布局的统一性。
在网页设计中，大部分设计人员只重视表达网页的表面视觉效果，而忽略设计支撑网页的骨骼框架，才使得现如今很多网页在设计上出现以上问题。
三、栅格设计
15世纪法国的数学家尼古拉斯加宗成功将几何网格与字体设计相结合，这就是栅格设计的雏形。之后人们将这中设计方法运用到平面设计中，直到现在栅格设计在平面设计中仍是一种非常普遍的设计方法，而网页的栅格是从平面栅格系统中发展而来。
在日常生活中我们看的书籍、杂志、报纸，很容易发现它们的内容被限制在一定的方格内，整个版面具有很强的秩序感，之所以出现这样的视觉效果完全是因为版面设计时运用了栅格设计。栅格设计又称栅格设计系统，它是利用规则单位矩形来规范、约束版面上的内容从而起到规范网页内容的作用，它可以充分的体现出网页设计的结构美。
栅格设计之所以能够被广泛的应用是因为它能够使设计作品呈现出清晰的脉络，简约的结构，同时也能起到突出中心与重点，起到引导视觉的作用。由此可以看出栅格设计能够在网页中起到支持起整个网页页面，可以说是网页页面的骨骼，因此我们将栅格设计也作为网页布局的理论支持。
那么怎样利用栅格设计对网页进行布局呢？栅格设计具有一定的设计方法，大体可以概括为两种：一种是单元格的加减法，另一种是栅格填补法。
（一）单元格加减法。
顾名思义，就是将网页事先做一个大体布局，而后根据具体内容的需要，对单元格进行相应的合并或拆分，从而使网页达到视觉上的和谐。单元格加减法使栅格设计优势得到充分体现，它具有极强的布局灵活性，但是不同的设计元素具有不同的组织方法也不相同。
1、单纯文字加减法，文字的加减的对象是文字与页面空间，它是在栅格的作用下，运用文字对页面进行划分，从而使人们可以轻松的感受到文字的秩序美。栅格的数量不宜过多，过多会使页面元素分散，失去整体感。
对文字的编排，应该考虑视觉流程的设定。文字的字号行距设置要适中，，同时文字的排列长度不易太宽，以方便阅读为准。
2、单纯图片加减法，他是根据栅格进行操作，可以是单张的加减，可以是多张的加减。但要切记图片不要太多太杂，风格色调要统一，还要把握全局，突出核心信息。
3、文字与图片加减法，当文字与图片共同存在于页面中时，要根据需要有所侧重，视觉流动性要强，思路要清晰。文字与图片的搭配要统一协调。另外在图片的选材上，图片质量好的图片在网页设计能够提升网页的审美性。
（二）栅格填补法
栅格填补法就是将我们设定好的栅格固定不变，将所需要的内容机械的填充到对单元格空白区域。这种方法的优点就是能够直截了当的传递信息，主题更直接更明了；缺点是无论是文字还是图片都不宜过于复杂，以简约为主。
栅格设计在网页中应用的很灵活，在具体网页设计时还要根据具体情况制定栅格设计的方案，只有这样才能使栅格设计的灵活性得到完美的发挥。
栅格设计是网页设计的灵魂，是网页设计结构美的核心所在，栅格的好坏直接决定了网页的优劣，那么如何才能设计出一些审美性高与设计感强的栅格呢？
在艺术史上，埃舍尔的画可以用数字计算，巴赫的曲子可以用数学公式推导，还有柯布西耶的设计理念，也融合了几何学的创新理念，可以说数字创造了艺术的奇迹。诺瓦利斯曾说过 “数字是最高的艺术形式” 当设计运用到数字或是数学的时候，设计的严谨性与逻辑性就随之出现。栅格设计中比较典型的分割方法是黄金分割与根号矩形，两者在栅格布局中被普遍认为是比较美的比例。
1、自然界中的事物符合1：1.618的为都属于黄金分割比。黄金分割比是被公认为是最和谐，最完美的比例。黄金分割比合理的运用到栅格设计中能够构建出比较美的网页结构框架。
2、根号矩形是比较特殊的矩形，拿矩形来讲它可以被分成无限个等比的小矩形，可以产生大量的分割组合，因此根号矩形被应用的比较多。在网页设计时可以格局矩形的分割比进行相应的栅格设计。
以上图例是对黄金分割与根号矩形两种栅格样式的具体表现形式，实际上栅格设计的变化相当丰富，在具体网页设计中我们可以根据以上的两种样式为变化基础，对栅格设计进行相应变化设计。在网页设计中合理的运用栅格设计能够衬托出网页设计的结构美。
“设计体现在细节上”在网页设计中，细节的设计相当重要， 通常1像素的线，1磅的行距，1点的字号这些都是设计时需要注意的细节，都能衬托出网页设计的美。当细节被注意后，网页设计失误就会越小，页面就会更精致。
关键词：网页设计；互联网络；信息传播；平面设计教学
每一个时代都有代表性的发明作为这个时代的象征，像第一次工业革命，蒸汽机的发明，使得那时成为蒸汽时代；爱迪生发明了电灯从那时起进入了电的时代，要说21世纪，我想应该是网络的时代，自从互联网的出现使“地球村”的概念更加贴切，可以说网络拉近了地球上每一个角落的人。互联网代表着一种崭新的信息交流方式，它使信息的传播突破了传统的政治、经济、地域及文化的阻隔，使信息传达的范围、速度与效率都产生了质的飞跃。互联网是由成千上万的网站组成，而每个网站都是由诸多网页构成，故网页是构成互联网的基本元素。而网页设计是伴随着计算机互联网络的产生而形成的平面设计新课题，是网页设计者以所处时代所能获取的技术和艺术经验为基础，依照设计目的和要求自觉地对网页的构成元素进行艺术规划的创造性思维活动，必然要成为设计艺术的重要组成部分，并随着网络技术的发展而发展。表面上看，它不过是关于网页版式编排的技巧与方法，而实际上，它不仅是一种技能，更是艺术与技术的高度统一。设计师如何将网络与设计、技术与艺术完美地结合，是非常值得我们深思和研讨的。
一、一骑红尘妃子笑，谁人知是荔枝来之信息传播
信息元素可以说是网络最基本的元素，互联网自始至终都起着一个信息传播的做用，也是由此而产生的。自从人类诞生以来，人类社会至少已经经历了四次意义重大的信息传播革命，每一次信息传播革命都把人类文明推向一个新的发展阶段。第一次信息传播革命是语言传播的诞生。第二次信息传播革命是文字传播的诞生。第三次信息传播革命是印刷传播的诞生。第四次信息传播革命是模拟式电子传播的诞生。
最新的一次信息传播革命，即正在我们身边发生的第五次信息传播革命，是数字式电子——网络传播的诞生。网络媒体的出现，使得传播者与受众之间的传统的相互关系正面临巨大的变化。人类进入了真正的信息时代。
网页设计以信息传达为目的，而传达的最终表现界面则永远也脱离不了媒体。媒体与网页设计之间的关系是互动的，媒体既体现了设计，又给设计带来了局限性；设计既受制于媒体，又是新媒体产生的动力之一。
我们大家所共知的传媒方式有报纸、广播、杂志、电视等等，这些在现代媒体中仍然占主要位置。如果与互联系网络比较的话，它们这些传媒方式就显的相当单一。因此它们的先天缺陷也越来越明显，所以像这种单一的传达方式也使设计师受到了一定程度上的限制。人们接受信息的途径是多方面的。像视觉、听觉、触觉、嗅觉、味觉等一系列感官的综合使我们更加全面的去了解其他的事物。为了能使信息传达的更全面一些，一直在追求完美的设计师也在寻找着一个崭新的媒体来表达完善的设计。因此当今互联网络顺利的成为新生的、综合感官的、充满活力的新媒体，也为设计师创造了前所未有的信息传达手段与途径。而且随着技术的不断发展，它极有可能成为最完善的媒体。这应该引起每一个平面设计师的关注。网络的发展速度和力量是惊人的。
二、横看成岭侧成峰之视觉效果
可以说网页是通过视觉元素来进行信息传达的，这里说的视觉元素包括文本、背景、按钮、图标、图像、表格、颜色、导航工具、背景音乐、动态影像等。无论是文字、图形、动画，还是视频，为了使网页获得最大的视觉传达功能，网页设计者所要考虑的是如何适应人们视觉流向的心理和生理的特点把它们放进页面这个“大展示窗口”里。由此确定各种视觉构成元素之间的关系和秩序。因此，设计时应该研究各种视觉造型元素之间的距离、位置、面积和视觉流程的问题。
从理论说起，视觉流程的形成是由人类的视觉特性所决定的。因为人眼独特的结构，造成只能产生一个焦点，而不能同时把视线停留在两处或两处以上的地方。这样就使得人们在阅读一种信息时，视觉总有一种自然的流动习惯，先看什么，后看什么，再看什么。视觉流程往往会体现出比较明显的方向感，它无形中形成一种脉络，似乎有一条线、一股气贯穿其中，使整个版面的运动趋势有一个主旋律。心理学的研究表明，在一个平面上，上半部让人轻松和自在，下半部则让人稳定和压抑。同样，平面的左半部让人轻松和自在，右半部让人稳定和压抑。所以平面的视觉影响力上方强于下方，左侧强于右侧。这样平面的上部和中上部被称为“最佳视域”，也就是最优选的地方。
所以在网页设计中，重要的信息和标题栏通常在这个位置出现。只要遵循视觉流程和符合人们认识过程的心理顺序和思维发展的逻辑顺序就可以更为灵活的运用。在网页设计中，灵活而合理地运用视觉流程和最佳视域，组织好自然流畅的视觉导向，直接影响到传播者传达信息的准确与有效性。
三、进化、发展之必要
网页设计这门学科是一门后期新兴的设计类与网络方面交叉的学科，在最近的几年也随着网络的发展越来越受人们的重视，它是以网络为载体，把各种各样不同的信息以最快捷与最方便的模式传达给每一位与之相关的人员，但是单单这种标准是不够的，人们也对在观看各类信息的同时逐步产生了视视美观的需求。然而每个人对美的追求是不尽相同的，网页设计也是同样的。因为要求了网页不光是把各类信息与事物放上去能看就行，这些对现在的人们已经是远远不够的了，这时设计师就要考虑如何使受众能更好更有效率的接收到网页上的信息。这方面就需要从审美入手了，如何制作出清晰、整体性效果好的页面。使人们浏览起来更方面，心情更舒畅，制作出清晰、整体性好的页面。使人浏览起来心情愉快，接收信息也会更加容易。网页设计的审美需求是对平面设计美学的一种继承和延伸。
我们经常所说的如变化和统一、条理与反复、对比和调和、均齐与平衡等，对网页中文字、图形、色彩的设计都是十分有效的视觉规律。首先，网页的内容与形式的表现必须统一和具有秩序，形式表现必须服从内容要求，网页上的各种构成要素之间的视觉流程，能自然而有序地达到信息诉求的重点位置。在我们把大量的信息塞到网页上去的时候，考虑怎样把它们以合理统一的方式来排布，使整体感加强同时又有变化。怎样使它们脉络清楚又富有清晰的视觉效果等等。这样使页面更丰富，更有生气，看起来就不感到枯燥。其次，突出主题要素，必须在众多构成要素中突出一个清楚的主体，它应尽可能地成为阅读时视线流动的起点。如果没有这个主体要素，浏览者的视线将会无所适从，或者导致视线流动偏离设计的初衷。
四、千里之行始于足下之构成效果
文字作为信息传达的主要手段目前也是网页设计的主体，文字是网页中必不可少的元素，也是网页中的主要信息描述要素，所以网页中文字将占据相当大的面积，文字表现的好与坏将影响到整个网页的质量。网页文字的主要功能是传达各种信息，而要达到这种传达的有效性，必须考虑文字编辑的整体效果，能给人以清晰的视觉印象，避免页面繁杂零乱，减去不必要的装饰变化，使人易认、易懂、易读。不能为造型而编辑，忘记了文字本身是传达内容和表达信息的主题。
网页文字编排与设计，重要的一点在于要服从信息内容的性质及特点的要求，其风格要与内容特性相吻合，而不是相脱离，更不能相互冲突。如政府网页其文字具有庄重和规范的特质，字体造型规整而有序，简洁而大方；休闲旅游类内容网页，文字编辑应具有欢快轻盈的风格，字体生动活泼，跳跃明快，有鲜明的节奏感，给人以生机盎然的感受；有关历史文化教育方面的网页，字体编辑可具有一种苍劲古朴的意蕴、端庄典雅的风范或优美清新的格调；公司网页可根据行业性质、企业理念或产品特点，追求某种富于活力的字体编排与设计；个人主页则可结合个人的性格特点及追求，别出心裁，给人一种强烈独特印象。
在网页文字的编排与设计中，由于计算机给我们提供了大量可供选择的字体，导致字体的变化趋于多样化这既为网页编辑提供了方便，同时也对编排与设计的选择能力提出了考验。虽然可供选择的字体很多，但在同一网页上，使用几种字体尚需精心编辑和考虑。一般来讲，同一页面上使用的字体种类最多只能有三四种。由于文本字体的显示是需要本地硬盘字体文件的支持的，所以在互联网上使用过多的字体是没有意义的。文字在视觉传达中作为页面的形象要素之一，除了表意以外，还具有传达感情的功能，因而必须具有视觉上的美感，能给人以美好印象，获得良好的心理反应。
图片是文字以外最早引入到网络中的多媒体对象。网络可以图文并茂地向用户提供信息，成倍地加大了它所提供的信息量。而且图片的引入也大大美化了网络页面。可以说，要使网页在纯文本基础上变得更有趣味，最为简捷省力的办法就是使用图片。对于一条信息来说，图片对受众吸引也远远超过单纯的文字。
图片的位置、面积、数量、形式、方向等直接关系到网页的视觉传达。在图片的选择和优化的同时，应考虑图片在整体编辑计划中的作用，达到和谐整齐。要达到这样的效果，在页面图片的合理选用时，一要注意统一，二要注意悦目，三要注意突出重点，特别是在处理和相关文字编排在一起的图片时。
网页在一定意义上说也是一种艺术品，因为它既要求文字的优美流畅，又要求页面的新颖、整洁，使用色彩可以产生强烈的视觉效果，使页面更加生动。而且，浏览者在洲览网页时，留下的第一印象就是页面的色彩设计，它的好坏直接影响阅读者的观赏兴趣。因此，色彩设计在网页设计中居于十分重要的地位。网页的色彩设计应把握以下几个方面。
首先是整个页面的色彩选择，确定一个主色调，可以有利于体现网站主题。我们现在看到的网页，一般以浅颜色为背景的居多，如浅灰色、浅黄色、浅蓝色、浅绿色。以浅颜色为底，柔和、素淡，配上深颜色的字，如黑色，读来自然、流畅，也有利于突出页面的重点，有利于整个页面的配色，更容易为大多数人认可和掌握。其他一些次要内容，如背景图片、线条适宜采用不抢眼的颜色，以免喧宾夺主。只有少量精心选择的元素，为了突出强调的需要，才采用明亮的色彩，这些彩色亮点就会产生强烈的视觉冲击，但如果用得太多了，就会形成一种均匀的噪声，而达不到强调的效果。
其次，在背景的色调搭配上一定要注意不能有强烈的对比，特别是同时使用色彩对立的颜色。大面积颜色适宜采用低比度，因为过于丰富的背景色彩会影响前景图片和文字的取色，严重时会使文字溶于背景中，不易辨识。所以，背景一般应以单纯为宜。如果需要一定的变化以增加背景的厚度，也应是在尽量统一的前提下的一种变化。例如在制用标题时，为追求醒目的视觉效果，可用比较深的颜色，配上对比鲜明的字体。实际上背景的作用主要在于统一整个网页的风格和情调，对视觉的主体起到一定的衬托和协调作用，一方面吸引网民的注意力，另一方面有助于体现网站的主题。
五、技术、设计之两手都
网络技术与设计创意的紧密结合，使网页的设计由平面设计扩展到立体设计，由纯粹的视觉艺术扩展到空间听觉艺术，网页效果不再近似于书籍或报刊杂志等印刷媒体，而更接近干电影或电视的观赏效果。技术发展促进了技术与设计的紧密结合，把浏览者带入一个真正现实中的虚拟世界。技术与设计的紧密结合在网页艺术设计中体现得尤为突出。wWw.gWyoO
个用来展现自己的网站作为平台，其中插画也在各类网页设计中被频繁使用。不同类型的网站受众面不同，门户网站中的用户量大，面对大量的用户需要满足不同的审美需求，网页设计中的插画也需要满足大众的审美。
插画在网页设计中的作用
1.插画在网页设计中的效果
插画在网页环境中的运用必须要与传统媒介的运用有所区分，为了突出主题和满足人们的需求，这就要求插画设计在强调艺术性的同时，更应该注重通过独特的风格和强烈的视觉冲击力，让受众在审美的过程中接受和处理所传达的信息。这就是网页设计中插画与独立插画的大区别，优秀的网页设计插画是能更好的表现诉求的插画，而不一定是从艺术性角度最好的插画。
2.插画带来的用户体验价值
网站都在讲究用户体验，最重要的是体现在页面的设计和表达上，给用户的第印象也往往是从视觉开始。插画作为一种艺术的形式可以给网站建设以视觉上的填补，利用其特性改变网站的形象，给网站增添感染力。例如谷歌，从1998年开始尝试插画运用到主页logo上，自此以后利用插画来装饰谷歌Logo变成一项传统，重大纪念日、小游戏以及音乐元素都被融进谷歌的涂鸦中（如图1），这种插画元素的融入不仅仅受到用户的喜爱，还使自己的员工感受到公司对各种创新、创造的支持和鼓励，他们因此在这样的氛围中便能更加积极而无所顾忌地贡献他们的创造和想法。这一切的最终受益者还是谷歌，它因而得以这么多年来都保有源源不竭的创新能力，成为全球最领先的互联网公司。
插画在网页设计中的运用
1.插画使用在网页设计中的表达方式
插画在整个网页设计中的运用应该和导航系统联合起来共同引导浏览老的视觉流程，因此插画的艺术性在于确保整个网页的个性化和整体性。设计师需要让浏览者在最短的时间内接受到信息与美感的双重体验，满足人们的实用和需求。通过塑造可视的形象来表现社会生活和设计师情感的艺术形式。生动的视觉艺术能够唤起浏览者的审美情绪，从而符合他们获取信息的心理需求和审美体验上的满足。
2.不同类型的网页设计中插画的使用
插画在企业网站中的运用对于企业类型的网站来说，主要诉求便是以用户为中心让网站既美观又实用，提高企业形象，是种以网站的用户体验为导向的设计。网站通过设计师的艺术化渲染，让浏览者对企业产生好感度，从而激发浏览者的点击冲动。企业类型的网站把插画与网页设计融为一体，转化为生动、精彩的网页视觉形象，唤起人们对网络视觉艺术的追求与热爱。这种对于网站的喜欢最终会转化成为点击率再转化为购买率，为企业获得收益。通常这类网页设计中插画是使用是比较小面积的，起到画龙点睛的作用，例如美团外卖的网页设计（如图2）插画更加让本来呆板的网页按钮和分类设置，都变得卡通可爱。现代插画元素在网站中的除了能将信息简洁清晰的传递给用户之外，能够透过插画看到更深层次的网站内涵，通过欣赏插画从而带用户走进网站主题，引起对网站的关注。
插画在个人网站或小众风格网站中的应用对于个人网站或者小众风格的网站来说，插画风格成了网页设计中不可替代的艺术形式，在设计的表现上显示出独特的艺术魅力，利用插画表达自身独特的想法用来体现与众不同，从而在各种网站中脱颖而出。这种类型的网页需要大量的插画来形成风格，插画在网页设计中成为主体，插画中独特的亲切、活波、个性、旋目的感觉展现出网页设计的多样性，插画中个性化的表现技巧贯穿网页设计中，使得页面免于平庸，给浏览者带来别出心裁、强烈奇特的多元化视觉印象。
插画在移动端网页设计中的应用。由于移动端设备具有屏幕较小，使用场景多样这种特性，插画在移动端的运用和上面两个类别有着很大的不同。不像web端样喜欢图文混排，移动端的图和文字内容的界限比较分明，插画的形式主要有app启动界面和banner两种，其中启动界面占很大的比重。启动页面多以纯插画的形式表现，在单个的页面当中信息不会过多，表现个突出的主题即可，视觉形式上也会聚焦在个主题上。这类插画通常用来表现营销文字的内容，有的插画内容是卡通化的应用使用场景，还有的没有具体的活动内容，只是用插画来体现应用的产品形象和氛围，用插画形式展示自己的态度。当然还有类重要的类型节日插画，每逢节日或者热点各个应用软件搜索引擎都会有节日相关插画出现，这种插画可以大大提升企业的文化氛围和形象。
关键词： 《网页设计与制作》 教学研究 教学探索
一、教学现状
1.课程特点。
学生在先修课程的基础上，具备一定的网页效果图制作的能力，然后通过《网页设计与制作》这门课的学习，按照效果图可制作出网页。《网页设计与制作》的综合性很强，不仅要求学生有一定的插画、动画制作，以及配色、审美的功底，还要求学生具有较强的实践动手能力和代码编写能力。
2.学生特点。
《网页设计与制作》是针对高职高专软件技术专业、网站建设与维护专业的学生所开设的，这两个专业学生共同的特点：一是普遍没有美术功底；二是学生英文基础薄弱、自律性较差、综合素质有很大的差异性、计算机的熟练水平参差不齐。当面对设计的网页效果图要求美观时，学生因为美术功底的缺失，往往达不到要求；当面对对英文基础有一定要求的网页中代码编写内容的学习时，部分学生会有力不从心的感觉，从而导致学习兴趣的丧失。
3.教师特点。
“名师出高徒”，要教出实践能力强的学生，教师自身的实践能力就要强。但现状不容乐观，任教《网页设计与制作》的专职教师在相关企业实践过，且具有一定实践经验的所占的比例并不大，而这门课程本身对实践操作能力的要求就很高，于是产生了矛盾。虽然有行业兼职教师来校教授该门课程，但因为这门课不是一蹴而就，而是要通过循序渐进的学习才能学好的，行业兼职教师所任课的时间稍显不足。
4.教学方法。
高职教育注重学生实践动手能力的培养，且《网页设计与制作》这门课程对学生的动手能力要求很高。传统教学采取“理论+实践”的形式，理论指的是在多媒体教室中，教师以讲授和演示的方式，把实践所涉及的理论知识传授给学生，学生以听和记笔记为主；实践指的是学生在过后安排的上机课中予以实践，但理论和实践往往没有实现无缝对接。
二、教学探索
1.在实践中提高高职高专专职教师的动手能力。
针对提高专职教师的实践动手能力，提出“实践”这个解决方法。第一，与各大公司企业加强校企合作，在专职教师休假时间，特别是在寒暑假这种假期比较长的时间里派教师下企业锻炼，体验企业具体所需技能及学习新的技术；第二，定期组织行业专家来校对专职教师进行交流和指导，实现教师下企业锻炼和在校接受培训双保险。
2.改进教学模式，引入CDIO教学模式。
高职教育注重对学生实践能力的培养，改善教学模式对学生实践能力的培养显得尤为重要。CDIO是由MIT等世界著名高校研发的一整套先进的工程教育模式，C（conceive）指的是“构思”，D（design）指的是“设计”，I（implement）指的是“实施”，O（operate）指的是“项目分析和展示阶段”，该模式可应用到《网页设计与制作》这门课的教学中。
（1）“教”在CDIO教学模式中的体现。教师可借鉴该教学模式，不再按课本上的具体章节讲解，而是将一整个网页制作项目具体，从如何“构思”到如何“设计”，再到如何“实施”，完成后“展示”给学生欣赏。也可理解为教师引入项目引导式的教学方法，对该项目进行分阶段拆分，通过完成具体的项目、逐步带领学生掌握网页设计与制作的各种方法。
（2）“学”在CDIO教学模式中的体现。该模式要求《网页设计与制作》这门课程有三方面的目标，即知识目标、能力目标和素质目标。为了实现这门课程的课程目标，要求学生在学习网页设计基本知识的基础上自愿分组，每小组确定一个网页的主题，完成至少一个完整的项目。该项目要求包括表格布局、框架布局、div+CSS布局三种布局方式，以及CSS美化和JavaScript特效一整套，按照CDIO的流程，从构思（具体需求）、设计、实施改进及展示本团队设计开发的项目对学生进行训练。学生在学习任务的驱动下，能自发地利用课后时间搜集资料学习和实践，弥补课程教学时间的有限性和教学范围的局限性的不足。同时按照这个流程走下来，学生的团队合作精神也得到锻炼。在项目的实施过程中，学生难免会碰到各种难题，这就锻炼了学生解决问题的能力。
3.加大实训项目在期末考核中的比重。
传统考核模式采取平时成绩30%+期末理论考试70%的比重，现在则提高实训项目在期末考核中的比重，本着理论够用、注重实践的原则，考核形式采取平时成绩20%+期末理论考试40%+学生实训项目占40%这一考核方式，凸显理论的不可或缺性和实践的重要性。
综上所述，在《网页设计与制作》课程教学中，要注意丰厚学生理论储备，提高所需技能和素质，为学生的可持续发展打下坚实的基础。
参考文献：
[1]蒋秀姣.CDIO环境下网页设计课程教改探讨[J].广西教育C（职业与高等教育版），2012（10）.
[2]王刚.CDIO工程教育模式的解读与思考[J].中国高教研究，2009（5）.
Flash网页设计“总分总”的教学模式
在软件基础和线性动画（Flash广告设计）的基础上，进入到课程的主体模块，即Flash网页设计。与HTML静态网页的分页面结构不同，Flash网页设计在集成设计开发环境内（Flash软件和Action脚本）实现网页内容与非线性结构的编排，模块化特性明显。为此，笔者尝试采用“基本结构设计—模块分解设计、网站整合”三步走的教学法，可概括为“总—分—总”教学流程，合理调配教学难点和重点，循序渐进，在实践中取得了一定的效果。（一）基本结构设计首先，从网页基本结构入手，利用按钮对时间线上各帧的控制构造网站模型，其中包含了最基本的场景转换。在学习的后期，可以针对每帧对应的画布进行深入设计，包括内容扩展和淡入、淡出动画效果的实现等。基本结构设计涉及每帧对应的画布设计、按钮设计、元件和实例的进一步应用以及补间动画等内容，还涉及一些基础的Action脚本内容，如“stop”“gotoAndStop”“gotoAndPlay”命令以及帧标记的参数调用等，适合入门学习。在脚本程序编写的最初阶段，重点要使学生理解脚本语言代替人进行指令操作的特性，如“去哪”“做什么”等，利用这种指向性的形象思维逐渐强化学生的编程思维。一般来说，静态网页设计课程教学不会将Java脚本作为重点，在这种情况下，这一阶段的Action脚本学习就更加重要。（二）具体模块学习由于Flash网页多在屏幕的显示面内不翻屏，高度有限，这就需要使用软件功能和脚本程序创造更多的结构层次去容纳网页内容。除了场景的转换外，在每个场景之中，还要借助于不同类型的页面组件来实现额外的结构层次。针对种类较多的页面组件，可以实施“分解教学”，即抛开网站设计的整体性，单纯提炼每个组件的设计与编程要点，使每节课都可以完成一种组件设计，实现相关功能。笔者选择的页面组件包括按钮组（菜单）、弹出框、下拉菜单、声音控制模块和预加载器等。在设计层面，要考虑到各组件与网页整体风格的一致性；在内容层面，要合理地选择组件类型，丰富内容层次，便于用户访问，形成良好的互动性。而在Action脚本编写方面，要以典型程序、核心程序为主，逐步增加更多的样式变化。实际上，虽然组件类型不同，其背后的程序控制大多有着一定的内在联系，如很多组件都会用到onEnterFrame频率控制函数。随着教学的不断深入，要尽量将脚本教学系统化，将松散的知识点整合起来，尽量覆盖到常用的函数、方法和命令。（三）网站内容搭建经过不同组件的分解学习，接着补充几种场景转换的方法，结合不同设计项目中对组件的选择，Flash网站就可以搭建起来。至此，Flash网页设计的技术性教学目标就基本完成了。在技术性教学目标之外，在课程的收官阶段，要融入行业设计理念，以提高结课作业的质量，保证教学效果。在HTML静态网页设计教学阶段，笔者针对结课作业挑选了“实用设计”这一特定行业分类进行教学强化，避免学生在结课阶段设计得没有针对性，学无所用。
静态网页的有效补充
如果分析“静态网页”的内涵和外延，可以看到，在基于HTML网页设计之外，只要立足于本地，与服务器没有数据交互的网页设计都可以统称为“静态网页”。从这个角度来看，艺术设计专业中的Flash网页设计课程也基本上以静态网页为主。在Web2.0时代，交互性的社交网络已经发展得比较成熟，使每个独立域名的网站不再是用户交互的首选。在这种形势下，静态网页设计要“扬长避短”，不拘泥于本身用户交互行为的弱点，以设计为主，反而有自己的一席之地。在教学中，要鼓励学生在参与网络互动之余，尽量发挥自身设计优势，具备独立完成内容展示型网站的能力。经过相关调整，Flash网页设计课程具备了循序渐进、由浅入深的教学层次，直至课程结尾处，着眼于设计之“道”的有目的训练，使整个网页设计课程体系具备了从基础知识到综合设计提升的完备性，并与其他课程有机结合，最大限度实现了课程的自身价值，为该课程的序列化、标准化建设积累了一定经验。
作者：刘立伟 杜美易
