摘要：本文介紹了筆者基于ASP.NET技術(shù)研制出了“Web網(wǎng)站設(shè)計”網(wǎng)絡(luò)教學(xué)系統(tǒng)，該系統(tǒng)充分考慮了教學(xué)過程中的師生行為，融入了傳統(tǒng)教學(xué)的主要環(huán)節(jié)。該平臺支持教師與學(xué)生的交流、學(xué)生與學(xué)生的學(xué)習(xí)交流、作業(yè)發(fā)布與自動批改等?！坝嬎銠C(jī)輔助教學(xué)系統(tǒng)”和“計算機(jī)考試系統(tǒng)”都融入了網(wǎng)絡(luò)教學(xué)系統(tǒng)。

關(guān)鍵詞：Web網(wǎng)站設(shè)計；Internet；網(wǎng)絡(luò)課程

中圖分類號：G642文獻(xiàn)標(biāo)識碼：B

文章編號：1672-5913 (2007) 20-0089-04

計算機(jī)與網(wǎng)絡(luò)技術(shù)的飛速發(fā)展，已經(jīng)逐步改變了面對面獲取知識的傳統(tǒng)教學(xué)方式?；贗nternet的網(wǎng)絡(luò)教學(xué)模式，交互性好，教學(xué)過程可以不受地域、時間限制，而且可以使得教學(xué)資源能在最大范圍內(nèi)實現(xiàn)共享。并且使傳統(tǒng)的以教師為中心的課堂模式轉(zhuǎn)化為以學(xué)生為中心、學(xué)生可以自由選擇學(xué)習(xí)內(nèi)容的新模式，具有知識信息量大、教學(xué)方式生動活潑、聲像輝映、圖文并茂等特點，因此受到了教育界的普遍認(rèn)可和歡迎。國內(nèi)外高校利用互聯(lián)網(wǎng)開展網(wǎng)上教學(xué)正呈現(xiàn)出快速發(fā)展的態(tài)勢，開發(fā)了一大批具有較高的水平的網(wǎng)絡(luò)教學(xué)課程。但是，目前能滿足“高等學(xué)校計算機(jī)專業(yè)計算機(jī)教學(xué)”要求的網(wǎng)絡(luò)教學(xué)系統(tǒng)還不多。為了有效提高“高等學(xué)校計算機(jī)專業(yè)”計算機(jī)教學(xué)的整體水平，我們研制了“基于ASP.NET的“Web網(wǎng)站設(shè)計”網(wǎng)絡(luò)教學(xué)系統(tǒng)”，該系統(tǒng)充分考慮了教學(xué)過程中的師生行為，融入了傳統(tǒng)教學(xué)的主要環(huán)節(jié)。該教學(xué)系統(tǒng)在婁底職業(yè)技術(shù)學(xué)院推廣應(yīng)用一年多來，受到了師生的一致好評，取得了很好的教學(xué)效果。

1系統(tǒng)功能介紹及技術(shù)實現(xiàn)

本系統(tǒng)提供了“Web網(wǎng)站設(shè)計”的全部學(xué)習(xí)課件(教案)、實驗指導(dǎo)書、參考資料、教學(xué)大綱、學(xué)習(xí)要求、查詢手冊和聯(lián)機(jī)幫助信息等多種資源，為教師提供了素材庫、試題庫等備課資源。該平臺支持教師與學(xué)生的交流、學(xué)生與學(xué)生的學(xué)習(xí)交流、作業(yè)發(fā)布與自動批改等。網(wǎng)絡(luò)教學(xué)系統(tǒng)支持案例型學(xué)習(xí)、發(fā)現(xiàn)式學(xué)習(xí)、資源型學(xué)習(xí)、研究性學(xué)習(xí)、協(xié)作學(xué)習(xí)等多種學(xué)習(xí)模式?！坝嬎銠C(jī)輔助教學(xué)系統(tǒng)”和“計算機(jī)考試系統(tǒng)”都融入了網(wǎng)絡(luò)教學(xué)平臺。現(xiàn)將主要功能模塊介紹如下：

1.1電子教程與在線答題

