网页布局设计美化与布局教程学到了什么?

网页设计课程总结篇1
关键词:《网页设计》;项目教学;教学实践
《网页设计》课程是青岛农业大学传播学专业网络传播方向的一门专业基础课,其主要目的是培养学生具有一定的艺术素养,较强的网页鉴赏能力,熟悉网页设计创意的原理和方法,熟悉HTML、CSS和网页制作工具,熟悉网页的制作和流程,能够根据客户需求进行静态网页设计与制作以及进行小型网站的维护和管理工作,是一门操作性与实践性都很强的课程。课程设置32学时,内容多、课程紧,如何在有限的时间内最优化学生的学习效果是授课教师面临的重要课题。
一、理顺与先修后继课程的关系
以《网页设计》课程为中心,重新规划了传播学专业网络传播方向的相关课程群内容,课程的先修课程包含有通识课程《计算机基础》,专业基础课程《C程序设计》及《电脑美术平面设计》,课程的后续课程包含有专业基础课程《计算机网络技术》,专业课程《网络传播》《网站创建于管理》,专业拓展课程《网络数据库技术》《手机APP开发》《网站策划与设计》及《动态网站建设》。
二、确定课程的教学目标
在对课程进行了重新定位和性质分析的基础上,确定课程的总体教学目标为培养学生静态网站设计与制作的实际工作技能,其中:知识目标:了解HTML标记语言,熟练使用网页制作工具Dreamweaver,能完成DIV+CSS标准布局。能力目标:能进行网站需求分析、总体设计,能实现界面设计、基本网页制作,能制作多种页面特效,能进行网站的基本管理。素质目标:培养学生良好的职业素养、团队协作意识、自我学习能力、沟通表达能力和知识归纳与积累能力。
三、课程内容设计
设计课程的讲授学时为16学时,实践学时为16学时。教学内容制定的依据是以岗位需求为导向,对网页设计师和网络美工的工作过程进行分解分析,确定岗位的核心能力;将核心能力整合提炼为对应的课程项目;依据课程项目提炼章、节、知识点;构建出以工作体系为基础的课程体系。其中课程项目规划设计6个,对应16课时的实践学时。分别为:项目一网页设计基础、项目二Dreamweaver基础、项目三表格布局的页面制作、项目四页面美化、项目五CSS+DIV布局的页面制作及项目六页面特效制作。围绕6个课程项目,规划课程教学内容10章,对应16课时的讲授学时,内容包括网页设计基础、Dreamweaver基础、页面与文本、图像与多媒体、超链接、表格、CSS样式、CSS+DIV布局、APDiv和Spry及行为。
四、《网页设计》项目教学实践
课程的实施步骤主要包括知识引入、项目布置、项目分析、分解实施及分步总结5个环节,本文以“页面特效制作”项目为例,具体阐述课程教学实施过程[1,2]。
(一)知识引入
平时浏览到的网页,很多都有网页特效。像图1左右两侧的对联悬浮广告,以及图2中的图像变化效果,这些特效的实现与“行为”这一知识点密切相关。针对行为是什么和如何为网页添加行为,围绕第十章行为相关知识点开展教学。在基本知识点完成学习的基础上,布置本次需要完成的项目是“制作甜品饮料吧网页特效”。
(二)项目分析
教师对项目任务的重点、难点进行细致的分析讲解,学生针对性地记录相关知识点。例如,对“甜品饮料吧”案例进行分析,确定该项目的操作要点为:一是在“热卖产品”下方,分别为图像“茉莉花香”“冰火两重天”“生命之绿”,“巨杯甜饮”添加显示-隐藏元素特效。二是在“特色产品”下方,添加交换图像特效。学生要在教师的指导下充分理解项目要求。
(三)分解实施
学生根据项目任务做好详细地分步实施计划,教师按照任务节点要求以及学生学习计划指导学生进行网页设计与制作,并注意纠正学生自主学习过程中出现的偏差,着重培养学生的项目实践能力。
(四)分步总结
对于项目实施过程中的重点与难点,找出共性问题进行讲解。
五、结束语网页设计课程总结篇2
>> 用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所示。网页设计课程总结篇3
《网站设计与制作》也是计算机各专业学生学习后续课程的基础,比如学习基于网络编程的动态网页设计技术,学生毕业后可从事网络软件的设计与开发,进行商务网站的设计与制作,同时也可以考取网页设计师、网络软件工程师等相关国家职业资格证书。开设该课程是复合我校关于“高素质、技能型人才”培养目标的需求的,通过该课程的教学,可以培养出一批优秀的、能够在一线工作岗位上从事网页设计与制作、网站规划、管理与维护工作的专业人才。基于该课程的主要工作岗位有:网站管理与维护人员、网页设计与编辑人员、网站策划人员及网页美工人员等。
二、课程教学思路与教学方法改进
学生如果要很好得完成网站制作,所需的的知识体系非常庞杂,其中包括网络基础知识,网页制作技术,平面设计和动画制作等基本要素。具体涉及到网页制作软件,图像处理软件,动画软件,数据库知识,脚本语言动态服务器编程技术等。教学内容比较多,知识点比较分散,而学时仅为48个学时,学习内容多而课时少。经过多年的教学活动的开展和经验总结后,我们总结出一套适合高职学生教学方法,那就是使用任务驱动式的教学方法。我们以前的教学设计思路是:讲授知识点———设计任务———监督学生完成———验收,现在的教学设计思路是这样的:实际工作任务导向———任务驱动———相关知识讲授。老师在此教学思路中的角色:给学生布置一项工作(实际工作任务导向)———将工作转变为一个任务(任务驱动)———通过任务引出知识点(知识学习)。学生在此教学思路中的角色:通过老师的引导,理解相关任务要求,继而产生强烈的学习相关知识的兴趣,在下一步的知识学习中就能很好地学习,掌握了相关知识后,马上运用于实践,完成老师布置的任务。通过该课程的教学,使学生最终能够自主开发一个完整的网站,毕业后能够直接从事企事业单位网站的开发设计与管理维护等工作。
三、课程体系内容重构
本课程性质是计算机系的基础必修课,教学对象是全系各专业的大一学生,因此教学内容定位于静态网页的制作,以Dreamweaver软件为主线,介绍静态网页设计和制作的基本技术,目前很多网页教材是基于网页三剑客的即Dreamweaver、photoshop和flash,然而当前课时条件和时间条件下,根本做不到三个软件都讲到位,事实上每个软件分开都可成为一门课程,而网页设计课程只能以网页制作软件Dreamweaver为主,其他软件为辅,并且其他软件制作的作品要与网页密切相关为了解决内容多学时少的矛盾,有利于教学的开展和培养学生的动手能力,为此我们对教学内容重新进行了重构,围绕Dreamweaver软件讲解网页制作的方法和技巧,只有在制作图像缩略图、切片、按钮、LOGO图片等时候,才辅助其他软件加工素材或者制作动画。教学内容分为9个模块:模块一、网页设计基础;模块二、页面的基本操作;模块三、简单网页的制作;模块四、网页的样式设计;模块五、实用HTML布局页面;模块六、实用DIV+CSS布局页面;模块七、制作多媒体页面;模块八、网页交互设计;模块九、网站的测试与管理。
四、总结网页设计课程总结篇4
关键词 商务网页设计与制作 课程设计 电子商务专业
中图分类号: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).
[5] 方玲玉,李小斌,李念.高职经管类专业系列项目课程开发――以高职电子商务专业为例[J].职教论坛,2010(12).网页设计课程总结篇5
关键词:心智技能;网页设计;教学研究
中图分类号:G434 文献标志码:A 文章编号:1674-9324(2013)37-0154-03
一、心智技能理论概述
技能分为操作技能和心智技能,操作技能是一种动作技能,培养操作技能使学生“知其然”,比如网页设计中建立页面布局、插入表格这些功能如何实现。而心智技能是一种思维的技能,是调节和控制心智活动的经验,培养心智技能使学生“知其所以然”,比如为何要使用网页布局、使用何种布局更好、网页元素如何搭配更美观等,从而使学生能够更合理地应用其所具备的操作技能。
对于课程教学而言,不仅要培养学生的操作技能,还应更注重心智技能的培养。比如制作一个完整网站项目,不仅需要操作Dreamweaver、Fireworks等设计软件的技能,更需要需求分析、网站规划、风格设计和色彩搭配等心智技能。
因此,要提高学生的技能水平,就必须在教学中加强心智技能的培养,培养学生的创造性思维,提高学生学习创造能力以及解决实际问题的能力。
二、网页设计教学中存在的问题分析
目前,案例教学法是较为主流的网页设计课程教学方式,在教学过程中,往往以软件操作为主要内容,针对其中的各个功能设计教学案例并进行讲解。这种方式虽然能使学生在短时间内掌握软件使用技能,但学生对各个功能适用的场景和条件却不甚了解,不能真正做到学以致用,在独立面对一个完整的设计任务时会有无从下手的感觉。笔者采用课堂观察、学生访谈及学生作品指导等途径,开展调查研究之后发现,学生设计的网页作品普遍存在一些共性问题,主要体现在以下几个方面。
1.网页主题策划。当要求学生为某个网站主题制作一系列网页时,某些作品主题定位不准确,比如原本网站主题是品牌产品宣传,最后的作品却是购物网站。有的作品则是主题不统一,想展现的内容太多,多个主题拼凑在一起。出现上述问题的主要原因是需求分析不准确、提炼设计主旨的能力不足。
2.网页风格设计。在网页布局及风格设计方面,常出现页面风格不统一、页面风格与内容不协调等的问题。比如某些作品的多个页面之间在风格、模式和色彩上差异较大,影响了网站的整体风格。这是由于学生对形式与内容的协调把握不足,不能在内容不同时实现形式上的统一。
3.网页元素的编排。网页元素的编排,主要是框架、表格、文字、图片、动画等内容在单个网页内的排版。学生作品在网页元素的编排方面的问题主要有:(1)文字的处理。网页中使用的字体太多,造成页面混乱;字体、字号过于单一,标题或重点不突出;行距过大或过小等。(2)图片的处理。图片过度拉伸造成显示模糊;图片过大造成页面加载速度缓慢;并排显示的图片尺寸不统一等。(3)网页布局。页面宽度过大,在一屏内无法显示,造成浏览困难;页面内容多而杂,各部分跨度太大,整体可读性不好,重点内容不突出等。
4.网页色彩搭配。网页的色彩搭配应该均衡、协调,使人感觉舒适、美观,又不至于视觉疲劳。学生在网页色彩搭配上出现的问题主要有:网页色彩过于单一,无吸引力;色彩过于花哨,容易造成视觉疲劳;文字颜色与背景颜色相似,造成阅读困难等。
5.交互性设计。用户浏览网页是一个人与网页信息交互的过程,交互性好的网页应该功能实用、操作便捷。学生在交互性设计上出现的问题主要有:网页无标题;导航栏不全,引导性不佳;链接层次过深,造成连续浏览不便捷等。
6.网站文件结构。网站文件结构是指储存在硬盘上的目录结构,虽然不会影响到网页的功能和外观,但是良好的目录结构能够提高网页设计和后续维护工作的效率。学生设计的网页作品往往忽视网页文件结构的合理性,存在着网页命名随意无规则,不同层次的网页文件存放在同级目录,图片文件随意存放等问题。
综合上述问题分析可以看出,学生在创造能力及设计思维上相对较弱,实际上通过操作实践,学生基本都能完全掌握网页设计软件操作,比如插入文字和图片、设置字体和颜色、插入超链接等,但却在需要整合运用这些操作时出现了问题。这实际上就是心智技能缺乏的表现,因此培养心智技能是提高学生网页设计能力的关键。
三、心智技能阶段性理论在网页设计教学中的应用
1.网页设计心智技能形成分析。根据冯忠良教授的研究,心智技能的形成是阶段性的,其过程分为原型定向、原型操作和原型内化三个阶段[1]。原型定向阶段以理论知识传授为主,让主体掌握技能操作的原理;原型操作阶段通过实践让主体熟练掌握操作技能,为原型内化奠定基础;在主体大脑中形成内化的思维模式,使主体能够灵活运用操作技能解决实际问题[1-3]。
根据上述理论,结合网页设计教学的实际过程,网页设计心智技能的形成阶段如图1所示。
网页设计心智技能的形成可分为:掌握基本理论、熟练实践操作和总结设计模式三个阶段。这三个阶段不仅体现在整个学期的教学过程,更应该体现在每一章节的教学中,甚至在每次课的教学中不断重复,才能强化巩固心智技能。在整个学期的网页设计教学过程中,基本理论、熟练实践操作和总结设计模式三个阶段的主要教学内容是:(1)网站和网页的组成、网页设计的一般过程、HTML原理和常用设计工具。(2)网页设计工具Dreamweaver、Firewoks及Flash的操作和使用。(3)指导学生综合应用设计工具进行完整设计,总结网页设计中的经验和模式。而在某项软件操作的教学过程中也应遵循三阶段原则。教师首先结合HTML语言讲解此项操作的后台原理。然后教师进行演示,学生操作,期间教师不断进行指导。最后教师总结该操作中应当注意的一些原则,以及常用的一些设计模式,可通过展示优秀的设计作品进行对比讲解。
2.教学实践。在前述理论研究的基础上,笔者进行了教学实践。根据课程教材,首先设置了“网页设计概述”、“HTML基础”、“Dreamweaver CS 4应用”、“Firewoks CS 4应用”、“Flash CS 4应用”、“综合实例”六章课程内容[4]。其中第一、二章以纯理论教学为主,难点在于HTML基础知识,须重点讲解。第三至六章均采用三阶段原则进行教学。最后为了加强心智技能原型内化阶段的效果,增加了第七章“网页设计模式精讲”,对网页设计中的常见问题进行总结,介绍设计原则和方法。下面以第三章“Dreamweaver CS 4应用”和第七章“网页设计模式精讲”为例介绍教学思路。
“Dreamweaver CS 4应用”主要分为表格的使用、框架的使用、DIV元素的使用、文本的插入与编辑、图像的插入与编辑、超链接的插入与编辑、其他多媒体对象的插入与编辑七项主要内容。在正式讲解软件应用前,应使学生明白网页的本质是HTML代码,Dreamweaver本质是辅助设计工具,其作用是自动生成HTML代码,比如在Dreamweaver中执行插入表格的命令,就会在源文件中加入表格的HTML代码。在此后的讲课过程中,帮助学生理解操作的原理,为心智技能的建立奠定基础。以文本的插入和编辑为例,在教学中首先向学生讲解文本编辑中HTML标签

