如何顺利和有效做好网页布局和网页编程的课程衔接

李夏君

摘要：网页布局（Div/Css）和网页编程（C#）作为计算机两门专业课，分别面对前端和后台，侧重有所不同，而且一个是过程性语言，一个是面向对象语言，按时间先后开设。笔者在教学前采取合适战略，教学过程中承前启后，用项目教学实现顺利和有效做好网页布局和网页编程的课程衔接。

关键词：网页布局；网页编程；课程衔接

中图分类号：G712文献标识码：A文章编号：1005-1422（2015）12-0073-02

国家近年来大力发展职业教育，习近平总书记强调：职业教育是国民教育体系和人力资源开发的重要组成部分，是广大青年打开通往成功成才大门的重要途径，肩负着培养多样化人才、传承技术技能、促进就业创业的重要职责，必须高度重视、加快发展。在珠三角洲，IT行业（互联网）的发展需要大批低端工作人员，而中职学校设立计算机专业，目的是为IT行业输入预备和基层人员。网页布局（Div/Css）和网页编程（C#）作为计算机两门专业课，分别在第二第三学期展开教学，但两门课程分别面对前端和后台，侧重有所不同，而且一个是过程性语言，一个是面向对象语言，如何做好课程之间的衔接，让学生从前端走向后台，完成一个网站工作人员的转变，笔者身为计算机专业一线老师，为两门课程之间顺利和有效衔接做出一番研究。

一、按照学习环境和中职学生特征设置课程

中职学生是研究对象，特征是思想未成熟，理论基础不扎实，抽象思维差，学习方法效率低，学习自主性差，但身体和心理处于年轻态，对新生事物敢于尝试，敢于接受，接受老师鼓励和表扬等正能量，有兴趣的科目可以坚持学下去，大多数理科学生心理素质好。学习环境是经过第一学期学习之后，已经完全熟习中职学习环境和规律，从应试教育转变为技能教育，掌握计算机基本使用技能，培育了一定计算机素养，在第二个学期可以展开网页布局的学习。

网页布局，从网页基本操作入手，利用工具Dreamweaver，掌握网页各要素（html标签、表单各要素、模板页）到可以独立完成静态网页的制作，熟习Div/Css的基本概念，并能被用来完成网页布局，期间涉及到网站前端知识。课程要求是：学生可以掌握布局的技能，在给出的页面设计图的前提，可以独立完成切图，并用Div/Css作出具体布局，可以实现二级菜单，并在页面加入flash或JavaScript等广告banner。

当学生熟练前端知识之后，有了理论和实践基础，进入第三个学期的加深学习，正式进入有关后台的学习。针对目前最流行的开发平台Visual Studio和开发语言C#，本校采用了上述环境和语言，要求是掌握Webform的开发，内置对象、表单和控件、SQL server数据库以及一个小型后台开发。制作后台一般有登陆、注册、发布新闻、增加修改删除新闻的功能。在学习过程中，让学生在学习编程基本理论和思路，培育面向对象编程的素养，提高学习的兴趣和自主能动性。为第四学期小组合作完成一个有前端和后台的网站而打下基础。

二、如何做好衔接工作的具体举措

Div/Css属于网页前端知识，Asp.Net属于后台开发语言，如何做好两者之间的衔接，让学生可以从网页前端世界从容进入后台开发，这就是笔者在实际工作中遇到的问题，经过一番研究，特将研究结果列出如下：

1.课前要做好战略上的准备

在所有的网页课程展开之前，做好战略准备。要跟学生陈述清楚本课程的最终目标：无论是前端Div/Css，还是后台的Asp.Net，它们都是为网站而服务的，也是一个完善的网站要包括前端的与客户视觉交互，还包括后台各项核心功能的实现。举个例子，人要有外表和内心才是一个真正的人。按照Web标准提倡的表现、结构和行为分离原则，前端主要体现在表现和行为，后台可以体现在结构和行为。两者要既相互独立，又互相联系。思想在前行动在后，战略目标一旦提出，一切有根有据，有章可循，有理可依。