電子教程是“Web網(wǎng)站設(shè)計”課本的電子版本。課本內(nèi)容在數(shù)據(jù)庫中按章節(jié)分類存儲，并將章節(jié)標(biāo)題按順序顯示在教程頁面左邊，直接點擊可以瀏覽相應(yīng)內(nèi)容。在文章內(nèi)部支持HTML和UBB標(biāo)簽處理?？梢圆迦雸D片、頁面、音樂、動畫、窗口等對象，充分發(fā)揮多媒體的特點，使教程生動形象。但應(yīng)注意的是，HTML標(biāo)記不允許在頁面內(nèi)添加，因為要保證腳本的安全性，所以HTML標(biāo)記會被自動過濾。要使用HTML腳本，只能由管理員在數(shù)據(jù)庫管理程序中添加。

另外，針對每章的課后習(xí)題，設(shè)計了在線答題頁面。在線答題部分采用JavaScript腳本語言設(shè)計，由于考慮到課后習(xí)題數(shù)量有限，所以不必要采取從數(shù)據(jù)庫中讀取的形式。在設(shè)計每章習(xí)題答題頁面時，預(yù)先錄入課后習(xí)題及正確答案。當(dāng)用戶調(diào)用在線答題頁面時，JavaScript腳本函數(shù)也一起被加載到客戶端瀏覽器中，當(dāng)用戶答題完畢選擇提交答案時，觸發(fā)JavaScript函數(shù)，對用戶的答案進(jìn)行判斷并給出成績。

在電子教程中，利用管理員賬號登錄后，還可以對當(dāng)前課程內(nèi)容進(jìn)行增添和刪除，使得數(shù)據(jù)庫內(nèi)容可以動態(tài)更改，這為網(wǎng)站的后續(xù)制作提供了很好的可擴(kuò)展性。其他課程也可以通過改變數(shù)據(jù)庫內(nèi)容，來直接使用本系統(tǒng)。

1.2實驗系統(tǒng)

實驗系統(tǒng)分為三方面內(nèi)容：實驗篇、操作測試、基礎(chǔ)知識測試。

實驗篇是針對“Web網(wǎng)站設(shè)計知識”課程的每個章節(jié)設(shè)計出相應(yīng)內(nèi)容的實驗指導(dǎo)，對所學(xué)內(nèi)容如：Web網(wǎng)站的類型和體系結(jié)構(gòu)、Web網(wǎng)站的CI設(shè)計、Web網(wǎng)站的美工設(shè)計、Web網(wǎng)站的圖形圖像和文字設(shè)計、Web網(wǎng)站動畫設(shè)計等給出其基本操作的說明，有利于學(xué)生學(xué)習(xí)操作篇中對每一章介紹的內(nèi)容給出幾個具體的示例，讓學(xué)生可以按照示例內(nèi)容，一步一步操作，熟悉所學(xué)知識。

測試篇以在線答題頁面的形式，給出了關(guān)于每個實驗內(nèi)容的基礎(chǔ)知識測試題。學(xué)生可以在第一時間知道自己的成績。

本部分的設(shè)計采用asp.net腳本語言直接從數(shù)據(jù)庫中讀出對應(yīng)的數(shù)據(jù)來實現(xiàn)。通過對數(shù)據(jù)庫的修改可以很容易的改變實驗的內(nèi)容。

1.3計算機(jī)輔助教學(xué)系統(tǒng)

該系統(tǒng)提供了“Web網(wǎng)站設(shè)計”、“Dreamweaver”、“ASP程序設(shè)計”三個計算機(jī)輔助教學(xué)系統(tǒng)。這三個教學(xué)系統(tǒng)中，有近2000張幻燈片，130余部電影片斷，還有其他滿足教學(xué)需要的各種聲音文件和圖像文件等。這些幻燈片遠(yuǎn)遠(yuǎn)不只是一個單純播放文本和圖像的幻燈片，而是在上面放置了大量“對象”，可以執(zhí)行各種功能。

整個教學(xué)系統(tǒng)圖、文、聲、像、動畫、電影并茂，生動活潑。教學(xué)中能有效調(diào)動學(xué)生的學(xué)習(xí)積極性，使學(xué)生把上課當(dāng)做一種樂趣，一種美的享受。

