網(wǎng)頁(yè)設(shè)計(jì)與制作教學(xué)網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)

摘 要： 為了提高教學(xué)效率，使優(yōu)秀的教學(xué)資源和信息能夠在更大范圍、短時(shí)間內(nèi)迅速傳播，采用Dreamweaver工具和ASP 技術(shù)開(kāi)發(fā)了網(wǎng)絡(luò)教學(xué)平臺(tái)。教學(xué)網(wǎng)站前臺(tái)采用動(dòng)態(tài)網(wǎng)頁(yè)設(shè)計(jì)，后臺(tái)使用SQL Server 2005數(shù)據(jù)庫(kù)以滿足大用戶量的需求。網(wǎng)站實(shí)現(xiàn)了在線答疑、討論、課件上傳下載、教學(xué)管理及用戶管理等功能，并通過(guò)了測(cè)試和試運(yùn)行。該網(wǎng)站的實(shí)現(xiàn)為教師和學(xué)生提供了一個(gè)高效、方便的網(wǎng)絡(luò)教學(xué)環(huán)境。

關(guān)鍵詞： SQL Server； 教學(xué)平臺(tái)； Dreamweaver； ASP

中圖分類號(hào)：TP311 文獻(xiàn)標(biāo)志碼：A 文章編號(hào)：1006-8228（2013）12-65-02

Design and implementation of teaching websites

Gao Yaxia1，2， Zou Hairong3

（1. Shaanxi University of Science Technology， Xi'an， Shaanxi 710021， China； 2. Shaanxi Commercial School； 3. Shaanxi University of Technology）

Abstract： In order to improve teaching efficiency and spread good teaching resources and information in a larger scope but a short period of time， the network teaching platform is developed using Dreamweaver tools and ASP technology. A dynamic web page is applied at the front desk in teaching website， and SQL Server 2005 is used in the backstage data base to satisfy large amount of consumer. After testing and operation of the site， the functions such as answering of the network， online discussions， assignments and learning announcements， uploading and downloading courseware， teaching management and user management are realized in this teaching website， which provides an efficient and convenient teaching environment on web.

Key words： SQL Server； teaching Website； Dreamweaver； ASP

0 引言

隨著計(jì)算機(jī)和信息技術(shù)的飛速發(fā)展，網(wǎng)絡(luò)教學(xué)也在快速發(fā)展和普及。教師與學(xué)生都迫切需要一種簡(jiǎn)便高效的教學(xué)方式，網(wǎng)絡(luò)教學(xué)的出現(xiàn)正好滿足了人們的這種需要。隨著網(wǎng)頁(yè)技術(shù)的發(fā)展成熟，人們對(duì)網(wǎng)頁(yè)的要求也不再是文字、圖片的簡(jiǎn)單堆砌和單調(diào)枯燥的內(nèi)容，而是實(shí)時(shí)性、交互性和豐富性，使用動(dòng)態(tài)技術(shù)的網(wǎng)頁(yè)越來(lái)越受歡迎[1]。本文介紹采用ASP動(dòng)態(tài)網(wǎng)頁(yè)技術(shù)結(jié)合SQL Server 2005數(shù)據(jù)庫(kù)構(gòu)建一個(gè)“網(wǎng)頁(yè)設(shè)計(jì)與制作”課程教學(xué)網(wǎng)站。學(xué)生通過(guò)訪問(wèn)該網(wǎng)站，可以瀏覽/下載課件、在線作業(yè)、在線交流與討論等；教師可以上傳課件、在線答疑等；管理員可以修改、刪除、添加、查詢用戶信息、進(jìn)行教程管理等。系統(tǒng)發(fā)揮了ASP技術(shù)顯示于客戶端和運(yùn)行于服務(wù)器端，以及保護(hù)用戶資料的安全性等特性。

1 系統(tǒng)需求分析

