浅谈网页设计课程教学

浅谈网页设计课程教学
                    袁晓维
(四川航天职业技术学院计算机科学系  四川成都610100)

     摘要:网页设计课程是计算机和艺术的交叉学科课程,应注重将技术和艺术相结合起来进行教学。本文针对“网页设计 ”课程的特点,结合实践应用,阐述在教学方面的一些体会。
   关键词:网页设计,教学方法
   Abstract: website design course is a cross computer science and artistry course, it is need to combine teaching methods of these subjects . this paper is to base on the feature of  “website design” course and practice , to give some opinion about teaching.
    Key words : website design,  a teaching method
一、引言
《网页设计》课程是高职高专院校计算机类专业及电子商务专业的一门专业课程,也是一门实践性很强的职业技术课程。由于《网页设计》课程实践性和更新性很强,该课程如果采用传统的教学方式,那结果是不理想的。在这里结合自身的实际经验,谈谈网页设计课程的教学。
二、教学策略
1.课程特点
网页设计课程是计算机和艺术的交叉学科课程。在教学过程中,除了要求学生掌握基本的技术外,也必须对艺术设计有一定的了解。网页设计应注重技术和艺术的统一性。在进行网页设计时,应考虑网站的总体结构,风格定位,色彩的应用,版式的设计等方面的因素,力求形式与内容的统一,让网页的显示达到快捷,美观的视觉效果。
2.教学方案
要设计一个好的网页作品,首要的因素不是创新,而是“用户体验”,第一步应该站在用户的角度去考虑设计方案,所有的形象风格都必须服从主题,服务用户。这就对网页的整体形象有了较高的要求,整体形象包括版式设计,色彩的应用,logo设计,素材设计,广告设计,web图像设计及优化,交互方式等等。在教学时,我们可以结合实际,要求学生从版式布局设计和网页元素的处理及色彩搭配三方面着手,归纳如下:
2.1 版式设计
网页的美感来源于网页的版式设计,它突出了网页设计的艺术性和个性,属于网页的艺术设计,好的版式设计会使得网页显得更具有美感和创意。网页的版式设计是基于内容的,应该从实用性和艺术性考虑。网页内容一定要主次分明,中心突出;导航要清晰;可以图文并茂,是网页显得生动和活跃。除此以外,网页的版式设计要符合统一、分割的原则。统一即指整个网站版式风格的统一性、整体性;分割即指要科学的划分整个页面。
网页的版式设计主要是表格、层等技术的应用。表格是一种最简单的布局手法,它可以将图像和文字做最恰当的编排,达到清晰易懂的效果。层(div)的布局,是现在正当流行的排版手法,它主要应用相对位置等的关系进行准确定位,再加上层叠样式表的辅助,突出了它对网页的设计具有可扩展的优势。
文字是网页内容的主要载体,所以文字的视觉效果在版式设计中也起着关键的作用。文字的设置可以分为字体、大小、颜色、行距等,通过这些属性设置,使文字排列得整体和美观。但要注意的是中文字体和英文等其他字体的设置,是有一定区别的。英文的字体有很多的选择,但中文的正文字,总的来说,就两种:宋体和黑体。在传统的版式设计中,大家都还是倾向于英文的排版,从视觉上来看,英文字体更有韵律性,因为每个字母本身高矮不一致;但是中文字体相对来说,就显得单调和独立些,所以在设计时,这两种文字要作不同的处理。另外,也不要选择一些非常特殊的字体,除非用户的浏览器认识这些特殊字体,否则将会出现乱码。如果遇到非要使用特殊字体的情况,可将文字转换成图片再将其应用。对于字号而言,单位应采用em,而不是px,这点在使用层叠样式表(css)时尤为重要,还要注意的是em和px是有差别的,所以在使用的时候也要对上号,否则也达不到预先的视觉效果。文字一行的字数最好不超过50字,首页的标题在10-20字为佳;行距一般使用的是20-22像素的行距,这样使得整个的文字内容部分不会显得太紧凑或者太松散。文字的整体排列一般有四种基本形式:两端对齐、居中对齐、左对齐或右对齐、图文环绕排列。在整个网页版式设计中,标题文字的设计原则应该是“醒目而不夸张”。
导航栏的设计在网页设计中也很重要,它对整个网站内容有提纲和导航的作用,在设计的时候,要注意首先导航栏的风格也要和整个网页风格保持统一,另外最好采用文字,因为网络的速度可能会影响图片的正常下载;不过现在flash按钮的导航栏已经成为时尚,它可以实现丰富的动感效果。
2.2 网页元素的处理
网页元素包括logo、按钮、图片、动画、声音、 banner等。在网页中包含这些对象时要注意的有:首先是logo的设计,logo代表了整个网站或者企业的文化,一个有特色、具有视觉冲击力的logo,可以直接影响浏览者对网站的判断,给浏览者留下记忆深刻的印象。其次,要确保网页上的每一个元素都有存在的必要性,不要使用冗余的技术和内容;再次,要保持形式和内容的统一;最后,要尽量的使网页具有快捷性。对于网页的特效技术,最好采用javascript或css技术来实现。
2.3 色彩的处理
并非所有的颜色都能应用于网页,网页中的颜色会受到硬件、浏览器等的影响,即使网页中使用了非常合理、非常漂亮的配色方案,每一位用户所看到的效果也不一定相同。所以,最好使用使用网页安全色来避免和解决这种问题。网页安全色是指在不同的硬件环境和软件环境下都能在浏览器上正常显示的颜色,并且现显示的效果都一样,不会出现失真的现象。在页面设计中,整个网页的色彩种类最好不要超过3种,一种或者两种主体色,其他为辅助色。颜色种类太多,会让人觉得很杂乱。另外,文字内容和网页的背景颜色的对比要做到突出,比如:背景为深色,则文字的颜色可以选取浅色调;背景为浅色时,文字颜色就应该深些;这种深浅的变化在色彩学中称为“明度变化“。比如有些主页,背景色和文字颜色都采用的是深色,由于色彩的明度较近,所以浏览者来浏览阅读的时候,会感觉吃力,从而影响阅读;但是色彩的明度变化也不能太大,明度变化大会导致亮度的反差强,让人觉得很刺眼,同样会影响整个网页的视觉效果。在进行颜色搭配时,还要注意的是:第一,采用的颜色应具有联想性,不同的色彩会产生不同的联想,所以色彩的选取也要和网页的内涵有关。第二,色彩的合理性。根据网页的主题的不同,选取相应的色彩,比如红色,可以体现出网站的热情和喜庆;蓝色可体现出科技的气息等。第三,色彩要有鲜明性,这个才能给浏览者深刻的印象,并有耳目一新的感觉。
2.4 网页赏析
在教学过程中对学生的引导是非常重要的,设计网页得多看多学,网页设计的技术和风格在日新月异地变化,所以在提高学生设计技术的同时,还要多培养学生的审美能力,知道怎么设计才是一个好的网页。创建网页是一个不断学习的过程,在看一个网站的时候,找到这个网站的优点缺点,注意哪些是可以借鉴的,哪些是需要避免的,在看的同时,可以看些成熟的网站,也可以看些成长中的作品,在同期的比较中,也有助于自身的提高。另外,鼓励学生看源文件,了解某些效果是如果实现的,在效仿的同时进行改进和创新。
2.5 考核方式
网页设计课程的考核应该打破传统的考试方式,建议采用机考的方式,学生通过一学期的学习,应能自行设计各种网页,熟练掌握其基本制作方法和技巧,在规定的时间内设计网页。这也是一种对提高学生动能能力的一种鞭策方法。
三、结束语
在网页设计课程教学中,应当充分认识到网页设计课程的特点,结合实际,采取相应的教学措施和方法完成教学任务,以达到良好的教学效果。对于信息科技迅猛的发展今天,必须摒弃陈旧的教学理念,及时提高自身的专业水平,完善自身的教学理念,寻找更好斗罗大陆的教学方法,激发学生的学习兴趣,培养学生追求新知的能力和动手实践的能力,从而达到学以致用的效果。

参考资料:
田博文,《Dreamweaver8基础培训教程》,人民邮电出版社,2007年2月
孙素华,<< Dreamweaverms2004完美网页设计>>,中国青年出版社,2005年10月