計算機(jī)輔助教學(xué)系統(tǒng)在技術(shù)上的創(chuàng)新有以下幾個方面：

1.3.1設(shè)計了面向?qū)ο蟮幕脽羝?/p>

在具體教學(xué)中，有大量的“對象”需要做實地演示操作，將這些“對象”放置在幻燈片上，并進(jìn)行相應(yīng)的激活設(shè)置，在播放幻燈片時只需要點一下鼠標(biāo)，即可激活對象進(jìn)行演示操作，與真正的對象操作完全一樣。

1.3.2實現(xiàn)了在對象里書寫講稿

在幻燈片上放置對象，在對象里書寫講稿，可大大減輕教師的備課工作量，更方便了學(xué)生的自主學(xué)習(xí)。

1.3.3在對象里嵌套對象

在具有插入對象功能的對象里根據(jù)教學(xué)需要再嵌套對象，可以增加講課的靈活性。

1.3.4多渠道提供對象工具

在幻燈片上使用了三種方式提供“對象”連接，盡可能地方便教師的操作。

1.3.5多渠道使用超級鏈接技術(shù)

一是將全部幻燈片有規(guī)律地鏈接在一起，從任意一個幻燈片可以進(jìn)入各個角落。二是將圖、文、聲、像、動畫、電影等無縫地鏈接在一起。三是在插入的對象里建立鏈接。需要時，只需用鼠標(biāo)點擊即可

1.3.6電影的制作和播放

教學(xué)過程中有些具體操作，只靠一些畫面無法解釋清楚，將這些操作錄制成帶有聲音解說的小電影在幻燈片中進(jìn)行播放，不僅能加強學(xué)生的感性認(rèn)識，還可以減輕教師的備課工作量。特別是實戰(zhàn)操作困難的內(nèi)容，加入小電影就更有必要性。尤其是涉及到計算機(jī)系統(tǒng)的參數(shù)設(shè)置，一般不允許隨便操作。本系統(tǒng)將這些必要的操作過程全部錄制成小電影，并在各個操作環(huán)節(jié)上配有聲音解說。系統(tǒng)里共制作了170余部電影片斷。

1.3.7實戰(zhàn)和板書操作等功能設(shè)計

為了增加講課的機(jī)動性和靈活性，我們在每張幻燈片的左邊都設(shè)置了“實戰(zhàn)”按鈕和“板書”按鈕，需要進(jìn)行實戰(zhàn)演習(xí)時，按“實戰(zhàn)”按鈕，即可進(jìn)入相應(yīng)的實戰(zhàn)操作。需要板書時，可隨時單擊“板書”按鈕調(diào)出“黑板”書寫。

1.4計算機(jī)考試系統(tǒng)

系統(tǒng)提供了智能化程度較高的“Web網(wǎng)站設(shè)計”、“ASP程序設(shè)計”、“Dreamweaver網(wǎng)頁制作”三個計算機(jī)機(jī)試系統(tǒng)。

每個考試系統(tǒng)都裝入近3000道試題和答案。試題中有單選題、是非題、多選題、主觀題、填空題、改錯題和電影題共七種類型。試題庫中試題除給出參考答案外，還設(shè)有知識點，以控制在試卷選題時不出現(xiàn)有相同知識點的試題。每個系統(tǒng)都可以進(jìn)行試卷標(biāo)準(zhǔn)化選題、上機(jī)標(biāo)準(zhǔn)化選題和任意區(qū)間選題三種方法的隨機(jī)選題。系統(tǒng)不僅能輸出圖文并茂的精美試卷，而且能使學(xué)生直接上機(jī)考試。對于學(xué)生的機(jī)試成績，自動評卷后，還可以根據(jù)學(xué)生的考試成績，科學(xué)給出不同學(xué)生對于各有關(guān)知識點的定性評語及其繼續(xù)學(xué)習(xí)建議書。

1.5學(xué)習(xí)幫助系統(tǒng)