利用互聯(lián)網(wǎng)技術(shù)進(jìn)行網(wǎng)絡(luò)教學(xué)，可以跨越時(shí)空限制，最大范圍地傳播資源，具有投資少、覆蓋面廣、受益人多和互動(dòng)性強(qiáng)等特點(diǎn)，使辦學(xué)單位減少了人力和物力的消耗，并為廣大學(xué)子提供了豐富的資源?？梢?jiàn)，網(wǎng)絡(luò)教學(xué)為教育事業(yè)開(kāi)辟了廣闊的前景。由于在網(wǎng)絡(luò)中易于實(shí)現(xiàn)資源共享，學(xué)生可以將個(gè)人問(wèn)題轉(zhuǎn)化為公共問(wèn)題，并借助集體智慧解決個(gè)人問(wèn)題，學(xué)生在網(wǎng)絡(luò)中容易找到志同道合的學(xué)友，各自就共同感興趣的問(wèn)題發(fā)表自己的看法，有益于培養(yǎng)學(xué)生的信息素養(yǎng)和解決問(wèn)題的能力等[2]。教師可以在網(wǎng)絡(luò)平臺(tái)成為導(dǎo)師，接受或選擇學(xué)生的輔導(dǎo)請(qǐng)求，起到指導(dǎo)和督導(dǎo)作用。通過(guò)對(duì)在校大學(xué)生和教師調(diào)查發(fā)現(xiàn)，計(jì)算機(jī)網(wǎng)絡(luò)教學(xué)因其互動(dòng)性強(qiáng)、教學(xué)效果好等優(yōu)勢(shì)成為人們的新需求。網(wǎng)絡(luò)教學(xué)網(wǎng)站系統(tǒng)的開(kāi)發(fā)，主要是為用戶設(shè)計(jì)和開(kāi)發(fā)一個(gè)便于學(xué)習(xí)與交流的網(wǎng)絡(luò)教學(xué)平臺(tái)，以提高教學(xué)效率。

2 開(kāi)發(fā)技術(shù)和方法

本網(wǎng)站教學(xué)平臺(tái)采用目前流行的B/S（Brower/Server）結(jié)構(gòu)。整個(gè)網(wǎng)站可以運(yùn)行于Windows 2003 Server/Windows XP平臺(tái)上，系統(tǒng)前臺(tái)使用流行的工具和腳本語(yǔ)言Dreamweaver HTML語(yǔ)言和ASP技術(shù)開(kāi)發(fā)，后臺(tái)采用當(dāng)前最流行且性能較高，數(shù)據(jù)庫(kù)維護(hù)與管理性能很強(qiáng)大的SQL Server 2005。B/S是隨Internent技術(shù)的興起，對(duì)C/S（Client/Server）結(jié)構(gòu)的一種變化或者改進(jìn)的結(jié)構(gòu)，在這種結(jié)構(gòu)下，用戶界面完全通過(guò)www瀏覽器實(shí)現(xiàn)，一部分事務(wù)邏輯在前端實(shí)現(xiàn)，但主要事務(wù)邏輯在服務(wù)器端實(shí)現(xiàn)[3]。系統(tǒng)充分發(fā)揮了ASP技術(shù)顯示于客戶端、運(yùn)行于服務(wù)器端，以及保護(hù)用戶資料的安全性等優(yōu)點(diǎn)。

3 “網(wǎng)頁(yè)設(shè)計(jì)與制作”教學(xué)網(wǎng)站的設(shè)計(jì)

3.1 系統(tǒng)功能設(shè)計(jì)

從教學(xué)用戶的角度，網(wǎng)頁(yè)設(shè)計(jì)與制作課程教學(xué)網(wǎng)站可劃分為教師、學(xué)生和管理員三大功能模塊。具體內(nèi)容如表1所示。

表1 系統(tǒng)用戶與功能設(shè)計(jì)

[分類＼模塊＼使用者＼教師＼查看短消息＼教師＼發(fā)布學(xué)習(xí)及作業(yè)公告＼教師＼上傳課件＼教師＼網(wǎng)絡(luò)答疑＼教師＼討論交流＼教師＼學(xué)生

＼查看短消息＼學(xué)生＼瀏覽課件＼學(xué)生＼查看作業(yè)公告＼學(xué)生＼網(wǎng)絡(luò)提問(wèn)＼學(xué)生＼討論交流＼學(xué)生＼管理員＼消息管理＼管理員＼教學(xué)管理＼管理員＼討論管理＼管理員＼用戶管理＼管理員＼]

