前言:一篇好文章的诞生,需要你不断地搜集资料、整理思路,本站小编为你收集了丰富的网页设计论文主题范文,仅供参考,欢迎阅读并收藏。
一、网站整体规划,要做网页的第一步便是做网站的整体规划这主要包括四个方面的内容。
1.讨论网站的主题。
网站整体规划是做网页的第一步也是制作网页最关键的一步它决定了你要表答的信息,因此我选择了我选择我最喜爱的服饰来为它做网页。在平时我也对服装的网页比较关心,无论是淘宝网上的衣店还是各种品牌装。这次我是为“易菲”服饰做的网页。
2.定位网站的CI形象。“易菲”植根中国文化之精髓,汲取自然禀赋之灵性,形成一个既有浓厚文化底蕴,又有现代自然人文气息的特色品牌。“易”即是容,是包容,是宽容,是五千年中华民族的文化精髓,是厚德载物,是对人性宽度的一种拓展。“菲”通非,是生机、是个性、是春意盎然、是自强不息,是对人性深度的一种挖掘。“生活如花,自在快乐”是YIFINI易菲的设计理念,倡导一种与自然和谐相处,如花儿绽放般美好舒适、自在快乐的生活方式。这也便是我网站的CI形象。
3.确定栏目和板块。
于时间的关系在本次我准备做四张网页:一张主页三张二级页面。分别设计了“时尚首页、时尚衣秀、推荐产品、潮流信息”等四个栏目。在这四张页面中我打算都用淡蓝色做背景颜色来映衬我网页的主打色绿色。
2.网站的整体风格和创意。
整个网站的创意就在于颜色的搭配,与各种图片的搭配,它们相互辉映,相互衬托。以便达到表现其品牌的和谐之美、自然之美。我踩用淡蓝色和绿色为我网站的主打色主要是因为我的产品特性。在设计上,YIEINI易菲推崇“自然美”,将带表女性气质的花卉和自然元素融入设计之中,充分体现设计师和顾客所追求的一种洒脱、舒适的生活氛围,力求表现悠闲、舒畅、自然的生活情趣。因此我用天空与自然的颜色来表达这张自然之美、和谐之美。
二、网页制作的前期策划与准备,在本阶级主要有两方面的工作。
1.资料的搜集。
在做网页我上网收集了许多方面的资料主要是有关网站的布局与服饰品牌方面的资料,我首先进它的企业网站找了一些关于“易菲”服饰的图片主要是一些代言形象还有代表其企业形象的图片。其次我去浏览了许多的网页观察其网页的布局、颜色搭配、栏目、板块等方面的内容,同时也搜集了一些对我有用的资料。在搜索资料最困难的便是动态图片的搜集,动态图片其gif格式的还是好保存,但是要搜集flash动态图片就相对较难了。我用了一天的时间来搜集我的flash都不太成功,不过还搜到了可以换自己图片的代码。在开始时我根本就不知道flash是怎样搜索,不过经过三次像老实询问我终于懂得一些关于代码的搜索。在搜集资料的过程之中我发现了自己的许多不足之处,最关键就是平时对知识的掌握不够,连最基本的资料搜寻都觉得困难。也是我平时不够认真和努力的表现。通过这次的教训在以后我一定会做得更好,争取不范类似错误。
2.熟悉制作软件。
做网页主要用的工具便是Dremweaver、Photoshop、Flash软件。在这些软件我对Dremweaver、Photoshop相对比较熟悉,因为在平时上课是老师带领我们运用过。所以我还可以正常的运用,但是出现的问题还是有很多。有很多不懂如何操作,只有通过在次去看书才能够了解,这也体现了我学习方面的缺点,它是我平时不够认真的具体表现。
三、网页制作,这便进入我该次的主题了具体制作流程如下。
1.构建站点框架。
在我打开Dremweaver后第一步便是新建站点,我把我的站点建立在F\仪下面。并将我搜集的全部资料都保存在其文件夹中,以便网页制作时可以方便的使用。
2.设计主页及二级页面。
在主页我设首页制作时,时刻考虑着网页的基本原则:统一,连贯,分割,对比及和谐的原则,内容统一,都是为了主题服务,美容美体,一个网站强调的就是一个整体,只有围绕一个统一的目标所做的设计才是成功的;连贯,页面之间关系连贯,统成一体;每版内容都自成一体,颜色各异,便于浏览;整个网页有动有静,色彩呼应,搭配协调,不呆板,富有生气;颜色各异,但又不同之中又相同,浑然一体。而且制作过程中,不忘以下原则:
简洁实用:这是非常重要的,网络特殊环境下,尽量以最高效率的方式将用户所要想得到的信息传送给他就是最好的,所以要去掉所有的冗余的东西。使用方便:同第一个是相一致的,满足使用者的要求,网页做得越适合使用,就越显示出其功能美;页面用色协调,布局符合形式美的要求:布局有条理,充分利用美的形式,是网页富有可欣赏性,提高档次。当然雅俗共赏是人人都追求的。
交互式强:发挥网络的优势,是每个使用者都参与到其中来,这样的设计才能算成功的设计。这样的网页才算真正的美的设计。每个子页都设有上导航栏,便于浏览和跳转。3个二级网页制作时,使用的是表格,每一个页面都用表格为它布局好,然后在插入图片文字及其他,这样有一定的规划性,体现了连贯统一性,不同的内容根据各自的特色建立了不同的表格,突出各自的主题,增强了对比性。在做这些网页的时候我就进行了如上所述的方法。但我所以网页的背景颜色及主题颜色都是相同的以便突出我每一个网页都是为凸显我主题而服务。
3.实现网页间的链接。
我的链接按钮主要有四个“时尚首页、时尚衣秀、推荐产品、潮流信息”它分别链接到我所做的四个网页。链接的过程其实很简单,主要是把要链接的文字选择在选择工具栏的链接按钮最后选择自己要链接的网页单击确定便可以了。
4.向静太网页插入动态效果。
在这一阶段我遇到了许多的问题,主要是我在主页插入我的flash的时候,开是我将带码粘贴到我的网页上可是在浏览网页的时候flash却不能够显示。最后我向老师的请教后终于在老师的帮助下我成功的在我的主页插入了flash。而在其它的二级网页我主页插入的是一些gif格式的动态图片。
(1)影音。
科技的发展,使视觉这门艺术不再仅仅局限于二维空间的发展,动画、视频等网页设计元素的运用,极大地丰富了网页的信息内容,这些元素成为网页设计中最生动、最活跃的因素,给受众带来试听方面的双重享受。动听的音乐,服饰的动态展示,给受众带来愉悦感的同时,像一种调剂一样平衡了视觉和心理上的感受,同时还留给了受众对服饰想象空间的延伸。在服饰网页设计中,通常用Flas的方式来展示服饰产品。当然,伴随着三维动画的运用,服饰网页的设计将会越来越科学和艺术。动画等视频艺术的运用,能够营造出受众者对服饰的一种情绪,一种感觉与情感。动画方式的服饰展示,不仅使人们的情感得到张扬,而且使人机对话的过程也变得更加生动有趣。其总的设计目标是营造出一种放松的气氛,使人们感到轻松、活泼与休闲,在阅读过程中,使受众者在视觉与心理上获取愉悦,产生消费的热情。
(2)整体色彩感。
网络媒体是一种非常特殊的媒体形式,通过光和色将要传递的信息展现在屏幕上,用于人们交流与沟通。因此,设计出符合人的心理与生理等要求的,合理的色彩搭配就显得尤为重要。在设置色彩的彩度及明度时要特别慎重,受众者的要求以及服饰品牌风格色调的和谐就需要得到综合全面地考虑。可以采用设置背景的方法,一来减少人们由于长时间注视亮背景所引起的神经疲劳以及心理上的厌烦感,二者烘托服饰风格,这样使网页的总体风格超越文字和图形的既定内涵,给受众者勾画出一个完整的审美意境。其次,还可以通过利用和谐的色彩搭配及色彩有规律的变化,营造视觉上的流动感,使受众者在获取信息的同时,也能够得到视觉和精神上的购物享受。
2服饰网页框架布局
网页的框架布局是网站视觉设计研究的重要环节之一,网页设计中把不同的设计要素进行有机整合,主要借助框架结构来完成。这种框架结构相当于普通页面的版式设计。常见的网页布局有层,还有表格定位的方式。在服饰网页设计中,通常两种定位方式同时采用,他们互相取长补短,相得益彰。由于服饰网站的特殊性质,受众浏览网站的目的、阅读信息的方式以及在站内逗留的时间的不同,在策划网页页面的编排创意时,采取“少则多”的设计原则,这样单个页面虽然容纳的信息量较少,但视觉表现力却比较集中。这种设计手法满足了受众者对服饰好奇、探求的欲望,为服饰网站的个性化风格营造了氛围;再者,人机对话的方式诱发了受众的活力与兴趣,增加了网络互动性,这样有利于消费者与设计师之间的沟通与交流。服饰网页页面编排时,还需要结合服装品牌的主题风格与素材,不断调整页面的均衡,在统一中寻求变化,获得秩序感,给受众者创造最佳的视觉效果,最终完成信息的传递。
3结语
1从屏幕采集
最原始的方法是按下键盘上的<PrintScreen>键,将当前屏幕复制到剪贴板上,再通过其他图片处理软件进行加工;也可通过相应的屏幕截取软件工具进行屏幕采集如HyperSnapDX、SnagIt等。
2从网上下载
网络资源异常丰富,在Internet上可供选择的素材很多,可以直接访问网页,从网上搜集我们需要的图片,并通过保存图片或者通过电子邮件、网际快车等形式下载相关的资料素材。
3用扫描仪采集图像
可通过彩色扫描仪将报纸图书等纸质的图片素材进行扫描,把各种印刷品及彩色照片数字化后在计算机中存储起来供使用。
4使用数码相机及数码摄像机采集图像
可使用数码相机和数码摄像机进行图片的拍摄和录取,然后将相关图像信息存储到计算机中进行处理,这应用的非常普遍。
5通过计算机软件进行绘制
可通过各种绘图软件进行绘制。如使用AdobePhotoshop、AdobeIllustrator、Paintor、Coreldraw、Freehand、Flash等。这些工具软件在图形图像的处理方面功能很强大,不但可以很方便的处理图形图像,还可以优化图片的质量,提高网页的下载速度和制作效率。
二图片在网页应用中的处理方法
1退底处理
可以形成生动的边缘效果,使画面更具活力。有时也为了去除图片中繁杂的背景,使图片主体更简洁醒目。
2虚实处理
通过对图片进行虚实处理,也可使主体更突出,增强网页的空间与层次感。同时通过虚实的对比,使画面形成张弛有度的关系,其虚的部分可激发人们的想象力,有助于产生联想。
3影调处理
通过各种图形图像处理软件,对图片的色度、饱和度、明度、纯度等进行调整,可以制作出各种色调的图片效果,从而大大增强图片的感染力。如将整张图片进行去色处理、产生单一色调效果或突出某一主要色调等
4质感处理
通过对图片的质感处理,可以激发人们的联想与情感投入。如粗糙的表面效果,可以带给人们的质朴的感受;对图片进行残缺处理和作旧处理,可以带来一种沧桑感等。利用Photoshop图层和滤镜等相关功能,可以制作出不同质感的图像效果。
5局部与特写
有时为了突出某一特定部位,或获得某种特别的视角,需要对图片的局部进行特写处理,通过对图片的重新剪裁而获得一种特别的视觉感受。
6综合处理
在很多时候,为了某种表现效果,需将各种方式综合利用,以达到设计的目的。例如,对图片进行重新分割与组合、混合等。
三结束语
1、传统网页设计教学中存在的问题
众所周知,计算机网页设计课程具有很强的综合性和操作性等特点,若想制作效果良好的网页,需要具备文字版面处理、动画制作及图像处理等相关知识。设计计算机网页时,通常使用Flash、Firework和Dreamweaver三种网页设计软件。现阶段,很多技术学校依然采用传统的网页设计教学模式,即利用实践和理论的方式组织教学过程,具体地说,按照教学大纲要求,有针对性的对学生实施章节教学,若知识点不同,则会分两次进行理论和实验教学,这就导致学生无法灵活运用所学知识,一味的照搬课本内容,不会融会贯通和相互联系,以致无法培养学生的创新意识及能力。传统教学模式虽然同样重视实践教学,而其实际教学效果常常达不到预期目标,这主要是因为学生在熟练掌握网页制作技术及技巧的情况下,未能有效掌控网站、图片制作和内容排版编排的规划和布局造成的。
2、案例教学模式的内涵
所谓的案例教学模式,是指学生熟练掌握基础部分相关知识辨别、知识分析及知识理解的前提下,教师精心设计教学案例,进而为学生展示课程内容,同时,根据课程大纲和教学目标的教学内容和要求,指引学生通过教学案例的有效运用,分析、讨论相关知识,并以独立思考和团队合作有机结合的方式进行分析,促使学生进一步辨别和分析所学知识,进而提高其解决问题的能力。除此以外,教师还应重视培养学生的协调沟通能力、工作作风以及管理理念。
3、案例教学模式的特点
我们认为,案例教学方式的实施基础是实例,实际的案例教学过程中,教师往往利用形象、生动的教学案例,有效激发学生学习网页设计课程的兴趣,并在网页制作的学习中贯穿教学案例中的相关知识点,进而使学生在学好相关知识的基础上,不断提高自身的问题解决能力。教师在整个案例教学过程中,始终充当着激励者和设计者的重要角色,以促使学生积极参与案例讨论。
二、案例教学的具体实施方法
一般情况下,案例教学的教学方式多种多样、不断变化,因而只有高度重视各教学流程,才能有效实施案例教学,进而达到事半功倍的教学效果。我们认为,案例教学流程包括教学案例的设计、组织学生讨论教学案例、总结和实现教学案例三部分,具体实施过程为:
1、教学案例的设计
通常来讲,有效实施案例教学的前提和基础是设计教学案例,因而教师一定要按照教学规划和教学要求,充分准备授课内容,并讨论教学案例的相关理论和技能,同时还要分析案例教学过程中可能发生的问题。此外,设计教学案例时还应注意:第一,确保教学案例具有较强的实践性,即保证设计的教学案例符合教材及现实案例的相关要求,以便学生更好的理解;第二,确保教学案例具有较强的典型性,也就是说,教学案例可以涵盖大部分课程知识点;第三,确保教学案例具有较强的系统性,具体地说,设计的教学案例之间应具有前后贯穿的关系,并按照由易及难的顺序进行排列;第四,确保教学案例具有较强的针对性,这就要求教师根据学生实际的接收能力选择或设计教学案例。另外,学生还要在分析教学案例的基础上,不断思考和探索其实际应用,并有效、及时的促使教学案例理论知识逐渐转变为实践应用,进而实现理论结合实践的教学目标,同时不断拓宽学生的视野。例如,网页设计教学过程中,教师可让学生根据实际题目设计求职网站,因而学生需要结合网页制作的相关知识,根据实际情况,具体分析相关的求职素材,进而独立设计求职网站,这不仅激发了学生对理论知识的学习兴趣,还提高了其实践动手能力。
2、组织学生讨论教学案例
实际上,组织学生讨论教学案例的目的在于分析分体,进而提出合理、有效的办法和思路。每个学生实现同一教学案例方法以及分析结果各不相同,虽然部分学生能找到容易、简单的实现方法,却无法充分理解;部分学生虽然找到了容易理解的实现方法,其实现过程却非常复杂。所以,教师应有效指导学生果断删除不重要的案例细节,同时寻找教学案例的结构与理论知识之间的联系。此外,讨论教学案例的核心是学生和教师共同努力,进而将教学案例的理论知识和教学内容有机相连,这就要求教师充分发挥引导者的作用,并为学生创造自由、和谐的讨论氛围,同时让学生成为教学案例讨论的主角。一般来讲,案例教学模式着重强调教师教学过程中的交往情境,而学生在这一情境中,也能主动参与到学习及互动交流活动中,进而反复学习。与传统教学模式不同是,案例教学抛弃了教师为主的旧观念,将学生作为教学主体,且不强迫学生进行记忆,只要求其积极思考提出的相关问题,并反复训练,从而达到提高学生解决及分析问题的能力,最终实现培养学生积极动手能力的教育目标。例如,计算机网页设计案例教学中,教师应根据实际教学内容选择合理、有效的教学方式,如介绍网页制作工具时,由于学生对其比较陌生,因而教师可通过讨论案例实施教学活动。
3、总结和实现教学案例
学生结束教学案例讨论后,教师应恰当评价讨论结果,以便去除错误观点。同时,教师还要分析、讲解教学案例分析的相关技巧及知识技能,进而在学生通过计算机进行操作时,根据课堂讨论内容具体实现教学案例,以利于学生牢固掌握相关知识点。
三、案例教学在计算机网页设计教学中的具体应用
1、营造轻松、和谐的学习氛围
计算机网页设计的案例教学中,教师应注重为学生营造活跃、融洽的学习氛围,促使学生在心理上产生安全、自由的感觉,进而激发其敢做、敢说的勇气。此外,教师在计算机网页设计的案例教学中,始终扮演着指导者和组织者的重要角色。所以,学生要独自完成整个案例教学过程,且学生在这一过程中表现出的极大的积极性和主动性,直接影响着教学效果和教学质量。
2、提高教师素质,构建良好的师生关系
若想保证计算机网页设计案例教学顺利进行,需要教师具备知识渊博、经验丰富的特点,这也是教师为学生传递经验和知识的基本条件。因此,教师必须要不断的学习,以便为学生提供丰富的信息。因为只有这样,才能提高教师的影响力和威信,进而提高教学质量和教学效果。除此以外,教师还应全面、多角度的爱护和关心学生,同时融入学生中间,以便更好的感受和体会其内心世界,进而在做好教师的同时,努力成为学生的朋友。
3、建立科学合理的知识体系,选择合适的教学案例
一般来讲,学生学习必备、认识事物和适应环境的基本条件是认知结构,且其学习过程是不断平衡同化和顺应机能的过程,也是不断构建认知结构的过程。因此,教师若在教学过程中引入相关背景知识和展示新知识点,都要密切结合教学大纲。此外,教师选择教学案例时,应保证案例具有较强的针对性,且能充分反映教学大纲中的相关知识点。例如,为网页页面进行布局时,可通过表格、框架和层的方式进行,如为食品网站做简图时:为确定网页的主色调,应将背景图片插在第一层中;为给网页增添活力和生机,可将flas插在第二层中;将精美食品插在第三层中;为体现饮食文化,可在第四层中搭配相关歌曲;为增强网页的立体感,可在第五层中添加浮动物体。此外,教师应先鼓励学生使用表格布局解决相关问题,尔后引出层的内涵,进而逐步解决问题,直至完成学习任务。
四、结语
图形元素的存在大大美化了网页设计,它拥有强烈的艺术美感和视觉冲击力,是文字之后最早被引入到网页设计中的元素,它所传递信息的直观性远胜于文字。图形设计中的色彩搭配、元素构成、版式布局都要符合浏览者的审美心理,才能使得网页在短时间内给受众留下深刻的印象。网页设计中的图片提供导向和链接的功能。根据人机心理学研究,人们的视线在浏览网页时,会首先垂直的落在屏幕中心,然后向四周游动。决定了设计师要将重要的信息安排在注视点高的区域,所以设计师要根据视觉流程来合理安排图片的适度位置。网页设计中的图片是要经过网络下载才可以最后看到,受到宽带的限制,所以要求图形文件量尽可能的小。在图片大小固定的情况下,文件量越低说明图片分辨率要越低。对于显示器上的图片而言,分辨率为72dpi是大多数图片的最佳选择。
二、色彩元素
色彩的配色设计直接影响网站的整体定位、风格。作为设计中不可缺少的元素,它建立在文字图形的基础上,依靠眼睛的功能,通过感觉的视觉冲击力对心理起作用。每一种颜色都有不同的心理暗示。冷色中的蓝色代表平静,暖色中的红色代表激动;黑色给人沉重感,浅色则让物体轻盈;色彩从色调、饱和度、明度三个方面影响着网页,我们可以找到很多运用广泛的色彩配色方案,来作为实际学习和工作中的向导。
网页设计中的色彩元素需要符合国际色彩的标准,因为互联网络是建立在国际互联网统一的平台上的。最简单的说就是采用网页安全色,不能毫无节制的运用太多颜色,一般情况下先根据总体风格的要求定出主色调和辅助色进行色彩的搭配。网页色彩模式一般采取RGB模式。网页设计是通过显示器来进行展示的,目前显示器大都采用RGB颜色标准,这与RGB颜色模式的原理分不开。RGB是从颜色发光的原理来设计定的,通俗点说它的颜色混合方式就好像有红、绿、蓝三盏灯,当它们的光相互叠合的时候,色彩相混,而亮度却等于两者亮度之总和,越混合亮度越高,即加法混合。在显示器上,通过电子枪打在屏幕的红、绿、蓝三色发光极上来产生色彩的。
三、版式设计
多媒体技术是将数字技术以及计算机技术的综合体,它是各种多媒体信息集合的产物,它将文字、视频、图像、音频等各种信息进行了有效的合成。多媒体技术已经广泛的应用到到了各个行业之中,如教育、旅游、广告等,并发挥着越来越重要的作用。多媒体技术在当前的应用范畴中所包含的内容也越来越多,其使用的素材也在不断地增多,并且使得网页更加的具有艺术性,使之更容易吸引浏览者的眼球,进而使得人们的工作学习效率得以提高。
2多媒体技术在网页中的应用
2.1图形图像处理技术
网页设计的最基础元素就是对图形、图像的设计,其设计程序主要包含着五个方面的内容,首先是对图像的获取,其次是对图像的编辑处理,还有就是图像的输出,以及图像的压缩和存储,最后要将这些图像转化成另一种平面或者是立体的图像,给浏览者一种视觉冲击的效果,进而吸引更多的浏览者。
2.2动画处理技术
一些动画往往运用了一些数字处理技术,这一技术的运用可以使得文字具有一些特殊的效果,同时还可以使的一些图形具有一种立体动态的效果。动画的格式有GIF、SWF、FLIC、Java动画等。
2.3数字音频处理技术
这一技术可以使音频不再是模拟,而是可以将音频和视频合成,可以通过数字化技术产生更加良好的效果,使整个网页不管是从整体的角度看还是从局部的角度看都可以产生良好的视觉与听觉效果,。
2.4视频处理技术
当前视屏在网页中的应用比较广泛,已经成为网页设计时必须考虑的多媒体元素,在网页视频设计的过程中,信号源是第一要素,它可以是高频信号、分离电视、复合视频信号。获取数字视频的方式主要包含着通过数码摄像机获取,CD获取以及模拟视频采集。
3网页设计过程中对多媒体技术的运用
3.1动画、视频设计
在一些网站中,不难发现一些动画、视视频之类的东西,通过这些可以生动形象的将主题突显出来,使得网页浏览者可以在感官上获得享受,同时产生空间的联想。这样也使得动画在网页设计中的地位越来越突出,成为网页设计中非常重要的组成部分。
3.2图形、图像的版式设计
在对网页进行设计时需要注意图像质量的选择,注意图像的质量,尽可能的做到精致,这样也就要求设计者在设计的过程中要对图像进行细心的筛选,使图片在整个网页中的效果既融洽又精致,同时还需要对图像的色调进行选择,对文字进行合适的排版,这样就可以使得图形和文字的效果在视觉上呈现出一种意境美,从而使得整个网页的形式统一,设计新颖。
3.3在对多媒体元素选择的过程中要注意与网页风格的协调
在设计网页的过程中需要注意网页的主体,通过视觉上的冲击效果以及浏览用户的心动情况吸引用户,促使用户直观的理解网页的主题,并通过艺术美吸引浏览者关注本网站,最终实现网站设计的目的。
3.4注意在多媒体设计的过程中体现艺术性
随着信息技术的不断进步,多媒体技术得到了迅速发展,当前网络传输的技术以及硬件技术也在不断的提高,这样也就为艺术和技术的结合创造了良好的条件,这样也有利于网页的设计体现出更为优质的效果,从而也为多媒体技术在网页设计中的应用创造了更为广阔的前景。
4在多媒体设计中恰当的融入艺术设计的成分
网页设计不只是由多媒体元素构成,为了使其更加的美观就必须要考虑艺术性,要注意平面效果的传达,这也就需要做到不同的元素结合起来,但是在结合过程中需要注意以下几点:
4.1在设计网页的过程中要注意内容和形式的统一
在进行设计时就需要做到形式与内容的统一,使得形式服从于内容,从而使得网络的整体效果表现出来,这也就要求网页的细节需要做得很到位,从而使得网页与多媒体元素的相关性凸现出来。
4.2突出主题要素
网页要尽可能的突出主题,使得风格与之相协调。在风格选择上要注意多媒体元素的选择,注意其色调的搭配,同时还要做好排版工作,从而使得整个网页具有较强的吸引力,达到应有的效果。
4.3注重色彩搭配
在一个网页中色彩数量最好控制在4个左右,同时还要分出主次,确保总体上的统一,在局部上形成对比,要注意体现主题的色彩搭配,注意色系的选择,还要注意背景色的选择,尽可能的站在浏览者的角度思考问题。
4.4注重网页布局
网页布局大致可分标题型、拐角型、框架型等,选择布局类型的依据主要是信息状况,网页状况以及结构状况,这样就会使得网页的页面可以一目了然。国字型以及拐角型的适合用于信息量大的网页中,标题正文型的适合用于纲要性的网页之中,动画型的可以灵活的运用到各种各样网页之中,但是在布局的选择过程中需要注意各种布局类型优缺点的选择,只有这样才能使得网页的效果更为明显。
5结束语
远程教育已经在我国众多的发达城市当中开展起来,这使得我国的教育更加具有终身性与普遍性,不仅能够极大提高国民综合素质,还能够突破传统教育的局限。然而,远程教育需要强大的交互功能以及多媒体的辅助作用,教师所传授的内容也更加广泛与具体,通过人机的交互不仅能够提高学习者的学习热情,还能够更好地训练逻辑思维与创新思维,因此,远程教育的课件一定要达到动态交互的效果。与此同时,脚本语言不仅能够将动态课件的效果最大限度地展现出来,还能够将其与市场中其他的课件进行比对,从而找出最佳的教学方案,将先进的教学思想尽可能的传授给学生。
2脚本语言在远程教育动态网页设计中的应用
2.1JavaScript语言的应用JavaScript语言作为一种新型的动态性编程语言具有多种应用功能,首先在网址的编写当中可以运用简洁、精准的编码将语言编译出来,使得动态网页呈现出特有的表现形式,这样能够让初学者很快明白课程教授的内容和目的,然而,JavaScript语言的不足就是一旦有一处编码出现错误,将会影响后续的程序运行,使得远程教授出现问题。另一方面,JavaScript语言具有先进的鼠标动画跟踪功能,这是课堂教学中不可缺少的重要组成部分,是教师与学生互动的体现,教师可以通过移动鼠标准确、快速地将自己想要表达的内容展现给学生看,同时在有限的课堂时间内顾及各个水平学生的学习需求。最后,就是JavaScript语言对于文字图像的动态显示功能,很多文字内容通过动态的图像来展现能够使人更容易理解和记忆,这正是现阶段我国远程教育所欠缺的内容,远程教育的动态网页设计如果能够将教学内容自动化的传授,就能突破传统的教学模式,也就是说,通过动态的文字将学生存在的问题一一解答,同时实现学生之间的交流和互动,这样就能够将每个人的创新思想与他人分享。
2.2JSP语言的应用脚本语言可以与多种编程语言配合使用,这样不仅能够完善脚本语言的运用效果,更能够凸显其兼容性,使得远程教育的动态效果达到最佳。而JSP语言在脚本语言中可谓是后起之秀,其以更快的速度和准确度占据着动态网页设计的重要位置,很多远程教育的编程语言都是选用JSP语言,其能够实现知识点的连接功能,能够让学生在学习的同时更加便捷地查阅自己不懂的内容,通过动态图片或语言的连接,只要通过点击就能够进入到另一个界面,获取更加详细、准确的信息,让远程教育不存在知识点的堆积,提高学习效率与教学成果。另一方面,JSP语言还能够根据实际的课堂需求设计出动画卡通人物,其目的是为了提高低年级学生或初学者的学习热情,从而使其更加专心的学习,可以帮助学生建立抽象思维。最后,JSP语言能够实现网络测试,这样就能够解决远程教育存在的测试问题,通过网上学习能力的测试,让学生即便在没有教师与家长的看护下也能够认真的完成作业,同时检验自己的学习成果,更为重要的是JSP语言所展现的动态教学具有限时和提醒的功能,可帮助学生更加认真、高效的完成作业。
2.3其他脚本语言的应用实际上,脚本语言的种类有很多,应该根据实际的教学情况和需求选择最恰当的脚本语言,只有这样才能使远程教育的动态网页设计更加实用,当然也是为了获得最大的经济效益。每种脚本语言都有自身的优势和不足,一些技巧性与动态性的网页设计就可以选用上文阐述的两种脚本语言,其他的脚本语言可以先让部分用户做体验,看其是否符合用户的需求,从而达到远程教育的最终目的。
3结语
目前,案例驱动教学在高等教育各学科中广泛使用.但由于很多教师对案例驱动教学法的内涵、特点及组织过程的认识不透彻,导致案例教学法的使用存在许多误区.
(1)案例设计不当.
案例驱动教学本质上应是通过“案例”来诱发、加强和维持学生的成就动机,成就动机是学生学习和完成任务的真正动力.因此,案例驱动教学法的案例设计是教学成败的关键因素.案例过于简单、欠缺针对性、设计不清晰等都会影响案例教学的教学目标.一个具体的案例设计,必须考虑周全,保证案例的可行性和有效性.进行案例设计时,要以学生为中心,教师为主导,兴趣为主线,使学生在完成任务的过程中掌握知识、技能、方法并学以致用.
(2)组织实施过程并非案例教学.
案例教学是师生的双向活动,通过具体案例引导学生参与分析、讨论,让学生在具体的案例情景中积极思考,主动探索.在实际教学过程中,有些教师只是把案例呈现给学生,像讲故事一样叙述一遍,没有引导,没有总结,缺乏交流与互动;有些教师在课堂上引用了案例,但教学方式还是沿用传统的灌输式的教学,仍然以教师为主体.以上种种教学方式看上去是引用了案例,但并非采用了案例教学法,更谈不上通过案例驱动去激发学生的学习兴趣,培养学生分析问题解决问题的能力,提高学生自主学习及与他人协作的能力.上述种种对案例驱动教学法的不恰当使用,将直接影响学生学习的深入和教学目标的达成.本文结合“案例驱动在网页设计类课程中的应用”的教改课题,对案例驱动在实际教学工作中的应用进行了探讨和反思.
2案例驱动的教学实践
《网页设计》是一门知识点丰富、应用性和操作性强的课程.此类课程目标是培养学生分析问题和动手解决问题的能力.通过教师对网页设计知识点的讲解,结合案例驱动的教学模式,让学生系统地学会如何设计网页和开发网站.
2.1案例选取的原则
根据网页设计课程的内容和特点,在课程开始就引出成品案例,明确需要解决的问题,调动学生的学习积极性;同时,在教学过程中,以该案例为线索,将其贯穿于课程的始终,将零散的知识点结合在一个完整地案例实现中,并通过分组操作完成案例的方式,进行相互评比学习,进一步扩展知识面.对于教学过程中的小知识点选择对应的小案例.案例的选取在案例驱动的教学过程中至关重要,大的成品案例应具备较强的实际应用价值,能够较好的模拟真实的应用环境,小知识点案例则需注意选取的针对性,做到有的放矢.在实际教学过程中,我们一般遵循以下的案例选取原则:
(1)代表性.
在课程开始之初,为激发学生的学习兴趣,明确学习目标.让学生观摩的成品案例应选择不同风格类网站的代表或往届学生优秀作品的代表,且此类网站需和学生的实际学习生活息息相关,如班级网站、购物网站、技术网站等,以此调动学生继续探究学习的积极性.
(2)针对性.
在教学过程中零散知识点对应引入小案例,此类案例应具有较强的针对性,将课堂教学目标融入到案例教学中.如通过网站公告栏引出对marquee标签的讲解,通过网页的刷新功能引出对meta标签的讲解等.
(3)趣味性.
尽可能选取趣味性强的案例,更好地吸引学生的注意,抓住学生好奇的心理,唤起学生更多的学习热情和欲望.如通过漂浮的广告、滚动的图片等案例引出对脚本内容的讲解.
(4)综合性.
成品案例的选取应注重综合性.一个成品案例网站应涵盖HTML,CSS,JAVASCRIPT等多个知识点.通过成品案例的设计与实现,考察学生综合应用多知识点解决实际应用的能力.
(5)理论联系实际.
更多地结合学生在实际生活学习中的应用选择案例,最好从学生熟悉的操作和感兴趣的事件出发,使他们有更多的机会从周围熟悉的事物中学习和理解,感受到设计的趣味和作用,体验到设计的魅力.如在讲解时间对象时,可以选择人性化问候或重大事件的倒计时牌设置作为案例引出.
2.2案例驱动教学的实施过程
在案例驱动教学应用到《网页设计》类课程的具体实践中,我们创设了“模仿—扩展—发挥”的教学过程.具体的教学过程主要分五个阶段展开.
(1)成品案例演示,学生观摩.
此阶段为教学展开的第一阶段,通过各类代表性综合网站的观摩,激发学生的学习热情,调动学生的学习积极性,为课程深入学习打下基础.可粗略提及网站内容组织,设计理念和主要相关技术,建立对课程学习的大体认识.
(2)知识点讲解,模仿练习.
此阶段是教学深入开展阶段,教师开始各类知识点的讲解,通过引出小案例配合教学,教师需要示范案例的制作过程,讲明案例的制作步骤和方法,讲解制作中运用的知识要点和技能,学生模仿练习,达到掌握各类知识点的目的.
(3)成品案例扩展,实现.
成品案例的实现是一个循序渐进的过程,在知识点的讲解过程中,学生在每次模仿练习完成后,可运用已学知识与技能逐步展开对成品案例的制作,不断扩充,直至课程结束,案例制作完成.
(4)评价教学.
教学实践完成后,教师抽取学生个案展示,并对学习成果进行多元评价,归纳总结学生学习过程和结果中出现的问题,引导学生进行反思.同时对优秀的案例进行总结分析,和学生分享学习其设计的风格、思路和技巧,查漏补缺.
(5)自选主题设计作品.
此阶段为自由发挥阶段,不限题材,不限风格,引导学生应用所学构建风格各异的网站,通过自主完成搜集素材到分析设计,再到制作的过程,让学生充分了解并亲历实际开发中网页设计的开发流程,提高学生独立分析和解决实际问题的能力,有利于学生的自我完善和提高.针对目前《网页设计》课程的教学体系所存在的不足,只有通过教学内容的整合与优化,并以课堂教学环节、实验实训教学环节、考核方式的改革相配合,建立一个合理的实践教学体系,才能培养学生的学习兴趣,提高学生在网页设计的应用中分析问题和解决问题的能力,促进教学质量的提高.在实际教学过程中,我们采用以下的策略来优化教学过程,进行案例驱动教学工作的实施.首先,以案例驱动为导向,优化教学过程,改进学习方式.同时,加强实训环节的教学.直接引进企业实际应用需求的案例,学生在教师指导下通过分组直接参与综合大型实践案例开发.通过这种大型实训教学,完成对基本知识和基本操作技能的综合训练,让学生了解了实际工作中需要的多方面素质,实现了课堂教学与职场岗位间的“短距离对接”.其次,开展技能比赛式教学.组织网页设计与制作方面的竞赛,如网页设计、图像处理等,通过形式多样、丰富多彩的学生竞赛活动,促进学生主动进行计算机应用与技能训练活动,提高学生对技能应用的能力,加深对知识的理解.在对《网页设计》课程采用案例驱动教学法后,学生学习积极性大大增强,动手实践能力显著提高,通过案例展开的教学让学生更轻松,系统地掌握知识和技能,上机实践已由验证实验逐步转变为自主设计实验,学生能在课程结束时学以致用,或个人独立或分组协作达到完成一个综合性网站制作的目标.在学生获得相应技能的同时,学习的积极性、主动性、创新能力、协同工作的能力,独立分析问题和解决问题的能力都得到了发展.
3结语
1适用性
创建网站时,首先要考虑的是用户的需求。网站是以宣传用户企业文化为主,还是以宣传企业产品为主,即确定网站的主题。主题确定以后,就要了解哪些颜色适合传达该主题信息。例如,IT类网站常常采用蓝色为主色调,因为蓝色为冷色调,通常让人联想到海洋、天空、水、宇宙。纯净的蓝色表现出一种美丽、冷静、理智、安详与广阔。由于蓝色沉稳的特性,具有理智、准确的意象,在商业设计中,强调科技、效率的商品或企业公司,大多选用蓝色当做标准色,企业色,如电脑,汽车,影印机,摄影器材等等。橙色是暖色调中最温暖的颜色,具有兴奋、温暖、欢乐、辉煌、以及容易动人的色感,所以,家居类网站常常以橙色调为主,能够烘托家庭温馨的主题,即不同的主题应选用不同的颜色。
2独特性
网页的数量不断增长,越来越富有个性,对设计者的要求也更高。相同类型的网站,若网站的整体风格大同小异,没有突破,则很难在竞争中取胜。要吸引浏览者挑剔的眼球,就要打破常规、标新立异。即网站的色彩搭配要在考虑网站本身特点的同时,让色彩的独特性充分发挥魅力。
3整体性
网页上各部分色彩都有自己的分工角色,主色具有传达主题信息的作用,辅助色是烘托气氛的,背景色保持画面的整体统一,点睛色起强调作用。网页的色彩也可以区分信息模块、暗示控件功能等。不同的色彩在网页中同时存在,就会出现色彩的不同组合关系,可能有强烈的颜色对比关系,也可能在亮度上有明暗对比关系,还可能有相似色彩间的调和关系。这些色彩的组合使网页在视觉效果上丰富多彩,构成了网页的整体效果。优秀的色彩组合是网页设计者发挥艺术才能的重要领地,和谐的配色能够让整个界面看上去舒适。对比强烈的配色加以适当的面积比例调整进行调和能够让整个界面看上去清晰并且重点突出。因此,不同的需求可以采用不同的组合关系,但是一定要给浏览者良好的整体印象,这就需要这些色彩组合关系具备整体性,它主要包括色彩对比与色彩调和2个方面:
(1)色彩对比:
指各种色彩在构成中的面积、形状以及色相、明度、纯度之间的差别,这些差别为网页配色增添了许多变化,页面显得更加丰富多彩。色彩的对比规律大致有以下几点:
(2)色相对比:
指不同色相之间的差别产生的对比。当网页主色确定后,必须充分考虑其他色彩与主色的关系、要表现的内容及效果等,这样才能增强其表现力。如果要突出差别关系,应选择主色的补色。若要对比效果柔和,就要选择相似色。
(3)明度对比:
指色彩之间明暗程度的不同所形成的对比。通过明暗程度的调整,可以给浏览者在视觉上产生不同层次,不同距离的感觉。
(4)纯度对比:
指不同色彩之间纯度的不同所形成的对比。色彩的纯度决定着色彩的鲜艳程度,将不同纯度的色彩放置在一起进行对比,会使得纯度高的色彩更鲜艳,纯度低的色彩更浑浊。
(5)补色对比:
补色是色环中相对位置上的两种颜色。网页中的点睛色就经常采用补色,当互为补色的两种色彩接近时,能显示出强烈的对比关系。
(6)冷暖对比:
色彩给人的感觉是有冷暖的,分为冷、暖两大色系,这两种色系相互排斥的,放置在同一个页面中,就会产生冷暖对比。冷暖对比效果是极为强烈的,会导致画面的不协调,一般采用以下两种方法解决。首先是纯度调整:降低冷暖两色的纯度。用黑、白、灰明度变化来调整画面的层次、直接使用黑、白、灰色系进入画面搭配,或者加入补色,也都能很好地起到协调的效果。其次是面积调整:主次的面积区分,根绝主题的需要在画面的面积上以一方为主色,其他颜色在使用上拉开距离,使画面的主次关系更突出,在统一的同时又富有变化。
(7)面积对比:
指页面中各种色彩在面积上的大小差别,它会影响到页面的主次关系。在同一视觉范围内,色彩面积的不同会产生不同的对比效果。若两种色彩的面积同样,那么这两种颜色之间的对比十分强烈,若色彩的面积不相等时,小的一种色彩就会成为陪衬,在小面积的色彩陪衬下,大面积的色彩就显得特别突出。根据主题的需要在页面的面积上以一方为主色,其他颜色为辅助色,使页面的主次关系更突出。
4色彩的调和
两种或两种以上的色彩分布在同一个页面中,形成色彩组合关系,色彩调和就是使这种组合关系合理搭配,产生统一、协调的效果。色彩调和是人们求得色彩协调、达到心理平衡的重要手段。
(1)同种色的调和:
选定一种颜色,通过改变这种颜色的明度或纯度得到所需要的新的色彩,进而使色彩产生循序的渐进,弥补同种色相的单调感。
(2)类似色的调和:
如果希望两种或两种以上的颜色对比不那么明显,那么就要在这些颜色之间再添加类似色进行调和。在色相环中,色相越靠近越调和。
(3)对比色的调和:
对比度调和是指两种或两种以上的色彩配置在一起,通过一定的方法使其产生自然而融洽的感觉。其调和的方法有:提高或降低对比色的纯度、采用面积大小不同的处理方法。
(4)渐变色的调和:
渐变色本身实际上是一种调和方法的运用,是颜色按层次逐渐变化的现象。色彩渐变在网页的背景色中是经常使用的。色彩的对比与调和是形式美的变化与统一。
二、配色的基本方法
1色调配色法
选定一种颜色,加入黑色或白色会使其明暗程度发生变化,形成这种颜色的不同色调,一般分为亮调、中间调、暗调。不同的色调会对人产生的一定的心理暗示。这种色调配色法在网页色彩构成中是经常使用的。笔者推荐的配色技巧为:打开Photoshop的拾色器,选择HSB选项区(不是RGB选项区)中的B(亮度),指定选择的颜色,通过拖动右侧的滑块就可以得到这种颜色的各种色调。
2色相配色法
当基于色相策划了一个配色方案时,获得的效果通常会比较华丽明艳。很多民族服饰和儿童服装采用的都是典型的基于色相的配色方案。色相配色法就是基于某种色相,进行类似色、互补色的搭配。适当地类似色搭配,可以获得整齐宁静的效果;适当地补色搭配可以突出显示颜色并给人轻快的感觉。笔者推荐的配色技巧为:打开Photoshop的拾色器,选择HSB调板区域中的H(色相),指定选择的颜色,通过拖动右侧的滑块即产生色相变化。若已在Photoshop的工作区选定了某一颜色,按下[Ctrl]+[I]键即可得到颜色的互补色。
三、小结