《高职院校网页制作课程的教学研究》由会员分享，可在线阅读，更多相关《高职院校网页制作课程的教学研究（6页珍藏版）》请在装配图网上搜索。
1、高职院校网页制作课程的教学研究一、引言随着互联网的飞速发展， 网页布局的经典模式表格布局， 已逐渐被灵活、加载快速、便于维护更新、代码冗余小的CSS+DIV?局方式所代替。 网页制作是高职院校计算机专业的必修课程，也是实践性强、有市场需求潜力的工具科目，作为高职院校的教师，让学生掌握网页设计的前沿技术， 培养高水平学以致用的网页编写人才， 是教学和研究的主要目标和方向。本文以CSS页面布局为例，研究了如何 安排教学内容以及使用怎样的教学方法才能达到更好的教学效果。根据几个学期的教学和企业反馈， 我们发现传统的教学模式存在不足。 以往教学使用的是理论结合案例的经典教学模式， 以书本为中心，着重讲
2、解书中案例。虽然此种教学模式有一定的优点，即学生可以模仿书本案例步骤进行练习。但由于CSS代码读起来有点枯燥，CSS+DIV技术复杂度也比较高，和表格布局相比较，CSS+DIV局上手相对困难， 尤其对于网页设计初学者， 繁杂的代码往往让人焦头烂 额。 对普通的高职学生而言， 往往更没有耐心去学习这些乏味的代码，即使有些学生按照书中步骤完成了案例， 一旦脱离书本， 对于新的案例将不知从何做起。所以， 传统的教学模式往往事倍功半、难以培养成功。二、从网站分析入手，师生互动、结合实践的教学模式探究在几个学期教学实践、 学生在企业实习以及就业学生的反馈基础上， 我们改造了给高职学生讲授网页制作技术的模
3、式， 强调跟踪主流 的网站设计风格， 从网站分析入手， 先由学生主导剖析网页布局模型，再由老师点评讲解技术解决方案， 并在企业实习和实践中巩固提高学生的网页制作能力。具体教学模式讲解如下。(一)基础知识了解Web页面基础知识，熟悉HTML勺基本结构，了解网页三个主要的组成部分：结构( Structure ) 、表现( Presentation )和行为(Behavior)的含义。网页的结构主要由XHTM和XML实现；通过 CSS1叠样式表实现表现目的，CSS用来定义网页内容的显示样式； 具体行为是由鼠标、键盘等动作所触发的事件，标准主要有DOMC档 对象模型和ECMAScript 等。学生了解
4、了网页的原理，熟悉了 HTMLB基本结构后，才能更进 一步学习页面的修饰，即使用 CSS来表现网页。与此同时，CSSS础 知识要重点讲授。以往做过实验，将CSS础知识融入在CSS页面布 局中来讲， 本以为通过有实际成果的页面布局操作能让学生更容易掌握CSS本技术，但是实践过后发现效果并不理想。因为受到学生理解能力和投入时间的限制， 学生对授课内容的领悟以及预习、 复习和练习不足，省略基础，会让他们不太容易接受，理解较有困难，从而直接影响了教学速度和质量。(二)实践操作导入原先CSS页面布局环节的教学内容，是直接通过CS颈面布局的 案例来讲解，但实践过后，发现学生学起来有难度，因为 CSS+DK
5、 术比较抽象， 并非是完全所见即所得的操作， 它主要还是依靠代码的熟悉度和对整个页面布局的思维轮廓。因此，对这一环节的教学内容作了调整：加入表格布局的介绍。因为表格布局相对简单， 容易理解且易掌握， 虽然表格布局不再是主流， 但学生可以通过表格布局来了解什么是网页布局。 在学生熟练了表格布局后，再介绍CSS+DIV勺布局方式，并让学生分别使用表格布 局和CSS+DIVJ局来实现同一风格的页面，比如一个左右结构的页面， 左侧为竖排导航，右侧为主体内容，如图所示：要求学生通过实验，比较表格布局与CSS局的区别，学生实验 后会很容易发现表格布局页面代码冗长。 接下来， 老师提出更换页面 的风格，要求
6、学生将左右内容进行交换。学生实践后，发现表格布局模式下，需要将左右两列的所有代码进行交换，而CSS+DIVJ局模式下， 只需将两侧 div 模块的浮动属性由左浮动改为右浮动即可， 即将 CSS样式；“float : left ; ;改为;float : right ;” ；。对 比之下，可以发现CSS页面布局技术的优势：内容和形式分离。CSS对于网页就像外衣， 穿上和脱去极为方便， 而更新页面风格只需改动CSS羊式即可达到效果，并且 CSS羊式可以独立于网页进行存储，即 保存为单独的CS成件，一个CS成件可以用于多个网页。当一个大 型网站内有多个子网页需要设置为相同的样式时，就可以将CSS羊式
7、存储为独立文件，每个子网页链接该CS成件，就可以应用其中的样 式效果，很大程度地降低了代码的冗余度。经过一次完整的教学实践周期后， 发现通过这样的教学内容调整，学生能更清楚地了解网页布局技术，在练习中体验了表格布局和CSS布局的区别，体会到了 CSSfiJ局的优越性，并且更好的掌握了CSS局技术。 此实践操作导入部分， 讲述了实践操作初期如何更好地引入主体教学内容。 后期的教学方法及教学内容也进行了改革， 下面将详细阐述主体教学方法部分。（三）主体教学方法1. 教学内容： 由原先以课本案例为中心的教学模式， 改为以书中的教学内容为主线， 着重分析网络上流行网站的布局。 课本中的案例主要让学生通
8、过课外时间来学习， 课堂可作为参考教材， 但书中重点以及难点需在课堂中进行讲解。拿到课堂上进行分析的流行网站的选取并非随机，而是从简单开始，逐步向后加深难度。比如布局模式先从左右两个模块布局案例讲起，逐渐增加布局模块，随着模块的增多，布局的方式也变得多样，虽然页面更精彩，但难度也相应增加，所以基础一定要打好。学习是一个循序渐进的过程，从简单开始，让学生能体会到成功的喜悦， 才不会一开始就积聚了问题， 进而打消他们学习的积极性。 大部分学生总是愿意去学习的， 越是掌握得好越想深入学习，最终才能实现本课程的目标：掌握CSS页面布局的技术。2.教学方法： 在教学过程中， 要降低教师的主导地位， 让学
9、生参与讲课，分析案例的结构模型， 谈谈自己该如何做出布局设计。 老师每次课下课前布置下节课需要学生分析的网站案例， 课堂上， 先请学生针对案例分析自己认为可行的布局方法， 老师对学生的回答进行评价， 然后以学生提出的设计方案进行布局演示， 如果可行， 将能正确显示出布 局结果；如果不可行，再由其他学生指出问题所在，并提出自己新的 布局方案。这样既可提高学生注意力，又能增加学生学习的动力。当然，并不是每次的学生参与都那么理想，对于难度较高的布局案例， 可能没有学生能分析出可行的设计， 这时老师又恢复到主导地位， 通 过相似的更简单的案例来引导学生找到解决方法。另外，如本文由WWw.dYLw.NE
10、i供，第一论文网进行论文代 写和论文发表服务，欢迎光临dYLW.neT医校企合作单位中有网站建 设方面的项目， 就申请让学生去参观和学习， 请教相关的网页设计与 制作人员给学生们讲一讲做一个完整项目的流程以及所需使用的技 术，让学生体会企业对实践人才的要求。如果有可能的话，就让学生参与到企业的网页设计项目中， 更直观地加强对网站建设业务的了解，做到学校教学和企业实践的零距离接触。实践证明，改变了教学方法后，教学效果取得了较大的进步：一是大部分学生积极性的提高， 为了课堂内能正确分析案例， 提出设计方案， 他们在课前仔细预习教材内容， 或翻阅参考书来寻找解决方案；二是学生的学习效果得到提升，因为
11、参与讲课，加深了印象，从而更好地掌握了 CSS页面布局的方法；三是学生整体学习态度的改善，一 些学习积极性高、 能力也比较强的学生， 将自己的学习心得和设计技 巧向同学们展示讲解，他们就像老师的助手，也像同学学习的参谋，让整个教学环节充满了乐趣，学习整体效果得到极大的提高。三、结语经过多学期的实践、教学互动、校企合作以及经验的总结，在讲授CSS页面布局技术方面取得了一定的成效，学生的掌握情况总体呈现提升的趋势， 学生完成的布局设计中优秀作品也不断增多。 网络技术在发展， 课程教学也不能一成不变， 因此要适时地结合课程内容及学生的素质更新教学内容和教学方法， 真正做到让学生学有所得， 学有所成，凭着熟练的网页制作技术走向社会。参考文献：1温谦.CSS网页设计标准教程M.人民邮电出版社，2021.
高职院校网页制作课程的教学研究