系統(tǒng)提供了教學(xué)大綱、學(xué)習(xí)要求、查尋手冊和聯(lián)機(jī)幫助信息等多種資源，為教師提供了素材庫、試題庫等備課資源。支持學(xué)生案例型學(xué)習(xí)、發(fā)現(xiàn)式學(xué)習(xí)、資源型學(xué)習(xí)、研究性學(xué)習(xí)、協(xié)作學(xué)習(xí)等多種學(xué)習(xí)模式。限于文章的篇幅，該子系統(tǒng)的理論與技術(shù)另文介紹。

1.6交流論壇

交流論壇分為學(xué)生交流論壇和師生交流論壇。學(xué)生交流論壇主要供學(xué)生之間探討學(xué)習(xí)心得，交流學(xué)習(xí)成果之用。師生交流論壇主要作學(xué)生向教師詢問問題和教師布置作業(yè)、發(fā)布通知之用。

論壇功能跟目前網(wǎng)上流行的大部分論壇一樣。用戶需要先在論壇中注冊一個自己的ID號，再以該ID號登錄即可使用論壇功能。注冊用戶可以修改登錄密碼，瀏覽、發(fā)表、搜索文章。管理員使用管理員賬號可以登錄bbs用戶管理界面，進(jìn)行各項管理操作。

用戶可以使用UBB代碼在文章中插入各種對象，和調(diào)整文字屬性。但對于敏感或粗俗語言，系統(tǒng)會自動過濾。

public string trn(string instr)

{ int i= yuyan.Length;

for (int j=0;j

{instr=instr.Replace(bad[j]，clear[j]);}

return instr;

}

htm[17]=\"媽媽的Ｘ\";

ubb[17]=\"過濾文字\";

論壇文章及回復(fù)的數(shù)據(jù)處理?？紤]到文章的回復(fù)會很多，如果按照順序從數(shù)據(jù)庫中依次讀取，有可能會出現(xiàn)數(shù)據(jù)庫壓力增加。所以采用預(yù)讀取數(shù)據(jù)，對應(yīng)排列后顯示的方法，大大減低了數(shù)據(jù)讀取次數(shù)。

對于用戶提交的任何信息，系統(tǒng)都會作安全處理，檢測不安全因素。尤其是SQL注入防范，對注入字符全部過濾。

