精品課程網站動態生成平臺的設計與實現

傅 霖，孟 燕，鄧良太，張 晶

（深圳大學，廣東 深圳 518060）

精品課程網站動態生成平臺的設計與實現

傅 霖，孟 燕，鄧良太，張 晶

（深圳大學，廣東 深圳 518060）

本文從精品課程建設的需求出發，開發了一個精品課程網站動態生成平臺系統.本文介紹了系統的特點、功能模塊，以及ADO.NET、DIV+CSS、Ajax和jQuery等多種實現技術.系統功能完善、實用易用、界面友好，可以提高精品課程網站建設的質量和效率.

精品課程；網站動態生成平臺；設計；實現

1 前言

2003年，國家教育部實施了“精品課程”建設項目，要求利用現代化的計算機網絡和多媒體技術將課程上網并免費開放，以實現優質教學資源共享，提高學校教學質量和人才培養質量.在精品課程建設中，利用計算機網絡技術制作課程網站是一個必不可少的環節.目前，網站開發工具雖然很多，但要利用這些工具設計出高品質的網頁、開發出功能強大的網站，對網站制作技術的要求非常高，一般的學科教師難以掌握.因此，目前精品課程網站的建設一般是由教師提供素材和資料，委托一些I T專業人員進行開發，但這樣存在的問題是，往往開發周期長，費用開銷大，與精品課程要求不完全一致，課程網站的修改和維護難以保障等.本文結合精品課程的要求，開發出了適用的精品課程網站動態生成平臺，以解決教師在實際申報中在網站制作上存在的問題，使教師將精力投入到網上教學內容的更新、教學的應用和實施上，而不用考慮網站本身的制作過程，以此提高精品課程建設的質量與效率.

2 精品課程網站動態生成平臺的特點

本平臺具有以下特點：

2.1 子網站實時生成，并可以即時訪問

精品課程網站動態生成平臺的設計模式采用“母生子”的方式，即由精品課程管理系統（以下稱為母網站）動態生成一個個精品課程網站（以下稱為子網站），如圖1所示.

圖1 精品課程網站動態生成平臺的設計模式

母網站和子網站是相對獨立的兩個系統，他們都擁有各自獨立的數據庫文件、配置文件和代碼文件，并不存在依附關系.每一個子網站之間也是獨立的，都可以下載后配置到另外的服務器上獨立運行.

教師在登錄母網站后，可以在母網站中創建課程網站（子網站），當設置好網站的名稱、IIS路徑、后臺登陸密碼等信息后，母網站會即時“生成”一個子網站，即：將該子網站的源文件解壓到相應的文件夾中，附加數據庫，配置IIS路徑，并提供該子網站的登錄地址，教師可以立即登陸該子網站去設置課程的信息，按照需要建設課程網站.整個生成過程是即時完成的，生成之后的網站可以立即訪問，不需要等待管理員配置網站信息.

2.2 子網站可打包下載，并能獨立運行

母網站和生成的子網站之間是相對獨立的，擁有各自的數據庫文件，代碼文件和配置文件，所以子網站生成之后，就與母網站脫離了綁定關系，子網站和母網站可以在同一臺服務器上運行，也可以將其打包下載后，配置到另外的服務器上獨立運行.

2.3 首頁版面和模塊自主設置

精品課程網站動態生成平臺在對首頁版面和模塊的處理方面，可以自主選擇版面的布局（如1：1、1：2、1：2：1分欄等）和系統的內置模塊（如登錄、最新動態、友情鏈接等），并且在此基礎上加以改進，使教師可以根據自己的需要，自主設置首頁模塊，并設定其名稱、寬度、高度和上傳模塊內容等.

2.4 網站主題風格自主更換，或者根據需要定制所需的主題

為方便教師對網站的整體風格進行選擇，以體現網站的個性化，本平臺內置了多種主題風格，教師可以根據課程的特點選擇主題風格.除此之外，如果平臺內置風格不能滿足要求，教師可以在系統管理員那里另外定制自己所需要的主題風格.

2.5 較強的用戶體驗，操作所見即所得

本平臺在設計過程中，充分考慮到教師的需要，使用Ajax、jQuery等技術處理用戶響應，以增強用戶體驗，具體表現為：教師在選擇了一種主題風格后，整個網站即時變成了所選擇的風格，如果不保存，在退出后又會還原為原來的風格；教師在瀏覽網站時可以根據需要，選擇網站顯示的模式：標準模式或寬版模式，這種選擇是即時響應的；教師在上傳了網站的Banner后，可以拖動滑動條以調整Banner的高度，這種調整也是即時響應的，除此之外，菜單欄的間距、網站顯示的寬度等等也是這種即時響應模式，增強了教師的體驗.

3 平臺功能模塊

平臺分為兩個子系統：管理子系統和動態生成子系統。見圖2精品課程網站動態生成平臺功能模塊圖.

管理子系統主要是給教師提供課程創建、匯聚課程、發布和交流信息等功能，主要包括“登錄”、“注冊”、“新聞”、“課程創建”“課程管理”、“留言板”、“資料管理”等功能模塊.

