基于任務驅動的《網站規(guī)劃與設計》課程改革與實踐

張春鳳　高潔

摘要：該文結合《網站規(guī)劃與設計》的課程特點，介紹了基于任務驅動的課程改革方式與實施步驟。該方式需要多人協(xié)同完成同一網站，分工明確，逐步完成。使用該方式提高了學生的協(xié)同工作能力，積累了網站開發(fā)的經驗，達到了課程改革的目的。

關鍵詞：任務驅動；協(xié)同工作；網站規(guī)劃與設計

中圖分類號：TP393 文獻標識碼：A 文章編號：1009-3044(2012)36-8733-02

《網站規(guī)劃與設計》課程是計算機系各專業(yè)的選修課，主要內容包括網站規(guī)劃，網頁設計，動態(tài)網站制作以及網站維護。相比非計算機專業(yè)的《網頁設計》課程來看，前導課程多，涉及內容廣泛。因為學生畢業(yè)后進入軟件公司工作，大部分都是從事基于B/S模式的系統(tǒng)開發(fā)或者動態(tài)網站制作，不僅需要有本課程的課程基礎，還需要有實踐經驗。因此，課堂講授的知識以及一些小練習不能夠滿足學生就業(yè)的需要。學生需要熟知系統(tǒng)開發(fā)的流程以及每個步驟的工作內容，這樣能夠保證學生不論從事哪部份工作都能夠得心應手。

“教與學”的教學方式在這門課程上逐步落后，課堂上的知識點只是針對某一個部分，如何將所有內容集合成一個界面漂亮，功能性強的網站就非常困難了。通過基于任務驅動的《網站規(guī)劃與設計》的課程改革，學生能夠進行系統(tǒng)的練習，學會自己組織材料，自己制作網站，以便順利的投入到以后的工作。

1 存在的問題

1.1 傳統(tǒng)教學方式存在的問題

傳統(tǒng)的教學方式采用的是理論和和實踐上機課交叉進行，理論課上教師使用實例在投影上進行操作演示，上機課程學生按照操作步驟逐步操作進行練習。學生經過上機課后，可以熟練的做書上的練習，但是書上的練習題都是已經給定了創(chuàng)作素材和畫面布局，學生按照書上的操作步驟逐步操作就能夠完成。甚至有的練習題連頁面的邊框以及布局都已經完成，學生只需要做其中的一部分，用以練習授課內容。這樣練習的結果是學生能夠進行頁面的某一部分操作，只是限于模仿，在實際應用中碰到的問題卻不知如何去應對，不知道如何采用合適的步驟去制作和完成一個網頁，更不用說從整體上做一個界面漂亮、功能合理的網站了。

首先，學生的網站存在隨意更改的現象。在制作網頁時不根據先前寫好的網站規(guī)劃書進行后繼工作，從網站結構到頁面布局，想怎么改就怎么改。沒有一個系統(tǒng)的認識，是不能夠完成一個功能良好，賞心悅目的網站。

其次，網站的頁面元素間也存在相互制約的關系，整個頁面顏色也要協(xié)調，功能性的組件也要使用得當。經常見到學生的作業(yè)是為頁面不單調而用強硬使用組件，使得組件在頁面中顯得很突兀，組件的功能也沒有得到發(fā)揮。

最后，頁面的動態(tài)效果要和網站的功能相得益彰，學生為了使頁面動起來，在網絡上下載許多Flash，都堆砌在頁面上，整個頁面看到的全部是動畫，看起來混亂不堪。

1.2 能力的培養(yǎng)

制作網站是一個系統(tǒng)工程，需要經過對網站內容進行調查、研究客戶需要、網站總體規(guī)劃、搜集資料、網頁制作以及后期維護等步驟，這個過程根據客戶要求和實際情況需要逐步推進。

實際應用的網站從網站結構到頁面布局都比較復雜，一般都是多人協(xié)同工作。需要考慮的問題也比較多，比如：網站采用的風格，用戶群的定位，網站突出的主題以及文字和圖片的組織等。每個人完成其中的一部分，這就涉及自己完成的這一部分是否考慮了下一部分成員的工作難易。比如：動態(tài)網站在前期數據庫設計時可以將數據表設計的比較簡單，將多種數據混雜在一張表中，但是在后面做動態(tài)頁面的人員在查詢數據時查詢語句就比較難寫，且查詢效率低。協(xié)同工作還需要遵從一些約定，比如：文件夾的名字，文件目錄的層疊結構等。名字的命名需要見名知意，不需要根據說明文檔逐個尋找，這樣能夠整體提高工作效率。

當一個團隊來完成一項工作時，需要一個領導者和組織者來設置和實施計劃，這是一項統(tǒng)籌安排的工作。開始時，設置計劃完成時間及階段目標，其后，協(xié)調組織人員開展工作，這能夠鍛煉一個人的組織能力。

2 教學目標

2.1 網站主題

小組作業(yè)的目標網站大小要適當。網站太大，需要的學生多，一個步驟需要多名學生完成，沒有充裕的時間進行討論，最后工作完不成或者做出一個不能使用的系統(tǒng)，學生也不能對這部分工作有一個充分的了解，也不能在小組討論時說出自己的體會。