String username=Request[“username”]. Replace(\".\"，\"1\").Replace(\"，\"，\"2\").Replace(\"(\"，\"3\").Replace(\")\"，\"4\").Replace(\":\"，\"5\");

用戶在線時權(quán)限與及時狀態(tài)保存在SESSION中，隱藏于瀏覽器狀態(tài)中，不可修改，瀏覽器關(guān)閉，信息便消失。再次打開本頁，需要重新登錄。

2系統(tǒng)設(shè)計的幾個問題

2.1關(guān)于ASP.NET技術(shù)

ASP.NET也叫ASP+，它不僅僅是ASP的簡單升級版本，它還提供了一個統(tǒng)一的Web開發(fā)模型，其中包括開發(fā)人員生成企業(yè)級Web應(yīng)用程序所需的各種服務(wù)。

ASP.NET具有不依賴某種具體語言的特點，可以用任何與.NET 兼容的語言(包括Visual

Basic.NET、C#和JScript.NET)編寫應(yīng)用程序。另外，ASP.NET的語法與ASP在很大程度上可以兼容，熟悉ASP的開發(fā)人員可以很方便的轉(zhuǎn)到ASP.NET的開發(fā)中來。同時ASP.NET還提供一種新的編程模型和結(jié)構(gòu)，可生成伸縮性和穩(wěn)定性更好的應(yīng)用程序，并提供更好的安全保護(hù)?？梢酝ㄟ^在現(xiàn)有 ASP 應(yīng)用程序中逐漸添加 ASP.NET 功能，隨時增強 ASP 應(yīng)用程序的功能，其中包括托管的公共語言運行庫環(huán)境、類型安全、繼承等等。與 ASP 相比，ASP.NET 在很多方面有了顯著的改進(jìn)，這些方面包括：性能、狀態(tài)管理、可縮放性、配置、部署、安全性、輸出緩存控制、網(wǎng)絡(luò)場支持和 XML Web services 結(jié)構(gòu)等。

ASP.NET通過ODBC接口，不僅可以使用Web網(wǎng)站設(shè)計、Dreamweaver網(wǎng)頁設(shè)計、ASP程序設(shè)計、Microsoft SQL Server 等數(shù)據(jù)庫，而且可以使用任何提供了ODBC驅(qū)動程序的第三方產(chǎn)品。 與ADO對應(yīng)于ASP一樣， ASP.NAT對應(yīng)的有ADO.NET。 ADO.NET提供對 Microsoft SQL Server 等數(shù)據(jù)源以及通過 OLE DB 和 XML 公開的數(shù)據(jù)源的一致訪問。數(shù)據(jù)共享使用者應(yīng)用程序可以使用ADO.NET 來連接到這些數(shù)據(jù)源，并查詢、刪除、操作和更新數(shù)據(jù)。

2.2系統(tǒng)的開發(fā)及運行環(huán)境

本系統(tǒng)最終版本是基于Windows2000/XP professional、Visual Studio.NET及MS FrontPage 2000、MDAC 2.7 for Data、Internet信息服務(wù)開發(fā)環(huán)境下進(jìn)行的，系統(tǒng)的運行需要在服務(wù)器上安裝.NET Framework。且在安裝 .NET Framework之前，必須確保該服務(wù)器上已經(jīng)安裝并運行了Internet信息服務(wù)。

將本系統(tǒng)直接拷貝到服務(wù)器的Web主目錄下，或者在磁盤的任何位置通過在IIS中建立虛擬目錄指向系統(tǒng)文件夾即可訪問本系統(tǒng)。

3結(jié)束語

該教學(xué)系統(tǒng)的應(yīng)用，使得教學(xué)過程可以實現(xiàn)雙向互動，最大限度的實現(xiàn)教學(xué)資源的共享。并且本系統(tǒng)功用齊全，使用方便，具有良好的可擴(kuò)展性和通用性?？勺鳛樵O(shè)計其他網(wǎng)絡(luò)課程的模版。同時可與其他高等職院共享，將會促使我國高等職院“WEB網(wǎng)站設(shè)計”教學(xué)的整體水平有一個新的提高。

Based on ASP.NET“Web Website Design”network teaching system

application and research

WU Lian-gui， YI Yu

(Loudi Vocational Technical InstituteLoudi Hunan 417000)

Abstract: Owing to that the ASP.NET technology has developed out network teaching system， owe system teacher and student behavior in having considered teaching process sufficiently， a key link melting to have entered tradition teaching. Announcing and correcting voluntarily the exchange studying， school assignment owing platform exchange， student and student supporting the teacher and the student and so on. Both \"computer-aid teaching system \" and \"computer examination system \" melt to have entered network teaching system.

Keywords: Website designs Web; Internet; Network course

參考文獻(xiàn)

[1] 吳蓮貴. Web網(wǎng)站設(shè)計[J]. 校本教材，2006，(3).

[2 ] 普悠瑪. ASP.NET程序設(shè)計示例導(dǎo)學(xué)[M]. 北京科海電子出版社，2003.

[3 ] 楊浩. JavaScript入門與提高[M]. 北京：清華大學(xué)出版社，2003.

[4] 王愛民. 基于Web的《計算機(jī)應(yīng)用基礎(chǔ)》網(wǎng)絡(luò)教學(xué)系統(tǒng)的研制[EB/OL]. 中國教育和科研計算機(jī)網(wǎng)，2006.

作者簡介

吳蓮貴(1954-)，女，湖南婁底職業(yè)技術(shù)學(xué)院計算機(jī)系主任，副教授，研究方向：教育管理，網(wǎng)絡(luò)軟件開發(fā)。

易瑜(1980-)，女，湖南婁底職業(yè)技術(shù)學(xué)院，軟件工程師，研究方向：網(wǎng)站設(shè)計與安全管理。

通信地址：湖南婁底職業(yè)技術(shù)學(xué)院計算機(jī)系

E-mail：ldwlg@163.com