文档介绍:湖南汽车工程职业学院教师授课教案第8周第5-8课时累计8课时课程名称网页效果图设计(三)授课课题网页基本元素授课专业班级视觉传达1201教学目标知识目标通过本章学习使同学掌握网页文字设计,网页背景、网页Banner设计与应用能力目标1、 掌握网页Banner文字与图片的设计;2、 网页背景设计的基本原则;3、 制作网页Bannero情感目标1、 培养学生对知识技能的自我学习能力;2、 加强团队协作能力。教学要点教学重点网页Banner设计原则教学难点网页Banner中文字与图片的有机结合课型教学做一体化课时4课时教法与学法(教具)教法:示范教学法、有差异的任务驱动法、讨论探究法教具:多媒体教学设备课后作业根据企业提供的素材为《千美家居布艺》公司背景与Banner设计。教学后记(教师课后填写)本次课学生对于知识点的掌握情况较好,基本能根据项目内容独立完成网页背景及Banner效果图设计,极个别同学Banner文字与图片不能很好的在同一画面进行编排,课后要求这些学生多上网欣赏优秀Banner作品,并进行临摹。授课教师肖硕武备课时间2014年10月4日【学习本课程的目的、意义】【新课引入】(5分钟)1、 叵I顾上节课知识2、 欣赏图片提问:同学们请看以下图片,有的网页周边会有背景,而有的没有,请问网页背景有什么用?网页背景的设计原则是什么?【新教授】任务二:网页基木元素【任务描述】Banner是网页效果图设计中很重要的组成部分之一,是版面的视觉中心,也是区分其他网页内容的重要部分,所以设计制作出符合主题信息且独具创新的Banner,是每个网页设计师必须具备的能力。【任务目标】(1) 了解网页+Banner的重要性及设计原则;(2) Banner文字、图形的创意性设计;【任务训练】任务实施一:网站背景设计与制作引入知识点:观看图片,学生来评价图中网页背景1、网站背景的设计原则有效利用背景取得网站统一和专业化的方法有以下几种:第一,有目的的选取图片作为背景;第二,加强与前景的明暗对比,“浅底深花”或“深花浅底”。那么什么适合网页背景呢?一个好的建议是将公司的标志、象征性的简单图片作为背景,并将其淡化,使浏览者在阅读网站内容的同时不经意记下公司的标志。基本原则网站的背景可以统一网页的风格和情调,并且对视觉主体起着一定的衬托和协调作用,同时背景的设计也有助于体现该网站的主题。背景是为网站的主题和内容服务的,因此,背景及其色彩色调的选择不能一意孤行,而要统筹网站的内容,包括网站类别、网站主题、文字、图片等各个方面,进行合理地选择。2、PS制作网页背景流程(教师边演示边讲解)(最终效果)第一步:首先新建一个文档,宽1920px高108()px。这个文档可以用于宽为1024px的站点,仍然还有空间去决定在可视区域之外如何布置,这样在更大屏幕下也很好的适应。现在第一步先创建一个美观抽象背景。我们使用从#lb204c到#472373这两神颜色按照线性递减绘制背景第二步:现在要一个吸引眼球的背景,抽象到不会干扰人阅读文字。选一张水彩图片,按下CTRL+I将图片反置,会在黑色为底的背景上呈现漂亮的粉紫色。第三步:把处理过的水彩图片拷贝到主画布上,按下CTRL+T键,竺,将其调整到适当大小。将右边淡化为黑色(:涓辑HTML代码)。最好擦掉一些超出的地方。