的作用和使用方法。然后在Dreamweaver中执行文本插入和编辑操作,并对比源文件中的代码变化。最后结合教学用例介绍文字排版的一些原则,比如长文本使用标准字号、在文本周围留出足够空间、增加文本和背景的对比度等。帮助学生建立文本编辑的心智技能,使学生在自主设计时能够编排出美观的、可读性强的文本效果。
“网页设计模式精讲”根据本文中对学生作品中常见问题的分类进行集中讲解,主要分为网页主题策划、网页风格设计、网页元素的编排、网页色彩搭配、交互性设计、网站文件结构六项主要内容。设计模式教学是一种经验的传授,目的是教会学生某一场景下问题的解决方法,因此在教学中,必须要明确模式适用的场景,以及模式如何实现,如表1所示是几个网页设计的模式。
在教学过程中仍主要依靠案例讲解进行,并在过程中要求学生在总结和思考之后进行相似模拟,但不能与原例一致。学生掌握正确的网页设计模式后,网页设计质量得到了一定改善,从侧面证明了学生网页设计心智技能的提升。
四、小结
笔者通过教学实践发现,结合心智技能形成的阶段性理论进行网页设计课程教学,确实对提高学生的网页设计能力起到了积极作用,但由于课时限制、教师经验等因素,教学质量仍有很大的上升空间。在后续教学过程中,仍需要不断地进行尝试和总结,探索更高效的心智技能教学方法,培养出更高素质的网页设计人才。
参考文献:
[1]冯忠良.教育心理学[M].北京:人民教育出版社,2000.
[2]丁清.论高职高专学生的心智技能培养[J].昆明冶金高等专科学校学报,2004,(1):81-84.
[3]陈军民.高职生心智技能培养探讨[J].新课程学习,2012,(03):77.网页设计课程总结篇6
【关键词】网页设计;教学改革;教学模式
1引言
随着网络的普及和发展,信息化程度的提高,网页已然成为当今网络世界信息传播的主要载体,网页的设计与制作普遍得到人们的重视。各高校基本上都开设了网页设计与制作课程,然而在其教学过程中,大多数学校还采用传统的教学模式,学习积极性不高,职业竞争力差。因此,《网页设计与制作》课程进行教学改革势在必行。
2课程现状和存在的问题
1)因为这门课程涉及内容较多,而且时间非常的分散,学生对就算对知识点有一定的了解,同时还可以做简单的案例了,但还是不能灵活运用,做到融会贯通,即使是最好的学生在解决实际问题时也会出现犯难的情况。
2)目前基本满足教学要求的教学内容,虽然课程的改革项目建设,提出了情境教学模式,然而由于社会需求更新,软硬件设施的不断升级,新知识和新技术层出不穷,导致过去教学过程中仍然存在实验教学和社会需求相脱节的问题。课程中实验案例也存在过时的问题,部分学生在学习过程中提不起兴趣,从而导致学生学不会用[1]。
3)网页设计与制作是一门交叉性、综合性非常强的课程,不但需要完整知识结构,而且需要学生具备相关技术的融会贯通、通力协作的能力。然而由于不同专业的学生学习的方向和重点不同,基本上都是采用单独教学,没有参与。因此,开展项目合作就基本谈不上。例如:软件专业基本不设计网站前台,导致设计出来的网站不漂亮;影像专业的学生不会进入网站后台进行编程设计,制作出来的网页是不合符实际[2],从而导致项目的最终结果并不完美,甚至搁浅停止,不能为企业所用。
3教改思路
网页设计与制作课程改革的目标是将教学本位方向从知识传授转向能力培养为课程目标,并以项目教学为主线,以企业为中心,而且围绕企业岗位资质与课程目标相结合,进行课程内容的整合,研究本课程是否适合学生的教学模式,探索培养复合型人才的新方法。
1)首先对职业能力进行准确的定位,其次根据市场上的就业岗位对人才能力需求方向进行制定能力培养目标,最后,对学生的网页设计制作能力、创新能力、沟通能力、网站管理能力和团队合作能力等方面进行综合性培养。2)以人才知识结构的要求为依据来构建课程教学体系结构,根据社会对网页设计人才的就业岗位需求,进一步建立建全完整的教学体系,不断的完善教学内容,建立网页设计环节和教学评估环节的体系结构。
4教学改革措施与方法
4.1教学内容安排
教学内容的整个安排必须与实际应用相结合,并完成必要的知识讲授。学生可以积极的参与实际项目的研究内容,从项目规划、需求、开发、测试等方面来安排教学内容,从“因材施教”转变为“因需施教”,以此来充分调动学生学习的主动性和积极性。同时,按照项目应用实际需求,改变教条式的教学内容安排。在传统灌输式的教学模式下,学生根本无法全身心投入学习。为了让学生知道怎么学、学到什么以及知道学会了后具备什么能力,在教学内容安排上要以实际项目或目前应用中的项目为教学内容。
4.2课程教学方法
在进行实训教学过程中,可以选择合适的教学案例始终贯穿在整个教学过程中。在“因需施教”的教学内容安排中,不断的将“教”和“学“的传统教学模式进行提炼分析,尽量做到以“学生为中心”的教学模式。在这样的教学中,学生会不断地在教学案例的设计中获得成就感,这样就可以大大地激发他们的求知欲望,从而逐步形成一个实践能力培养的良性循环,同时还能培养学生们的独立探索、勇于开拓进取的自学能力。在进行实践课程的教学上,需要充分发挥学生们的主观能动性,教师基本上只是讲解基础知识点,不断的启发学生,鼓励学生在项目开发中积极应用学到的基础知识。例如,可以将《网页设计与制作》课程的总任务确定为开发一个企业的网站,同时根据涉及到的相关知识点,将课程总任务划分为若干个子任务,每个子任务再根据知识点划分为若干个由基本知识、基本操作构成的实验任务[2]。
4.3基于用户体验的教学网站建设
现阶段,网页制作课程在教学设计上学时量较少,然而,对这样的实践性要求高的课程,必须通过大量的课外练习才能达到较好的学习效果。由此可见,可以采用基于用户体验的教学网站设计,来达到快速吸引学生眼球、发挥课程网站对课程教学的作用。并且在教学网站内容安排上,既要有课堂教学内容,还必须结合课程安排大量有趣、巩固知识内容的课外练习。同时,这种用户体验式的教学网站也可以穿插一些基本的知识点。在课程网站教学的过程中,都基本上能能够体现网站采用的知识点,学生在通过课程网站学习的同时,也学习了网站的制作方法,从而增强课程网站对学生的吸引力。
4.4基于认证的课程培养模式
网页设计师不仅IT专业企业需要,广大的非IT企业也需要,就目前来看,社会对网页设计人才需求量是很大的。根据学生对网页设计课程的学习实际,努力培养学生能够从事网站开发、WEB技术等方面专业技能的IT高级专门人才。同时,可以根据目前网页设计认证方向为衔接点,鼓励学生参与考证,并且可以将ADOBE网页设计认证作内容作为培养方向,在实际的教学内容、网站设计中穿插一些网页认证的教学设计,起到以点带面、提高学生就业能力和水平的作用。通过对网页认证知识的学习,促使学生不仅能学到社会接轨的信息,还可以通过参加相关的认证考试,获得相应网页设计认证证书,从另一方面提高学生的专业技能和就业能力[3]。
4.5通过与企业的合作,增强学校办学活力
通过国际认可的专业认证制度,专业认证需要专业和职业有着非常密切的联系,在确保企业需求的前提下,可以确定人才培养的方向,并在这一过程中建立的专业认证标准,需要企业部门的专家的参与。
5结束语
经过多年以来对网页设计的教学,从中发现这门课程改革最重要特点是,一定要和社会需求相联系,同时培养的学生要适应社会就业需求,并且课程定位要明确与相关岗位技能全面接轨。同时,随着网页技术的发展和进步,网页设计与制作课程的教学也应当与时俱进,不断的改革和创新,还要加强与相关合作单位的实际交流,在整个教学过程中,教师也应不断的学习新的教学理论,不断更新自我的教学方法和教学手段,才能胜任专业课程的教学工作,为社会培养高素质的技术应用型人才。
参考文献
[1]李海燕.基于项目化的“网站规划与网页设计”课程教学改革初探[J].电脑知识与技术,2010(6).
[2]王愉,潘明明.响应式网页设计初探[J].北京印刷学院学报,2014(3).网页设计课程总结篇7
1课程现状
传统的教学和考核方式虽然学生也能掌握其中的知识和技能,但是综合运用能力不强,学期结束时,能设计出符合要求的网站的学生可谓是凤毛麟角。将目前课程教学现状归结如下:在教学内容方面,往往侧重于讲解Dreamweaver软件或相关软件的使用方法,教学内容零散、陈旧,没有很好的融合。结果是虽然学生能熟练运用网页设计与制作的相关工具,而且用的很熟练,但是就是不能独立地进行网站的规划与建设。即使是完成的作品也达不到应有的功能效果和视觉效果。这种课程内容上“重知识、轻应用”和“重技术、轻设计”现象,容易导致学生眼高手低,做不出东西,不利于学生从全局的角度进行网站的开发与设计。在教学方法方面,教师先进行理论讲解,然后安排学生上机,这种方式在传统课程中有它的存在价值,但是在《网页设计与制作》中,教学内容广,所使用的软件工具较多,容易造成教学与实践相脱节。在考核方式方面,少部分采用传统的闭卷考试方式。闭卷考试经过多年的实践应用,在考试题型、考试内容、考试成绩评定等方面都较为成熟。同时闭卷考试也有利于学校组织和管理。但是,闭卷考试多以书本知识为主,重视学生对书本知识的记忆,忽略了对能力的考核。大部分采用考查方式,要求学生自主选题,制作完整的网站。这种考试方式能综合考查学生对软件的应用能力和一定的设计能力,也能全面体现学生对课程知识的掌握程度和综合运用能力。但是,学生选择的主题范围狭窄,大部分学生完成的是个人网站的制作,而大部分网站又是学习内容的堆砌,不懂得选择与舍弃,技术含量不高,更寻找不到设计的闪光点[1]。
2课程改革思路
在《网页设计与制作》课程的教学中,确立以学生为主体、教师为主导的意识,通过调整课程开设内容、加入科学的教学方法、采用合理的考核方式,面向应用,重视实践,培养学生网页设计与制作的综合技能和素质,培养学生学习的主动性、创新思维和合作精神,从而提高个人的综合竞争力和适应力。
3教学内容
由于计算机技术发展迅速,网页从单一的文字信息,到图文并茂,再到现如今包括Flash、音频、视频的多媒体交互及其它APP应用程序等。所以在教学内容上应该革新,体现技术的先进性、前瞻性和延续性。在《网页设计与制作》课程的教学中,本着“从浅到深、从基本到综合”技术与理论相结合的原则,对教学内容进行合理地整合和模块的划分(如表1),分阶段实施教学,并及时更新,从而将最新的技术融入到教学中,激发学生的学习兴趣并形成持久的学习动力。《网页设计与制作》课程侧重于讲解静态网页,为今后动态网页的学习打好基础。所以,教学内容采用社会流行的网页三剑客(Fireworks+Flash+Dreamweaver)。Fireworks实现对网页界面的设计以及GIF动画的制作,Flash用于动画的制作,Dreamweaver主要用于网页的整体框架及布局。
4教学方法
为了提高《网页设计与制作》课程的教学效果,在多年的教学过程中,我们从理论教学、实践教学、课外加强三个环节进行探索,将课程的理论性、技能性、应用性以及审美性结合起来,贯穿于整个教学过程。在教学的各环节中,精心准备多媒体教学课件,使学生能够更好地分析和解决问题。
(1)理论教学:采用引导法、启发法、命题法、案例分析法、案例扩展法、现场网页制作和学生课堂讨论等多种教学方法,教师将简单问题情趣化、复杂问题生活化、综合问题步骤化,主要表现为:教师讲解要求学生掌握的知识点,演示知识点在实际项目中的应用结果,引导学生将理论知识与行业实践结合起来,逐步培养学生的设计思维。
(2)实践教学:采用项目驱动方式,以项目开发为主线,以网页效果制作为载体,培养学生对整个课程知识的融会贯通能力、培养学生项目开发的能力和解决实际问题的能力。以学生动手为主,教师指导为辅的方式,教、学、练相结合,教师讲授约1/3的时间,学生按教师讲授的内容和要求进行实践,在此过程中教师则对学生进行辅导,如遇多数学生都存在的问题,则进行集中演示讲解,最后留10分钟左右的时间对本次的实践情况进行总结,让学生能够及时的解决遇到的问题。
(3)课外加强:开展优秀作品赏析,对作品进行欣赏和评价,提高学生的审美观念和鉴赏力,启发学生的创新思维,吸取和借鉴优秀作品的相关元素加以合理运用。提倡开展学生个人作品交流,让学生分享学习中的新发现和新知识的运用,作品的制作心得,加强了学生对学习的主动性。开展教学成果展览,对于优秀的作品进行收藏,极大提高了学生的自信心和成就感。
5考核方式
《网页设计与制作》是一门实践性很强的课程,属于考查课,所以要注重学生实际应用能力的考查。转变一次性考试定成绩的做法,总成绩由平时成绩(占60%)和期末成绩(占40%)两大部分构成。平时根据知识内容的特点分阶段进行不同方式的考核,对于HTML语言部分,采用笔试(闭卷)方式,以基本理论为考核对象,反映个体掌握基本知识的程度。而对于Dreamwever部分,采用上机考试方式;Flash部分和Fireworks部分,以平时作业方式考核,不仅反映学生所学知识水平,而且考核学生动手实践能力、创新思维等多方面的能力。期末以网站项目为考核对象,学生每四个人组合成一个团队,模拟客户的身份提出某个网站平台的制作要求,给出网站设计任务书,并完成一个网站的开发制作,最后由代表进行作品演示和现场答辩,这样既考核了学生知识的综合掌握和应用能力,又考核了学生的表达能力、与人沟通的能力和应变能力。通过这样的全方位多层次的考核最终综合得出学生的课程成绩。这种做法能够较好地化解学生为了应付考试进行期末冲刺的做法,较一次性考试更能反映出学生经过该课程学习后获得的知识和能力。网页设计课程总结篇8
关键词:《网页设计与制作》课程;项目教学法;可行性分析
《网页设计与制作》这门课程是职业学校计算机专业的重要课程,在信息技术的发展和互联网普及的今天,计算机相关专业特别火热,《网页设计与制作》这门课程显得尤为重要。计算机网络专业如此受到欢迎,而职业大专院校关于计算机网络方面的教育教学同样显得尤为重要,如何结合计算机信息技术的发展,教育事业的发展背景,开展有效的教学活动成为重中之重。下面笔者简单介绍了什么是项目教学法、项目教学法的实施优势、如何推进项目教学法的有效开展,希望能够为广大职业学校从事计算机专业教师开展教学活动产生一定的启发。
一、项目教学法概述
(一)什么是项目教学法
项目教学法从字面上理解,重点应该放在“项目”上,它是把教学任务分为若干个模块,循序渐进地解决复杂的实际操作问题。对于《网页设计与制作》课程,运用项目教学法更多的是偏向于实践操作,把学生作为主体,教师在课堂当中扮演主导的角色,通过教师的指导,学生收集信息资料,以小组的形式共同研究,解决问题,完成任务,得出结论,最终掌握熟练的基础理论知识与操作技能[1]。
(二)项目教学法的实施优势
1.教师充当主导作用,能够充分激发学生的学习兴趣。项目教学法的使用能够从一定程度上削弱教师的作用,这里的削弱不是完全意义上的削弱,更是角色上的转变,师生之间的角色转换。把传统的教师问和教师讲的教学方式,转变为教师加以指导,在教师的指导下,培养学生独立探索思考,合作学习交流的能力。2.充分发挥学生的主观能动性,养成自主学习的能力。学生是教学活动的主体,对学生主体地位的高度重视,充分体现了重视确立学生的主人翁意识,而教师在其中扮演引导协助的角色,更像是引领学生进入《网页设计与制作》这门课程知识花园的导游。教师将项目教学法与任务驱动法结合起来,为学生布置任务,在完成任务的过程中养成自主学习的能力,在过程中遇到难以解决的问题,向教师与其他同学询问,从而加强与他人沟通能力,加强团结合作,充分发挥主观能动性[2]。
二、如何在《网页设计与制作》课程中有效运用项目教学法
教师视情况而定,可以按照或者不按照教材上的内容进行教学设计。但总体来说,职业学校的学生已经成年,思想成熟,对客观世界有了一定的认识,也具有独立自我思考的能力,所以其教学活动的开展不应该局限于教材,照抄照搬,而是在设计教学任务的过程中加入学生感兴趣的内容,可以将学生按照一定的比例平均分成若干个组别,把知识点分为若干个项目,每一个项目布置一些任务,学生以小组讨论的形式,解决每一个问题,然后在循序渐进中掌握知识。网页是网站最基本的组成要素之一,人们上网浏览信息是通过网页上的内容来了解的,网页又分为对话框、指令等很多要素,一个制作精良的网页总是能够给人一种耳目一新的感觉,吸引人们的注意力与好奇心,从而促使人们点击网页进入网站,增加这个网站的点击率,所以教师要经常反复为学生讲解学习《网页设计与制作》这门课程的重要性,以及网页在网站中发挥的重要作用,从而使学生激发学习兴趣,投入到“我要学”积极的学习状态中[3]。教师特别注意网站主题的选择,网站主题符合年轻人的特点。这里以一个音乐网站的制作为例,我们都知道一个网站的网页上的功能越强大,越来越吸引人们的注意,所以教师为学生布置任务,就拿首页上的网页内容来说,第一点让学生想出最基本的网页主题,如新歌排行榜、歌手、分类等一级主题,待主题确定下来以后,学生再集思广益讨论如何使网页看起来美观,联想出更多的艺术手法,使网页的设计具有充分的审美效果。综上所述,随着计算机与互联网的普及,各大职业高校的计算机专业受到热捧,《网页设计与制作》也成为计算机专业的必修课程。随着计算机专业教学活动的开展,在《网页设计与制作》课程中项目教学法越来越受到教师的青睐,为此项目教学法更应该被广泛应用,以便为计算机信息技术与互联网的普及与发展培养更多高素质专业人才。
[参考文献]
[1]杨丽华.项目教学法在《网页设计与制作》课程中的应用[J].电脑知识与技术,2011,(34).
[2]仇闽霞.项目教学法在“网页设计与制作”课程中的应用[J].科教文汇(上旬刊),2012,(01).网页设计课程总结篇9
【P键字】 行动导向课程设计网页
一、了解工作过程,制定课程主要内容
行运导向课程是基于工作过程的,《网页设计与制作》相关内容是网站建设的,有必要先了解网站建设的基本工作过程,其过程为:(1)对网站进行需求分析;(2)网站地图规划;(3)网页结构设计;(4)网页美工设计;(5)网页素材收集;(6)网页代码编写;(7)网站测试和以及上线;(8)网站运行维护。要完成上述的工作过程需要多门科目的相关知识与技能,比如“网页美工设计”就需要photoshop知识,“网站上线”需要用到服务器、域名等知识。因为课程时间有限,就必需对工作工过相关知识有所取舍和有所侧重,在《网页设计与制作》课程中,将网站地图规划、网页结构设计、网页代码编写这三个内容作为主要内容,如果学生有一定的photoshop基础技能,可将网页美工设计和网页素材收集这两个过程纳入课程的教学中,如果学生没这些基础,则无须花太多时间在本课程中讲解和练习,在网页结构设计中采用草图,在美工设计中教师可直接给出相关的素材。
二、了解工作岗位,制定课程的培养目标
与本课程相关的常见岗位有:(1)网站设计员;(2)网站美工制作员;(3)网页前端开发员;(4)网站后台程序开发员;(5)网站维护员。其中网页前端开发的工作量是最大的,因此在课程设计中将网页代码编写作为重点知识与技能。根据工作岗位的情况,设置了三个培养目标:知识目标、能力目标和情感目标。
2.1知识目标
知识目标是传统教学模式中为学生制定的学习目标,它是弊端是学生掌握了基础知识后却不会应用在工作中,但学习基础知识是为了有能力去完成任务,知识目标是基础,不应被忽视,现将本课程知识目标制定如下:
(1)了解网站开发的工作过程;
(2)掌握网站地图及网页结构相关知识;
(3)掌握HTML基本标签的使用;
(4)掌握表格布局、框架网页、层的布局等知识;
(5)掌握模板和库的使用;
(6)掌握CSS的样式的定义、设置及应用;
(7)掌握Javascript、JQuery脚本语言的使用。
2.2能力目标
基于工作过程的教学方法非常强调动手能力,在学完某一课程后,是否有能力去完成相关的工作,是否有能力去胜任相关的工作岗位,现将本课程能力目标制定如下:
(1)能够设计网站地图及网页结构;
(2)能够通过HTML、CSS及JS等代码实现网页。
2.3情感目标
情感态度指兴趣、动机、自信、意志和合作精神等影响学生学习过程和学习效果的相关因素以及在学习过程中逐渐形成的祖国意识和国际视野。制定合理的情感目标,保持积极的学习态度是学习成功的关键。
(1)培养学生独立进行系统分析、设计、实施、评估的能力;
(2)培养学生获取、分析、归纳、交流、使用信息和新技术的能力;
(3)培养学生自学能力、理解能力与表达能力;
(4)培养学生口头语书面表达能力、人际沟通能力;
(5)培养学生计划组织能力和团队协作能力;
(6)培养良好的心理素质和克服困难的能力。
三、传统讲授与行动导向相结合的教学模式
课程的教学模式主要分为两大部分:
第一部分为基于教师讲授的传统教学部分,主要内容有:
(1)网站及网页概述与开发步骤;
(2)网站地图及网页结构;
(3)HTML语言与CSS样式基础;
(4)Javascript、JQuery基础。
第二部分为行动导向教学模式,通过已掌握的基础知识及开发过程中获取的技能完成案例网站的开发,以网站完整的开发过程为案例,这样可以让学生了解一个网站的开发流程,主要内容有:(1)网站地图的设计;(2)网页结构的设计;(3)网页内容的实现。
之所以在本课程中加入教师讲授这种传统的教学方法,是因为在以往的行动导向课程中发现,直接进入案例的行动导向教学,学生在刚开始接触这门课程时是没有相关的基础知识,学生就需要从大量的知识中找到任务所需的知识,这犹如大海捞针,所以一个任务完成,学生不知道要学哪些知识,打击学生的积极性。
教师以传统的讲授教学模式进行,从而缩小学生自学知识点的范围,减少学生的迷茫,减轻学生在行动导向过程中的学习负担,提高汇报知识的准确性,提升学生学习兴趣,增加学生的成就感,让学生快乐地学习。
讲授法虽然能让学生掌握知识,但无法让学生将所学的知识转化成技能,无法胜任工作岗位对能力及情感的要求,应用到网页开发工作过程当中,故因将课程的重点放在案例实施的过程中,以行动导向教学模式为平台,让学生掌握完成网页实现的方法,有能力完成案例中的网页,并能将技能扩展到其他网页设计与制作中。但仅仅一个网站的案例无法完整展示该门学科的知识,需要在课堂练习及课后练习补充相应的小案例,以完善课程的知识结构。
四、细心地设计各小案例
教师在每次课前都应细心地设计每个小案例中的教学任务,每个小案例的教学任务应注意以下几个方面:
(1)在每个小案例中都应体现知识目标、技能目标与情感目标,在不同的案例中运用相关的技能实现网页的制作,需要让学生有完成任务的技能,还要让学生掌握完成任务的方法,因为课堂所学的知识与技能在现实的网页制作中是不够用的,学生只有即掌握技能又有方法获取新的知识,才能胜任网页设计与开发的岗位。
(2)同一小案例中安排不同层次的任务,对于前期知识与技能掌握较好的学生提出相对复杂的任务,对于掌握较差的学生提出相对较简单的任务,无论哪种难度的任务都能完成本案例,鼓励学生完成复杂的任务,实在困难先完成简单的任务,在课后再完成复杂的任务,这样即能让知识较差的学生学习该案例中的知R技能与方法,提升他们的积极性,又不妨碍较好的学生对更高层次知识技能与方法的掌握。
(3)任务相关知识的扩展与提升,比如:某个效果可以用多种方法实现;某个方法可以在不同的效果上实现。行动导向教学强调的是知识与技能的迁移与应用,在设计小案例时应将相关知识与技能的扩展提示给学生,培养学生自学能力与理解能力。
(4)注重学生的自我总结与分享,每个小案例完成后,让学生分享通过本任务中所学的知识与技能,任务实施过程中所走的弯路,分享能够培养学生进行总结的良好习惯,提升学生口头语书面表达能力、人际沟通能力。
(5)教师的教学行为重点放在课程准备教师点评。在传统的教学方法中,以教师讲授为主,学生是被动学习知识,在行动导向教学模式中,学生是主体,学生主动学习,教师从旁辅助。但并不是说教师的工作并不重要,一堂好的课,需要教师在课前精心地准备案例、课堂流程,才能更好地引导学生去掌握知识与技能,教师在点评中即可以表扬学生,增加学生的自信心和成就感,也可以评价学生完成任务时的方式方法的正确性,更主要的是能完善学生学习与总结过程中知识与技能的不足,并提出任务的相关扩展知识与应用。
(6)通过学生工作页引导学生进行任务实施,在完成相关任务或习题后,达到该次课的教学目的。
以“用CSS制作弹出菜单”课题为例,学生前期已经学习了HTML列表标签与CSS浮动,学生只需要找开所需的“:hover选择器”与“display属性”的使用方法,这个任务学生是可以通过自学完成的。
这个案例的操作技能非常简单,因此本堂课的重点与难点并不在操作技能的掌握上,而是在培养学生“遇到未掌握知识时如何解决问题”的情感能力上。
(1)制定的学习目标为:知识目标,掌握:hover选择器与display属性的使用;能力目标,能够通过CSS样式实现菜单显示与隐藏;情感目标,培养学生“遇到未掌握知识时如何解决问题”的能力。
(2)教学方法采用行动导向教学模式中的任务驱动法,有布置工作任务、任务分析、任务实施、展示与评价、教师讲解、教学小结、作业布置七个教学过程,其中任务实施过程由学生通过电脑自己网络上的相关知识,并应用到本堂课的任务中,以学生自主学习为主,教师引导为辅。
(3)学生工作页任务流程:
①有哪些功能尚未实现?应该怎么办?
②请问你查找知识的途径是?
③本次任务中的关键代码是什么?
④请简述关键代码的作用。