課程創建者通過后臺登錄，根據需要設置課程網站的界面布局、風格、各級菜單、上傳多媒體內容，就可以動態生成一個精品課程網站.生成子系統主要包括“個人信息管理”、“系統設定”、“菜單管理”、“面板管理”、“留言板”等功能模塊.

圖2 精品課程網站動態生成平臺功能模塊圖

4 平臺的開發技術

系統采用B/S三層體系結構，運用微軟的.Net框架作為開發平臺，開發環境為Visual Studio 2008，開發語言采用C#.系統的運行環境為Windows2003Server，Web服務器采用MSIIS 6.0，數據庫采用SQLsever 2005.系統綜合應用了ADO.NET、DI V+CSS、自動生成數據庫訪問類、Ajax和jQuery等多種技術.

4.1 ADO.NET

ADO.NET是在.NET編程環境中優先使用的數據訪問接口，是一組用于和數據源進行交互的面向對象類庫.ADO. NET允許和不同類型的數據源以及數據庫進行交互.本平臺對數據庫的訪問就是通過ADO.NET實現的.

4.2 DIV+CSS實施頁面布局

本平臺中的頁面布局均采用DIV+CSS實現，實現頁面布局和各種定位，使用DIV+CSS的優勢主要表現在形式和內容相對分離，結構清晰，縮減了頁面代碼，能靈活地控制頁面的布局，提高了系統的擴展性、易用性，還使得網站改版相對簡單，從而降低了網站改版的成本.圖4是系統中教師專區導航欄的布局：

圖4 教師專區導航欄的布局代碼

其在界面中的顯示如圖5所示：

圖5 教師專區導航欄的界面

4.3 Ajax技術的應用

本系統在開發過程中使用了Ajax技術.Ajax是Asynchronous Java Script+Xml的簡寫，該技術可以為用戶提供更為自然的瀏覽體驗.Ajax提供與服務器異步通信的能力，從而使用戶從請求/響應的循環中解脫出來.借助于Ajax，可以在用戶單擊按鈕時，使用Java Script和DHT ml立即更新U I，并向服務器發出異步請求，以執行更新或查詢數據庫.當請求返回時，就可以使用Java Script和CSS來相應地更新UI，而不是刷新整個頁面，用戶甚至不知道瀏覽器正在與服務器通信：Web站點看起來是即時響應的.

4.4 jQuery技術的應用

本系統在開發過程中使用了jQuery技術.jQuery是一個優秀的Java Script框架.jQuery使用戶能更方便地處理HTmldocuments、events,實現動畫效果.jQuery的應用，大大簡化了開發人員的工作，使得開發人員可以更加專注于用戶界面的開發，構建靈活、響應性好和高度動態的基于瀏覽器的用戶界面，達到更好的用戶體驗.

5 界面的實現

精品課程動態生成子系統是一個高度自主化的平臺，課程管理者通過后臺登錄，根據需要設置課程網站的界面布局、風格、各級菜單、上傳多媒體內容，就可以動態生成一個精品課程網站.

5.1 網站主題風格的設定

網站主題風格是指網站整體的色調，目前系統內置了6種風格，即：綠色盎然、藍色大海、藍色天空、淺藍、金色秋天、淺藍水下，供教師進行選擇，另外教師也可以自己設計個性化的主題，滿足教師們多樣化的需求.

5.2 網站基本信息的設定

本系統提供了關于網站基本信息的設定，教師可以根據課程的需要，設定不同的信息，以體現網站的個性化.網站基本信息包括網站名稱、版權信息、管理員郵箱、會話時間、版面寬度、版面位置、banner圖片和動畫、菜單欄寬度、后臺菜單欄的寬度，間距、網站工具條的顯示，效果、頁腳高度，圖片等.

5.3 面板管理

面板是指網站首頁中版面的設定，包括版面的布局、各模塊的添加、刪除等.目前系統默認配置了用戶登錄、新聞動態、最新留言和友情鏈接模塊，教師可以根據需要添加或刪除.版面的布局可以進行自定義，給教師提供自由發揮的空間.

6 菜單管理的實現

6.1 系統菜單的管理

系統內置了首頁、網站系統、留言板、最新動態和站點地圖五個系統菜單，教師可以根據課程需要設置啟用或者禁用，如圖6所示：

圖6 系統菜單頁面

6.2 自定義菜單的管理

系統提供了三級菜單的自定義和管理功能，包括添加、修改、刪除、分離和調整順序，每個一級菜單下可以設置多個二級菜單，每個二級菜單下也可以設置多個三級菜單，如圖7所示。

圖7 自定義菜單頁面

〔1〕李克東.發揮教育技術優勢 促進精品課程建設[C].廣東省高校優質資源建設與應用文集.2009：1-2.

〔2〕李志先.基于J2EE體系結構的精品課程開發平臺的研究與設計[D].西安建筑科技大學，2005：24.

〔3〕李京秀.基于信息技術的精品課程網絡平臺構建研究[D].西安建筑科技大學，2006.

〔4〕朱麗莉，劉跟萍.精品課程網絡通用平臺的設計與開發[J].中國科教創新導刊，2008（10）.

G43

A

1673-260X（2010）08-0045-03