精品课程网站动态生成平台的设计与实现

孟 燕 邓良太 张 晶 傅 霖

摘要:本文提出了一个精品课程网站动态生成平台的设计方案,分析了系统的工作流程、功能和主要实现技术。利用本系统开发精品课程网站,能够简化网站制作的流程,使教师在很短的时间内建成符合评审指标且具有个性化的精品课程网站,大大减轻了教师和教育技术人员的工作量。

关键词:精品课程 动态生成平台 设计与实现

中图分类号:G250.72 文献标识码:B 文章编号:1673-8454(2009)21-0039-04

精品课程是具有引领、示范和辐射作用的课程,精品课程建设工程于2003年由教育部启动,随后在全国各省市、全国各高等院校铺开建设,截止到2008年已建成国家级精品课程2200多门。按照教育部的要求,精品课程的内容要全部上网,因此精品课程网站的建设成为了精品课程建设中一个不可或缺的环节。

精品课程网站的制作包括页面布局的规划和界面的设计、程序代码的编写、后台数据库的操作、信息内容的整合、网站发布等环节,是一项重复而繁琐的工作,有一定的技术难度,需要掌握网站制作方面的知识和技术。学科教师教学科研工作量一般都比较繁重,如果要他们在较短的时间内制作一个专业化的网站,则勉为其难。正是基于这样一种考虑,如果能开发设计一个用于创建精品课程网站的平台,让教师只需要简单的操作就可以建立一个精品课程网站,无疑会受到教师的欢迎。

一、系统的开发目标

1.遵循精品课程的评审要求和制作规范

本平台的开发是按照教育部2008年国家精品课程评审指标的各项要求制作的,使教师在制作网站的过程中有据可循,减少了教师的工作量并且使教师制作出来的网站符合评审指标的要求。系统的开发技术符合W3C标准。

2.简单易用

考虑到精品课程网站是自动生成并且为普通学科教师所用,因而其操作应该越简单越好,要求只要使用浏览器就能在线建立所需要的网站,不需要掌握系统的网络知识,不需要学习专业开发软件,做到没有网页制作经验的教师也能快速上手。如图1所示是利用精品课程网站动态生成平台创建课程网站的工作流程。

3.功能完善

具体功能包括:

(1)banner和版权的管理,包括banner的上传、修改和编辑,版权的修改等。

(2)目录管理,包括网站一级、二级、三级目录的建立、修改、删除与顺序调整。

(3)页面模块管理,包括页面模块的选中、删除、添加、修改、删除其内容等。

(4)界面的管理,包括分辨率的设定、界面的修改、背景图片的上传、选择,菜单栏方向的修改等。

(5)课程内容的上载:具有文字、表格、图形、图像、声音、视频等多媒体添加功能。

(6)其他功能:论坛管理、人员管理、登录日志、网站配置等管理功能,和在线统计分析、访问次数统计、资料上传、时间显示等功能。

4.所见即所得

添加网站内容,编辑各种多媒体要素,就像编辑Office文档一样方便简单。使用所见即所得的编辑器,不需要具有任何标记语言或编程语言知识,通过网络浏览网页的效果和编辑时显示的效果一致,帮教师方便、快捷地对编辑的内容进行修改、排版。如果教师比较熟悉网站的制作,可以选择使用代码的方式编辑,更加灵活方便。

二、系统的设计

1.系统设计原则

实用性原则:系统的总体设计原则是从方便教师的角度出发,采用教师比较熟悉的Web形式,要求界面简洁,操作简单,具有很好的通用性和实用性。

模块化原则:模块化能大大提高系统的可管理性和可维护性,使整个教学系统能成为一个真正清晰明了的有机系统。模块化便于修改、扩充。采用模块化设计后,在维护时可以直接对某一需要改动的模块进行修改,从而能够有效降低网站不断更新带来的麻烦。[1]

交互性原则:建立交互式网站,使精品课程网站具备网络教学的互动功能。为了提高学习效率,促进师生互动,精品课程建设应该建立师生园地(BBS)等互动交流空间,教师定期与学生在线交流,为学生答疑解惑。

2.B/S三层体系结构

系统采用了B/S(Browser/Server)三层体系结构,即表示层、业务逻辑层和数据访问层,其体系结构如图2所示。

表示层负责与用户交互,接受用户的输入并将服务器端传来的数据呈现给用户。该层在应用程序里体现为扩展名是ASPX的页面文件和页面相关代码。业务逻辑层是系统的核心部分,负责处理表示层的HTTP请求并将请求传输给数据层,同时将请求处理结果发给浏览器。数据层位于最底层,以ADO.NET为接口,对数据进行操纵并为业务逻辑层提供数据服务。系统采用三层体系结构,可以分模块组织代码,增强代码的可读性,增加系统的安全性和健壮性,最重要的是便于修改、扩充。