请在电脑上编写本次任务所需的代码。
(4)采用两种难度的任务习题,在较难的习题中,要求学生先用前期学习的列表标签及浮动属性制作静态导航条,并在适当的地方加入“:hover选择器”与“display属性”就可完成本堂课任务,在较易的习题中,已经将列表标签及浮动属性的代码编写好,只需在适当的地方加入“:hover选择器”与“display属性”就可完成本堂课任务。学生可根据自身的情况选择用何种难度完成本次任务
(5)提示学生进行两个方向的知识展,第一个扩展方向:弹出菜单功能除了可以用CSS样式制作,还可以用哪些技术制作(扩展知识点:Javascript、JQuery等脚本语言);第二个扩展方向:“:hover选择器”与“display属性”还可以实现哪些效果(鼠标滑过图片放大显示的相册效果等)。
(6)要求学生对本次任务的完成经过进行汇报。
(7)教师点评与总结,表扬完成得较好的学生,鼓励尚未完成的学生,并重点讲解“:hover选择器”与“display属性”与“遇到未掌握知识时如何解决问题”的方法。
以行动导向教学模式为主导,通过本课程的学习,学生具有网页设计和制作工作最基本的知识与技能、具备较高的职业素质,能基本胜任各公司的网页设计师和网站管理维护等岗位工作。
参 考 文 献
[1]林姗,刘罡.基于行动导向的课程教学模式改革.[J].计算机教育,2015,16(44-48)
[2]苗树红.基于学案导学的行动导向教学探究.[J].中国职业技术教育,2015,05(79-81)网页设计课程总结篇10
关键词:任务驱动法;自主学习;创新设计
中图分类号:G712 文献标志码:A 文章编号:1674-9324(2016)46-0185-02
一、课程的背景
《移动互联网站运营与管理》课程是一门理论与实践一体化的课程。在学习本课程前,需要学生掌握一门网站开发语言和软件工程的一些基本知识,通过一个完整的网站运行项目培养学生能够从事网站推广、可用性分析、评价、维护、数据分析和管理等的职业技能。同时注重培养学生自学及与他人沟通、团队合作的能力,通过学习引导学生思考问题、分析问题、提出问题和解决问题,培养学生的网站建设能力和文档编写能力,培养学生有计划地完成任务的能力,为其将来从事网站运营工作打下一定的基础。
二、网站运营与管理的工作流程
本课程通过一个网站设计,把网站的运营与管理知识、技能穿插在课程中,让学生通过课程的学习,掌握网站从开始的设计、开发到最后的推广等知识和技能,同时注重学生的沟通、团队合作能力、文档撰写能力、规范意识等职业素养的培养,有利于学生的可持续发展。网站运营与管理工作流程如图所示。
三、任务教学活动课的教学活动设计
在网站设计这个大背景下,教师需要设计不同的任务,完成教学目标。本次课程设计就是针对head标签展开的。
1.分组教学。组织学生课前进行自学,老师也可以根据学生特点适当调整分组情况。为的是培养学生的表达、聆听与沟通能力。
2.教学任务设计。在《网站主页运营与推广技术(head标签设计)》这个单元课程中,整体教学思路设计围绕一明一暗两条主线展开:即教师教学为明线、学生活动为暗线。具体的教学任务有6项:
任务1:发现问题,引出知识。在百度上输入一个关键字,查看至少两个网站主页的head标签,说出为什么这些网页能够被搜索出来。
任务2:通过总结,学习知识。学习head标签中,title和meta标签格式及设计。
任务3:引发思考,进一步学习。通过网站排名(查看排在百度第1页和排在第10页的网站主页title标签和meta标签),学习关键字的设计技巧。
任务4:小组讨论,确定head标签(主要是title和meta标签)。写出自己的title标签和meta标签设计,两人一组进行讨论,确定最终的设计。
任务5:完成网站主页title和meta标签设计。把最终确定的内容写进主页title和meta标签里。
任务6:拓展学习。通过观察和网上资料的学习,让学生说出还能进行哪些设计,帮助网站推广。
四、具体的教学实施
任务1:发现问题,引出知识
教学方法:引导学生实际操作,尽量找到答案,同学积极主动回答问题。
教师活动1:通过文档给出任务:在搜索引擎上输入一个关键字,要求学生在5分钟内下载两个网站主页,存成html格式,并分析文档标签,找出能搜索到这些网站的原因。
学生活动1:上网搜索网站并下载,查看标签,分析哪些标签里出现了自己输入的关键字,展开讨论并总结。
理想结果是:学生自己得出结论:head标签中的title和meta标签中含有输入的关键字。
任务2:通过总结,学习知识。
教学方法:引导学生观看课件,同时注意思考标签格式。
教师活动1:引出SEO概念,以及站内SEO对网站推广、运营的重要性,播放课件让学生观看,系统学习知识,引导学生注意观察标签格式。
学生活动1:观看课件,思考title标签和meta标签的书写格式。
教师活动2:讲授title标签(网站标题)的设计,老师采取举例法和观察法,诱导学生说出正确的网站标题设计。
学生活动2:修改自己网站的title设计;这里需要埋下一个伏笔――现在的设计还不是最终课程目标的设计。
教师活动3:讲授meta标签对SEO比较重的keywords参数和description参数,讲授keywords的设计,讲授网页的描述的设计description。
学生活动3:修改和添加自己网站的meta标签设计。
引导学生思考:description参数内容会出现在搜索引擎的什么位置?(以百度为例)
任务3:引发思考,进一步学习
教学方法:学生分组讨论,找出老师问题答案,巩固所学知识。
教师活动1:通过网站排名第1页和第10页的网站主页title标签和meta标签分析,学习关键字的设计技巧;关键字应该怎样设计?设计几个?关键字多长合适……还要引出:热关键字、冷关键字、蓝海关键字……
学生活动1:学生学习相关知识要点,总结关键字的设计技巧。
学生活动2:思考刚才自己设计的title和meta是否合理,以小组为单位相互指出设计优点和缺陷。
任务4:小组讨论,确定head标签
学生学习能力:能正确阐述自己观点,善于听取他人建议。
教师活动1:聆听几组学生讨论,指出学生设计中的不足。
学生活动1:查看小组同学的标签设计,通过讨论找出区别,根据讨论确定小组标签设计方案。
任务5:完成网站主页title和meta标签设计
学生能力:学生编写、设计标签能力的培养。
教师活动:巡视学生实际操作过程,对常见错误进行纠正,相关问题进行解答。
学生活动:独立完成标签修改和编写。到目前为止,设计内容已经达到本课程要求。
任务6:拓展学习
教学方法:老师给出课件、自学网址,巡视回答学生问题。
教师活动:简单讲授meta标签name属性和http-equiv属性的其他参数设计,掌握这些参数对设计对网站推广的益处。
学生活动:完成自学任务,根据自己网站设计内容进行meta标签再设计,与同组同学讨论参数设计内容,听取他人意见,做最后的补充、修改。
课后记:
本次课程依托上次完成的网站设计内容为背景,从排名靠前网站head标签中发现问题,寻求提高自己网站排名的方案,获取相关知识和技能,最后对网站相关标签进行修正和完善。学生对自己设计的网站主页非常熟悉,这种任务的层次引入的方式更容易让学生进行知识的迭代学习,理解各个知识技能点之间的关联和区别。学生完成情况良好。
授课过程中采用了以现场网站下载观看head标签的形式展开,一步步引导学生;以学生为“主体”,老师为“主导”,双主的教学模式。增加了大量的学生讨论以及自主学习的时间。这种授课方式课前需要做大量的资料准备工作,包括自学网站地址、任务单等都要齐全,增加了备课的时间,同时最大的难度在于课堂的组织,由于学生自主学习能力参差不齐,如何调动多数学生参与学习,在实际操作中还要进一步研究和尝试。
五、结束语
自主设计网站主页的head(主要是title和meta)标签,通过真实网站标签查询开展教学,教学效果应该会适合学生发展。学生的学习有个体差异,老师只要精心设计教学,就能通过活动让每个学生有收获,进而逐步提升学习自信心,从而为以后学习打下基础。
参考文献:
[1]吴泽欣.SEO教程[M].北京:人民邮电出版社,2009.

我要回帖

更多关于 网页布局设计 的文章

 

随机推荐