基于DreamWeaver的任務(wù)驅(qū)動教學實踐

周儀蘭

摘 要： 針對中職學生學習DreamWeaver時每節(jié)課學習其中的一部分功能，建設(shè)網(wǎng)站時把這些功能整合使用，大部分學生都感到困難的實際情況，作者采用任務(wù)驅(qū)動教學法理清思路，使學生有效地將所學理論和實踐聯(lián)系在一起，推動網(wǎng)站建設(shè)。

關(guān)鍵詞： DreamWeaver教學 任務(wù)驅(qū)動 數(shù)據(jù)庫

DreamWeaver動態(tài)網(wǎng)頁制作教學，大部分采用案例進行教學，學生可以從具體的案例中學到DreamWeaver的強大功能，但是案例教學中學生往往忽略為什么要這么做，每節(jié)課的教學內(nèi)容都以教材提供的素材完成，對于素材的選用、項目的設(shè)計、網(wǎng)頁的布局及數(shù)據(jù)庫的設(shè)計，學生無需思考這些問題，但是在實際網(wǎng)站建設(shè)中，這些內(nèi)容卻是必不可少的，學生需要逐一設(shè)計。在學完DreamWeaver后，筆者要求學生運用它設(shè)計一個自己的網(wǎng)站，而中職學生在完成這一項目時，感到難度很大，無從做起。因此在設(shè)計過程中，筆者用任務(wù)驅(qū)動教學引導學生統(tǒng)籌規(guī)劃，遵循網(wǎng)站規(guī)劃、數(shù)據(jù)庫的設(shè)計、網(wǎng)頁的布局、網(wǎng)頁的實施、測試及評價的過程，讓學生獨立完成以上過程，在自己“動手”的過程中，掌握技能，豐富自身的專業(yè)知識。

一、確定網(wǎng)站的主題及所要呈現(xiàn)的內(nèi)容

這一階段，教師設(shè)計一個表格，讓學生完成相應(yīng)的表格，內(nèi)容包括網(wǎng)站的名稱、主題；前臺后臺各設(shè)計幾個模塊、各模塊的名稱及其包含的項目；要求學生在規(guī)定的時間內(nèi)完成這份表格。學生在設(shè)計項目時，經(jīng)常會出現(xiàn)項目不足以表達所要呈現(xiàn)的內(nèi)容的問題，這是教材中缺少的內(nèi)容。教師可以用一個具體的實例講解分析的過程。例如：我們在做旅游網(wǎng)站時，前臺包括首頁、景點介紹、精品線路、旅游的形式（全景游、一日游、三日游等）。后臺包括：用戶注冊、用戶、管理員登錄、用戶修改密碼、用戶留言板；新聞發(fā)布、編輯、刪減；用戶賬號刪減；景點發(fā)布、編輯、刪減；旅游形式發(fā)布、編輯、刪減等。教師對學生的表格數(shù)據(jù)給出一些合理化的建議。

二、數(shù)據(jù)庫的設(shè)計

這部分內(nèi)容在教材中是以素材的形式使用的，學生在學習過程中沒有設(shè)計，而在DreamWeaver動態(tài)網(wǎng)頁制作中它卻是核心，網(wǎng)站的所有數(shù)據(jù)都在數(shù)據(jù)庫中，由此可見數(shù)據(jù)庫的重要性。學生數(shù)據(jù)庫的設(shè)計是以數(shù)據(jù)形式上交，包括數(shù)據(jù)表、每個數(shù)據(jù)表包含的字段的字段名、類型、用途，輸入數(shù)據(jù)記錄的內(nèi)容，至少十條。內(nèi)容太少會影響主頁的完整性，教師以旅游網(wǎng)站的實例講解設(shè)計過程，數(shù)據(jù)庫至少包含三個數(shù)據(jù)表：用戶表、新聞表和景點表。

用戶表中的字段：用戶名（字符型）、密碼（字符型）、用戶級別（數(shù)值型）、注冊時間（日期型）、電子郵件（字符型）。

新聞表中的字段：新聞標題（字符型）、新聞內(nèi)容（字符型）、新聞圖片（字符型）。

景點表中的內(nèi)容：景點名稱（字符型）、景點內(nèi)容（字符型）、景點圖片（字符型）。

三、制作頭文件

頭文件包含網(wǎng)站Logo及網(wǎng)站名稱、導航、用戶注冊及登錄、后臺入口，頭文件制作后，可以直接在首頁、詳細頁及后臺中運用，大大加快網(wǎng)頁制作的速度。

1.制作網(wǎng)站Logo

選擇標志性的圖片及站點名稱用Photo或Flash制作成網(wǎng)站Logo，這是我們網(wǎng)站的門面，要求界面友好、色彩搭配協(xié)調(diào)、和諧，頁面美觀。

2.連接數(shù)據(jù)庫