3.系统功能模块的设计

如图3所示。

(1)网站基本信息设定:包括网站名称的设定、界面肤色的更换、界面模块的选择与删除、网站分辨率设定、banner图片的上传和选定、版权信息的设定、菜单栏位置的设定等,主要是针对不同的课程给教师提供自由发挥的空间,以体现网站的个性化。网站基本信息设定界面如图4所示。

(2)新闻管理:使用在线编辑器对主页中的新闻模块进行添加、修改和删除。

(3)导航管理:对一级、二级、三级菜单的添加、修改、删除和调整顺序,一级菜单项主要包括:教学队伍、教学内容、教学条件、教学方法、教学效果、特色政策、申报表格和课程论坛等评审指标中要求的项目,当然也可以根据教师的要求修改或添加。每个一级菜单下可以设置多个二级菜单,每个二级菜单下也可以设置多个三级菜单。

(4)友情链接管理:友情链接是一个可选模块,教师可以根据自己的需要决定是否选用,包括对友情链接的添加、修改和删除。

(5)课程信息设定:这也是一个可选模块,是对课程的简介,可以是文字,也可以插入图片、视频等。

(6)用户管理:包括添加、删除用户,修改密码,查看在线用户等功能。

(7)搜索功能:可以进行站内搜索,方便用户检索相关内容。

(8)留言管理:主要实现对留言的添加和删除,留言板提供一个师生交流的平台,学生可以反馈意见,提出课程建议,增加了系统的互动性。

(9)内容管理:对网站中所有的文章进行修改、增加和删除操作。系统提供了一个基于网页的所见即所得的在线编辑器。通过编辑器编辑的文字、图片等HTML标记输出到页面的效果和编辑时显示的效果一致,让使用者方便地对编辑的内容进行修改、排版。内容管理界面如图5所示。

三、系统实现的主要技术

本系统采用微软.NET框架作为开发平台,开发环境为Visual Studio2008,数据库采用SQL Sever 2005。系统的实现应用了ADO.NET、DIV+CSS、自动生成数据库访问类、在线编辑、Sliverlight和Ajax、流媒体等多种技术,其中自动生成数据库访问类、Sliverlight和Ajax技术的应用是本系统实现的两大特色。

1.ADO.NET

ADO.NET是在.NET编程环境中优先使用的数据访问接口,是一组用于和数据源进行交互的面向对象类库。ADO.NET允许和不同类型的数据源以及数据库进行交互。本平台对数据库的访问就是通过ADO.NET实现的。

ADO.NET的两大核心组件是数据提供程序(Data-Provider)和数据集(Dataset)。DataProvider是一组包括Connection、Command、DataReader和DataAdapter对象在内的组件,其目的是为了实现数据操作和对数据的快速访问。.NET 框架包含两种数据提供程序:一种是SQL Server数据提供程序;另一种为一般的数据提供程序,它可以与任何一个OLEDB数据源通信。DataSet是非连接模式的核心,设计Dataset的目的是为了实现独立于任何数据源的数据访问。因此,它的数据源并不仅仅局限于数据库,也可以从XML文件或自定义的本地数据文件中获得数据。DataSet由一个或多个DataTable对象组合而成,而每个DataTable对象由多个数据的行与列、主键、外键、约束及存放于DataTable对象中的数据关系信息组成,DataSet与现有数据源的交互是通过DataAdapter来控制的。[2]

2.DIV+CSS实施页面布局

界面是本平台很重要的设计要素,平台采用DIV+CSS实现页面布局和各种定位。CSS是英语Cascading Style Sheets(层叠样式表单)的缩写,它是一种用来表现HTML 或XML等文件式样的计算机语言。DIV元素是用来为HTML文档内大块(block-level)的内容提供结构和背景的元素。DIV的起始标签和结束标签之间的所有内容都是用来构成这个块的,其中所包含元素的特性由DIV标签的属性来控制,或者是通过使用样式表格式化这个块来进行控制。[3]

使用DIV+CSS的优势主要表现在表现和内容相对分离,结构清晰,缩减了页面代码,能灵活地控制页面的布局,提高了系统的扩展性、易用性,还使得网站改版相对简单,从而降低了网站改版的成本。

3.自动生成数据库访问类

