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

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

中圖分類(lèi)號(hào)：G642文獻(xiàn)標(biāo)識(shí)碼：B

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

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

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

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

1.1電子教程與在線答題

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

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

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

1.2實(shí)驗(yàn)系統(tǒng)

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

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

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

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

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

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

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

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

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

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

1.3.2實(shí)現(xiàn)了在對(duì)象里書(shū)寫(xiě)講稿

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

1.3.3在對(duì)象里嵌套對(duì)象

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

1.3.4多渠道提供對(duì)象工具

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

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

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

1.3.6電影的制作和播放

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

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

為了增加講課的機(jī)動(dòng)性和靈活性，我們?cè)诿繌埢脽羝淖筮叾荚O(shè)置了“實(shí)戰(zhàn)”按鈕和“板書(shū)”按鈕，需要進(jìn)行實(shí)戰(zhàn)演習(xí)時(shí)，按“實(shí)戰(zhàn)”按鈕，即可進(jìn)入相應(yīng)的實(shí)戰(zhàn)操作。需要板書(shū)時(shí)，可隨時(shí)單擊“板書(shū)”按鈕調(diào)出“黑板”書(shū)寫(xiě)。

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

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

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

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

系統(tǒng)提供了教學(xué)大綱、學(xué)習(xí)要求、查尋手冊(cè)和聯(lián)機(jī)幫助信息等多種資源，為教師提供了素材庫(kù)、試題庫(kù)等備課資源。支持學(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é)生向教師詢(xún)問(wèn)問(wèn)題和教師布置作業(yè)、發(fā)布通知之用。

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

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

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]=\"過(guò)濾文字\";

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

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

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

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

2系統(tǒng)設(shè)計(jì)的幾個(gè)問(wèn)題

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

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

ASP.NET具有不依賴(lài)某種具體語(yǔ)言的特點(diǎn)，可以用任何與.NET 兼容的語(yǔ)言(包括Visual

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

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

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

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

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

3結(jié)束語(yǔ)

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

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ì)[J]. 校本教材，2006，(3).

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

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

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

作者簡(jiǎn)介

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

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

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

E-mail：ldwlg@163.com