數(shù)據(jù)庫的連接是最關(guān)鍵的一步，是能否將網(wǎng)頁制作成動態(tài)網(wǎng)頁的關(guān)鍵。數(shù)據(jù)的連接方式有兩種：一種是以自定義連接字符串方式創(chuàng)建數(shù)據(jù)庫連接，另一種是以數(shù)據(jù)源名稱方式連接。使用自定義連接字符串創(chuàng)建數(shù)據(jù)庫連接，可以保證用戶在本地計算機中定義數(shù)據(jù)庫連接上傳到服務(wù)器后繼續(xù)使用，具有很大的靈活性，我們選用自定義字符串的連接方式。數(shù)據(jù)庫連接對中職學生來說，具有很大難度，經(jīng)常出現(xiàn)數(shù)據(jù)庫連接不上的問題，小組成員可以互相調(diào)試，必要時教師給予適當指導。

3.制作導航

導航欄中的超級鏈接到具體的文件，文件名應(yīng)易分辨、記憶、方便后期的調(diào)試。

4.制作用戶注冊

（1）新建注冊頁面，創(chuàng)建表單及按鈕。

（2）在代碼界面加入代碼判斷密碼及密碼確認的內(nèi)容是否一致。

（3）檢查是否則新用戶，否則給出相應(yīng)信息。

（4）在按鈕中加入插入記錄到用戶表中，默認用戶級別為2，普通用戶。

（5）在頭文件中創(chuàng)建注冊的超鏈接。

這一過程要避免出現(xiàn)用戶名重復的現(xiàn)象，確保用戶的唯一性。

5.制作登錄

（1）定義兩個階段變量用戶名MM_UserName及用戶級別MM_UserAuthorization。

（2）新建登錄頁面，創(chuàng)建表單。

（3）在服務(wù)器行為面板中，使用用戶身份驗證，登錄用戶。

（4）在代碼中加入代碼：如果用戶名為空，則顯示您還沒有登錄，否則顯示您好，用戶名及退出。

（5）在代碼中加入代友：如果用戶級別的值<=1，則顯示管理入口。

其中，修改代碼是學生出現(xiàn)錯誤最多的地方，這里要求各組學生互相修改、調(diào)試。用這種方法，學生在調(diào)試的過程中不斷鞏固知識，有效提高課堂教學效率，提高動手能力，增強團結(jié)協(xié)作能力。

6.制作注銷登錄

選中文本注銷，在服務(wù)器行為面板中，使用用戶身份驗證中的注銷用戶。

7.生成頭文件

切換到代碼視圖，將標簽以外的代碼刪除。

四、制作首頁

1.打開首頁文件。

2.用插入/HTML中的腳本SSI，將頭文件置于首頁中。

3.創(chuàng)建新聞列表：

（1）用數(shù)據(jù)庫中的新聞表創(chuàng)建記錄集；

（2）在新聞的位置創(chuàng)建一個一行一列的表格，設(shè)置邊框為0，將記錄集中的新聞標題以動；態(tài)文本的形式插入表格中，將表格設(shè)置為重復區(qū)域，并設(shè)置顯示左端開始的30個字符；

（3）創(chuàng)建詳細頁面；

（4）在首頁中，選定動態(tài)文本新聞標題，添加轉(zhuǎn)到詳細頁的服務(wù)器行為。

4.用上述方法創(chuàng)建景點列表、旅游形式列表等。

5.制作滾動圖片及圖片的懸停效果。

6.插入Flash滾動條。

7.制作頁腳。

至此，首頁制作完畢。

五、制作后臺

1.制作新聞編輯頁面。

（1）用插入/HTML/腳本SSI，將頭文件置于首頁中。

（2）創(chuàng)建新聞列表。

（3）用數(shù)據(jù)庫中的新聞表創(chuàng)建記錄集，用服務(wù)服務(wù)器行為的插入記錄完成新聞的添加，用更新記錄完成新聞的修改，用刪除記錄完成新聞的刪除。

（4）添加限制對頁的訪問。

（5）創(chuàng)建新聞列表及詳細頁。

2.用上述方法創(chuàng)建景點的編輯頁、旅游方式的編輯頁及設(shè)置管理員等

用任務(wù)教學法，學生把所學的內(nèi)容融會貫通，做出一個自己設(shè)計的網(wǎng)站，體驗到成功的喜悅。

參考文獻：

[1]王君學.從零開始—DreamWeaver CS5中文版基礎(chǔ)培訓教程[M].北京：人民郵電出版社，2012：3.

[2]黃文冰.從零開始—DreamWeaver中文版典型實例[M].北京：人民郵電出版社，2005：10.

[3]豐云.“開放·探究·協(xié)作”學習模式下的教師角色探析[J].北京：中國職業(yè)技術(shù)教育，2013：17.