在通常的系统开发中,每一个数据表都对应一个专门的数据库访问类,包括插入、更新等,而类的编写很繁琐且容易出错。在本系统的开发中,开发人员针对这个问题专门编写了一个可以自动生成数据库访问类的小控件。如图6所示,只要将一个表的CREATE代码拷入上图的本文框中,点击“生成类代码”按钮,就可以在下面的文本框中生成此表所对应的类代码,将代码拷入此表所对应的.CS文件中即可。“生成Insert脚本”和“生成Update脚本”两个按钮是生成表所对应的插入和更新的存储过程代码。此控件的使用可以大大减少编程人员的工作量,提高代码编写的质量和速度。

4.在线编辑

申报精品课程的教师多数都没有网站制作的经验,所以为了便于在网站建设中上传内容,在网站制作后期维护、更新,系统采用在线编辑技术,能够在网页上实现许多桌面编辑软件所具有的可视编辑功能,可以快速填充内容,提高开发效率,也便于教师使用,如图7所示。

在线编辑器不仅支持文本的修改,格式的调整,还可以插入表格、图片、动画、视频、超链接等,使教师能够在可视化的界面上方便快速地上传、修改或删除课程内容,提高课程建设的速度和质量。

5.Sliverlight和Ajax技术

Silverlight2.0是微软于2008年6月发布的一个跨浏览器、跨客户平台的技术,能够设计、开发和发布有多媒体体验与富交互(RIA,Rich Interface Application)的网络交互程序。Silverlight提供了一个强大的平台,能够开发出具有专业图形、音频和视频的Web应用程序,增强了用户体验,同时,它还提供了强大的工具来提高开发人员的工作效率。Silverlight支持C#、JavaScript、Visual Basic等动态和静态语言,支持互联网上最流行的音频和视频格式,使创建输入表格,加载数据,上传二进制或文本信息都变得更加便捷。

Ajax是Asynchronous JavaScript+XML的简写,该技术可以为用户提供更为自然的浏览体验。Ajax提供与服务器异步通信的能力,从而使用户从请求/响应的循环中解脱出来。借助于Ajax,可以在用户单击按钮时,使用JavaScript和DHTML立即更新UI,并向服务器发出异步请求,以执行更新或查询数据库。当请求返回时,就可以使用JavaScript和CSS来相应地更新UI,而不是刷新整个页面,用户甚至不知道浏览器正在与服务器通信:Web站点看起来是即时响应的。

6.流媒体技术

国家精品课程“需在网上提供不少于45分钟的现场教学录像”,这就要求网站能提供流媒体播放功能。流媒体是指采用流式传输的方式在Internet播放的媒体格式,如音频、视频、flash等多媒体文件。与传统的播放方式不同,流媒体在播放前并不下载整个文件,而是将部分内容缓存,使流媒体数据流边传送边播放,这样就节省了下载等待时间和存储空间。要动态实现在线点播,客户端必须能够支持Windows Media Player或者 RealPlayer等常见媒体播放器,用户可交互地选择播放音视频课件,并可对音视频课件实现播放、暂停、停止、跳跃等功能。

四、结束语

在精品课程建设过程中,精品课程网站的建设是一个必不可少的环节。本文提出了一个精品课程网站动态生成平台的设计方案,并在ASP.NET平台上开发出了相应的系统。本系统简单实用,简化了精品课程网站制作的流程,可以使教师在很短的时间内建成符合评审指标并具有一定个性化的精品课程网站,大大减轻了教师和教育技术人员的工作量。本平台在后续的研发中功能还将不断完善,应用的范围也可以从精品课程网站扩大到一般的课程网站,力争做成一个比较通用的网站自动生成平台,在教学中发挥更大的效益。

参考文献:

[1]柳强,胡雪飞.高级英语精品课程网站设计和建设[J].中国教育信息化,2008(3):67.

[2]Kouresh Ardestani.高效掌握ADO.NET——C#编程篇[M].北京:清华大学出版社,2003.

[3]http://baike.baidu.com/view/942429.htm.

[4]马伟锋,雷运发.基于MSHTML的精品课程网站自动生成系统的实现[J].浙江科技学院学报,2006(6):121-123.

[5]http://www.it.com.cn/f/edu/077/12/445198.htm.

[6]陈以海.高校精品课程网站建设探索[J].中国教育信息化,2008(1):52-54.

[7]龚志武.高校精品课程建设的研究与实践[J].现代远程教育研究,2008(1).

[8]郝刚.ASP.NET 2.0 开发指南[M].北京:人民邮电出版社,2006.

[9]郑常青.Web标准化设计——精品课程网站建设几点心得[J].中国科教创新导刊,2007.

[10]http://hi.baidu.com/qihongchao1983/blog/item/6a8ffbcad358c517be09e60a.html.

(编辑:杨馥红)