3.2 數(shù)據(jù)流程

3.2.1 系統(tǒng)總流程

在網(wǎng)站首頁(yè)進(jìn)行用戶賬號(hào)的登錄時(shí)，系統(tǒng)接收到用戶賬號(hào)后，首先與數(shù)據(jù)庫(kù)中存放的賬號(hào)進(jìn)行權(quán)限分析和匹配，若賬號(hào)相匹配，則進(jìn)入相應(yīng)權(quán)限的用戶模塊；若賬號(hào)不匹配，則提示用戶操作錯(cuò)誤，返回登錄界面。系統(tǒng)的總流程如圖1所示。

[用戶登錄](méi)[賬號(hào)是否正確？] [驗(yàn)證權(quán)限] [具體模塊][數(shù)據(jù)庫(kù)] [N][Y][學(xué)生][教師][管理員][結(jié)束]

圖1 系統(tǒng)流程圖

3.2.2 后臺(tái)管理流程

管理員用戶具有對(duì)整個(gè)系統(tǒng)的管理權(quán)限，除接收短消息功能外主要實(shí)現(xiàn)管理學(xué)生和教師模塊的內(nèi)容，課件管理可在一個(gè)特定的時(shí)間內(nèi)刪除數(shù)據(jù)庫(kù)里的課件記錄和站點(diǎn)內(nèi)相應(yīng)的文件，這樣可節(jié)省站點(diǎn)的空間；用戶管理可針對(duì)目前系統(tǒng)的工作量適當(dāng)?shù)靥砑踊騽h除系統(tǒng)管理員，也可更改用戶賬號(hào)；在討論管理區(qū)內(nèi)管理員可刪除一些過(guò)期的或惡意的帖子，也可針對(duì)一些話題發(fā)帖；在教學(xué)管理區(qū)內(nèi)可對(duì)學(xué)生、教師、學(xué)院、專業(yè)、班級(jí)等進(jìn)行編輯、修改、添加和刪除。詳細(xì)流程如圖2所示。

[管理員登錄](méi)[接收短消息][課件管理][用戶管理][討論管理][教學(xué)管理][收信息][發(fā)信息] [學(xué)生管理][教師管理][學(xué)院管理][專業(yè)管理][班級(jí)管理][課件管理][開(kāi)課管理][操作完成] [數(shù)據(jù)庫(kù)]

圖2 后臺(tái)管理流程圖

4 “網(wǎng)頁(yè)設(shè)計(jì)與制作”教學(xué)網(wǎng)站的實(shí)現(xiàn)

4.1 數(shù)據(jù)庫(kù)設(shè)計(jì)

數(shù)據(jù)庫(kù)是網(wǎng)站信息管理的后臺(tái)支持，存儲(chǔ)著前臺(tái)頁(yè)面所需要的信息，在信息管理系統(tǒng)中有著很重要的地位。數(shù)據(jù)庫(kù)設(shè)計(jì)的好與壞，直接影響到網(wǎng)站系統(tǒng)的運(yùn)行效率。良好的數(shù)據(jù)庫(kù)設(shè)計(jì)，可以提高數(shù)據(jù)信息的存儲(chǔ)效率，保證數(shù)據(jù)信息的完整性和一直性。同時(shí)，一個(gè)合理的數(shù)據(jù)庫(kù)結(jié)構(gòu)有利于程序的實(shí)現(xiàn)。本網(wǎng)站系統(tǒng)使用數(shù)據(jù)庫(kù)SQL Server 2005建立教學(xué)（teaching）數(shù)據(jù)庫(kù)。后臺(tái)數(shù)據(jù)庫(kù)的連接采用字符串連接，其連接文件的代碼如下：

<% dim ctrConnection，conn //定義常量

ctrConnection=\"Driver={SQL Server}；server=（local）；uid=wy；

pwd=123；database=teaching；\" //連接字符串

set conn=server.createobject（\"ADODB.CONNECTION\"）

//創(chuàng)建連接對(duì)象

conn.open ctrConnection %> //打開(kāi)數(shù)據(jù)庫(kù)