2.讲授Div/Css要做好启后工作

Div/Css和包含它本身的html是过程性语言，对于初学语言的中职生来说，由于学习者自身有抽象思维不强，逻辑分析能力不够的弱点，Html和Div/Css不失为比较好学的入门语言。学生可以在可视即可得的视图中接触语言编程过程，既可以学习编程的基础知识，又可以培养编程的长期兴趣。不过，Div/Css不过是中期目标，也是中介和过渡手段。因为就根本而言，过程性语言有其简单易用的优点，也有提炼不够，封装不够好的缺点，面对复杂多变的编程世界，还是需要面对对象语言来提炼，才有更好的可读性和可扩展性。好比一个人光有学会数数和算数其实不够，还需要更多数学知识才能对现实进行归纳。光有前端而无后台网站，很难吸引浏览者长期的兴趣，生命力不强。

3.讲授Asp.Net要做好承前工作

C#是一个语言，.net是一个平台，上面支持用C#语言。C#不但可以开发基于.net的应用程序，也可以开发基于WinForm的程序。C#是事件驱动的，完全面向对象的可视化编程语言。前面说了，一个网页光有缤纷绚烂的前端效果是不够的，还需要功能强大的后台作为持续发展。举个例子，正如人不但要一个美丽的外表，更需要一个强大的内心，才能在人世间走得更高更远。在进入C#学习之前，可以先复习一到两周的Div/Css和JavaScript，做一些简单的复习，才正式进入。复习可以是盒子模型，div页面居中，一级菜单，插入图像，图片列表等。这种承前工作是必须的，才令到C#的学习不显得突兀和生硬。

4.可以用一个网站作为项目教学实习两门课程的衔接

对于职业教育，理论不是最终目标，技能的掌握才是目的，所谓纸上得来终觉浅，百讲不如一练。在讲授中，有个网站可以实现前端到后台的衔接，是最好的教材和最合适的展示。笔者亲自制作了一个网站，可以实现前台的Div/Css布局，JavaScript的动态效果，还有后台的登陆和注册，后台管理页面的展示，密码的修改等功能。在讲授Div/Css的实训阶段，可以将网站界面设计图交给学生进行切图后进行布局，作为项目教学的一部分，增强学生的布局能力，提高学生布局熟练程度；在Asp.Net的实训阶段，将静态网页交给学生之后，再将静态页面转换为动态页面，而且可以将后台分模块：登陆模块、注册模块、后台管理页面模块、密码修改模块、新闻编辑模块和新闻发布模块，完成静态到动态的衔接。在网站不断完善过程中，完成知识讲解和技能训练， 达到以面带点的效果。

5.行动研究证明：衔接带来的效果

笔者从计网13级到14级，通过两个年级6个班的网页布局和编程教学，经过两轮行动研究表明：顺利和有效做好网页布局和网站编程的衔接，有助于提高学生网站前端效果制作能力，增强后台建设能力，为第四学期学生小组合作完成网站打好基础。以下是学生最后网站作品之一。

三、总结

教学无小事。笔者在中职学校已经有15年的一线教学经验，感受到过程比结果更重要。只要能留心日常教学的一丝一毫，发出疑问，经过思考，是可以帮助到学生更好地学习，从而改变思考习惯，改变人生。顺利和有效做好课程衔接，是促进学生学习，提高学习效率的途径之一。本着初衷，笔者继续投入职业教育工作，为国家职业教育事业尽一份力量。

参考文献：

[1]韩琦，张建军.中、高职课程体系的衔接设计[J].长沙铁道学院学报（社会科学版），2014（08）.

[2]周仕德.课程衔接：亟待研究的课程视域[J].教育理论与实践，2010（25）.

[3]胡春光.课程衔接：含义分析、学理基础及主要问题[J].武汉商业服务学院学报，2010（04）.

责任编辑何丽华