如果網站太小，每個學生完成的工作太少，不能充分理解統(tǒng)籌規(guī)劃的意義，以后在遇到大型項目時不能有一個完整的想法和思路，起不到鍛煉的作用。如果太小，也有可能是一個學生或兩個學生做，不能充分體現分工合作的目的，學生的能力組織和溝通能力也不能得到鍛煉。

我們布置的網站是購物網站，因為電子商務的普及，學生都開始在網絡上購物，對網絡購物有一定體會。購物網站有很多，各有特色，B2C和C2C實例都很豐富，功能對比及學習都很方便。要求學生完成的購物網站要售賣單一品種的商品，比如：網上書店，鮮花速遞等，不要求商品種類多，只要求網站功能齊備。

2.2 網站要求

網站要求顏色搭配協(xié)調，首頁面是“國”字型布局，其余頁面要與首頁面有明顯不同，也就是不能用一個模板套出來，但整個網站在顏色和風格上要保持一致。首頁面布局比較復雜，主要起導航和分類作用。次級頁面較簡單，用來詳細介紹某一商品。這樣能夠保證靜態(tài)頁面部分有一定工作量，使學生站在網站的角度進行工作，而不是某一個網頁。

考慮到學生的課余時間安排，課后作業(yè)工作量不能太大，至少要求有四個頁面，動態(tài)網站部分要求有增加、刪除、修改及查詢功能。這樣能夠保證基本的工作量，學生要在此基礎上進行方案設計。

3 實施方案

3.1 實施步驟

根據教學內容的推進，每次上機前都留有上機作業(yè)。第一部分是課堂教學內容，要求學生按照教材里面的例題進行操作練習，課件配有相關的素材；第二部分作業(yè)是拓展作業(yè)，要求學生根據已有知識自行完成，沒有任何參考資料。學生要觀察網絡上的成品網站，學習經驗，然后動手制作。作業(yè)要有拓展性，要讓學生學會思考，對于一個問題怎樣用現有的知識和方法去解決。作業(yè)最終能組合成一個網站，讓學生看到自己的成果，網站是否能吸引用戶，是否有良好的交互能力都一目了然。

首先留課堂作業(yè)，要求所有學生熟悉網站規(guī)劃與設計的步驟，隨著課程內容的推進，逐步留與網站相關的作業(yè)。使得所有學生掌握網站規(guī)劃與網頁設計的知識，在后期動態(tài)網站講授前，布置分組作業(yè)，要求每組5名學生。一名學生負責總體規(guī)劃以及協(xié)調工作；一名學生負責數據庫設計；一名學生制作靜態(tài)網頁，包含對圖片進行處理以及制作動畫；兩名學生制作動態(tài)網頁。每個學生完成的工作及相應文檔如表1所示。

每當一個學生完成一個階段工作，對學生作業(yè)進行講評，也讓學生看看別的同學的作業(yè)有何優(yōu)缺點，對照自己作業(yè)該如何修改。在完成作業(yè)后，小組交流，看看自己的工作對后繼同學的工作有何影響，是否給后繼工作造成障礙；看自己的設想和最后的成品有何差異。一組學生相互間交流，是否對他人的工作滿意，造成自己工作不便的原因有哪些。請大家點評自己的系統(tǒng)有何缺陷，應如何進行修改。別組系統(tǒng)有何缺陷，應如何修改。

教師評定的成績根據小組最后完成的網站由色彩搭配、使用功能，控件使用以及網站說明書這幾個方面進行評分，占總成績的50%。小組互評成績是各個小組相互之間評定成績，要讓學生看看別的小組作業(yè)的優(yōu)缺點，有利于學生借鑒經驗，占總成績的30%。最后，小組成員互相打分，起到一個互相監(jiān)督的作用，占20%。

3.3 實施效果

經過兩個年級5個專業(yè)的實踐，從學生的作業(yè)情況看，學生相互協(xié)調能力有所提高。在作業(yè)完成后寫經驗總結時，能夠正確指出自己小組系統(tǒng)的的不足以及在其它步驟中同學的設計及制作中的優(yōu)缺點。從學生的成績來看，優(yōu)秀率從原來的2%上升到5%，不及格率從原來的3%下降到0。經過這一次練習，學生的整體認知得到提高，知道該如何完成一個網站。

4 總結

我們采用的逐布推進式的分組作業(yè)方式，從學生的作業(yè)來看，已經取得了一定的成果。學生的作業(yè)也存在著一些問題：布局簡單，版式變化少；數據庫設計不合理；動態(tài)部分和靜態(tài)頁面不匹配。這些問題表明學生在制作網站方面經驗的不足及小組成員溝通不夠順暢。多讓學生參與實踐工作，加強經驗積累是我們以后工作的重點，需要在后繼工作中繼續(xù)完善。

參考文獻：

[1] 溫超.基于任務驅動的大學《網頁設計》課程“層次推進式”教學模式的探索[J].中國醫(yī)學教育技術,2010(12).

[2] 蔣文沛.任務驅動項目導向教學模式的應用——以《網站規(guī)劃與設計》課程為例[J].高教論壇,2011(10).

[3] 王建華.案例-任務驅動模式在計算機應用教學中的實踐[J].福建電腦,2011(11).