4.2 網(wǎng)站主要頁(yè)面實(shí)現(xiàn)

4.2.1 網(wǎng)站主頁(yè)面

課程教學(xué)網(wǎng)站主要是實(shí)現(xiàn)教師、學(xué)生在線學(xué)習(xí)與交流的良好平臺(tái)，進(jìn)入系統(tǒng)首頁(yè)就能夠方便的選擇用于學(xué)習(xí)的資源信息等內(nèi)容。資料列表模塊，顯示學(xué)生可以自主學(xué)習(xí)的所有教學(xué)資料信息；網(wǎng)上答疑模塊，提供師生在線交流、學(xué)習(xí)和討論的平臺(tái)。主頁(yè)運(yùn)行效果如圖3所示。

圖3 網(wǎng)站主頁(yè)界面

4.2.2 網(wǎng)站管理頁(yè)面

網(wǎng)站后臺(tái)管理系統(tǒng)能夠?qū)崿F(xiàn)教師、學(xué)生、課件與教學(xué)資源及用戶信息的管理等功能。系統(tǒng)管理員登錄頁(yè)面的運(yùn)行效果圖4所示。

圖4 管理員登錄頁(yè)面

5 系統(tǒng)功能測(cè)試

為了提高網(wǎng)站開(kāi)發(fā)和設(shè)計(jì)的效率，該教學(xué)網(wǎng)站使用目前流行的B/S模式[5]。整個(gè)網(wǎng)站可以運(yùn)行于Windows 2003 Server/Windows XP平臺(tái)上，系統(tǒng)前臺(tái)采用先進(jìn)的Dreamweaver、HTML語(yǔ)言工具和ASP技術(shù)開(kāi)發(fā)。后臺(tái)數(shù)據(jù)庫(kù)采用當(dāng)前最流行且性能較高，數(shù)據(jù)庫(kù)維護(hù)與管理性能很強(qiáng)大的SQL Server 2005實(shí)現(xiàn)。通過(guò)對(duì)網(wǎng)站系統(tǒng)的基本信息模塊，消息管理模塊、課件管理模塊、上傳下載課件模塊，發(fā)布作業(yè)公告、BBS模塊與教學(xué)管理等功能模塊（學(xué)生管理，教師管理，課程管理）進(jìn)行系統(tǒng)測(cè)試，結(jié)果表明，所設(shè)計(jì)的功能都能實(shí)現(xiàn)，系統(tǒng)性能良好，能夠滿足用戶的實(shí)際需求。

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

本教學(xué)網(wǎng)站平臺(tái)的開(kāi)發(fā)和應(yīng)用，實(shí)現(xiàn)了教學(xué)資源的訪問(wèn)、課件上傳下載、師生互動(dòng)、學(xué)習(xí)交流和網(wǎng)上答疑討論等功能；使優(yōu)秀的教學(xué)資源和交流信息能在大范圍、短時(shí)間內(nèi)傳播。給教師和學(xué)生提供了一個(gè)方便、高效的網(wǎng)上教學(xué)與學(xué)習(xí)平臺(tái)，從而提高了學(xué)校教學(xué)效率與教學(xué)質(zhì)量。

參考文獻(xiàn)：

[1] 周興華，周新偉，張軍等.ASP+SQL Server數(shù)據(jù)庫(kù)開(kāi)發(fā)與實(shí)例[M].清

華大學(xué)出版社，2008.

[2] 蔣理.動(dòng)態(tài)網(wǎng)頁(yè)設(shè)計(jì)實(shí)用教程[M].西安電子科技大學(xué)出版社，2007.

[3] 王萍萍，李曉娜，孫更新.ASP+Dreamweaver動(dòng)態(tài)網(wǎng)站開(kāi)發(fā)[M].清華

大學(xué)出版社，2008.

[4] 韓培友，董桂云，柳虹.數(shù)據(jù)庫(kù)技術(shù)[M].西北工業(yè)大學(xué)出版社，2008.

[5] 徐洪峰.Dreamweaver CS5+ASP動(dòng)態(tài)網(wǎng)站設(shè)計(jì)實(shí)用手冊(cè)[M].電子工

業(yè)出版社，2011.