高職高專“網頁設計”課程教學改革的研究

摘 要：當前很多高職高專類院校的計算機專業都開設了“網頁設計”課程，但在教學過程中還存在著不少有待改進的地方，這從這門課程的大量的教材的編寫中就能看得出來。為此，本文從諸多方面提出這門課程教學改革的一些思路和建議，希望能夠為任課教師提供一些參考。

關鍵詞：網頁設計 教學改革

中圖分類號：G642 文獻標識碼：A 文章編號：1672-3791（2012）11（a）-0173-01

1 對網頁設計課程性質和地位的重新認識

對于高職高專層次的學生來說，網頁設計課程是至關重要的。原因有二：第一，不少學生的畢業設計會做一個動態網站，這就需要這門課程作為基礎。第二，網頁設計是綜合性很強的技術，除了要講授HTML，CSS，Javascript等內容外，還要涉及到Photoshop，Fireworks，Flash，數據庫，服務器配置等多項技術。通過制作網站，可以將這些技術綜合應用，融會貫通，較全面地提升學生的專業水平。

可是在現實的教學中，對這一點的認識并不到位。一是安排的課時量太少。二是開課太早。我認為應該在Photoshop，Flash和一門高級語言（為學習Javascript做好鋪墊）開設之后，再開設網頁設計的課程。這樣，既可以鞏固強化前期課程的相關技術，又可以提升當前制作的網站的水準。

2 對網頁設計課程教學內容的改革

前已述及，當前教學中對網頁設計課程安排的課時量太少。為什么會這樣呢？因為對這門課的教學內容設計的不夠合理。我瀏覽過很多這門課程的教材，發現章節內容很類似，都是講怎樣借助于Dreamw eaver的可視化工具制作網頁（比如點什么按鈕插入圖片、插入表格，怎樣用鼠標拖拽的方式制作鏈接等），卻很少涉及手寫代碼。這些基本操作當然只需要很少的課時，但這導致的結果是：（1）不少學生不了解網頁源文件的基本組成格式，在需要手動修改代碼的時候無從下手；（2）對Dreamweaver過于依賴，在今后做動態網站用到了其它編輯器時，完全不會使用。這都歸因于學生對網頁代碼的不理解或是理解的不深入。而網頁代碼（靜態部分）其實涉及的是三塊內容：HTML，CSS，Javascript。教學應該圍繞這三塊內容進行，而不是圍繞Dreamweaver的若干種操作進行。為此，我覺得可以從以下幾方面對教學內容進行改革。

2.1 加深學生對HTML代碼的理解，提升學生手寫代碼的能力

為了切實提高學生對HTML代碼的理解程度，建議先教學生用記事本或其它簡單的純文本編輯器做一個只包含三四個頁面的微型的網站（無需現實意義，只是為了學習代碼而已）。每個頁面只需要一段文字、一個圖片，頁面之間再做上鏈接就可以了。通過這個案例，使學生理解HTML代碼的基本格式，識記最常用的一些標記及其屬性。在這個案例結束之后，再教學生用Dreamweaver做一些相對復雜的網站，學生也就能理解點某個按鈕會生成什么代碼，也就能輕松地在代碼視圖中修改代碼了。

為什么建議教學生先手寫代碼而不是操作Dreamweaver呢？因為要讓學生知道網頁核心的東西就是代碼，之后學習的Dreamweaver也只是自動地生成一些代碼。而且，教學生用手寫代碼的方式做一個簡單的網站，學習代碼的效率也是最高的。如果等到教會了學生操作Dreamweaver之后，再教他們代碼，學生可能會有困惑：既然Dreamweaver可以自動生成代碼，為什么還要人工輸入？而且，講到用Dreamweaver做網站時，代碼量已經很大，讓學生從這大量的代碼中去理解它的基本格式，難度也就加大了。

2.2 加大CSS內容的比重，對CSS的講解要注重系統化

多數教材也會涉及到CSS的知識，但內容少而且零散，主要講授如何在Dream weaver的“CSS規則定義”對話框中，設置文字樣式、圖片樣式、鏈接樣式等，卻沒有涉及應用CSS進行頁面布局的技術。由此可見，教學內容相對于當前實際應用的技術，還存在著很大的滯后性。因為隨著Web標準被越來越廣泛地接受，要求網頁的結構（對應于HTML）和表現（對應于CSS）分離開來，這就要求摒棄傳統的表格布局而采用CSS布局。但是在學校教學中，由于還沿用傳統的表格布局，因此對CSS的講授，只停留在極膚淺的層次。建議教師在講授CSS的知識時，能站在Web標準的高度，系統的講授CSS。可以在講授表格布局之后，分析其劣勢，再引出應用CSS布局的技術。然后，從四個層面系統的講授CSS的知識。

（1）CSS基本屬性（設置文本、圖像樣式等）。

（2）CSS如何定位到HTML標記（CSS選擇器）。

（3）CSS盒子模型（理論基礎，重難點）。

（4）CSS布局（定寬度、變寬度布局）。

2.3 教會學生手寫Javascript代碼

在傳統的教學中，一般把網頁特效作為專門的一個章節來講，具體的內容就是用Dreamweaver提供的一些按鈕生成Javascript代碼，做一些網頁特效（比如鼠標交換圖像等）。其實這種方式生成的代碼可修改性不高，而且過于冗長，又是和HTML代碼在同一個文件，不符合Web標準要求的結構、表現、行為（對應于Javascript）相分離的原則。因此建議教師系統地講授Javascript的知識，教會學生手寫Javascript代碼。當然，這要求增加課時量，而且要有一門高級語言作為基礎。

3 對網頁設計課程教學方法的改革

當前的網頁設計課程的教學方法陷入了兩個明顯的誤區：一是講授的知識點過于零散，缺少足夠的實戰項目將它們貫穿起來。二是從頭到尾全是實戰項目，把所有的知識全放在項目里講。這都是不可取的，前者會使學生學起來枯燥乏味，后者會影響知識本身的系統性。我建議將整個教學分成三段：第一段講授HTML（用表格布局做網頁，先不用CSS）；第二段開始引入CSS，第三段引入Javascript。而每一段再分為兩部分：第一部分是基本理論；第二部分是項目實戰。這樣，學生在第一部分系統地掌握了理論，第二部分再將這些理論靈活運用，這既保證了知識體系不被破壞，又可以避免知識的全盤灌輸而導致的單調和枯燥。

4 結語

網頁設計技術的飛速發展呼喚網頁設計課程的教學改革。本文站在Web標準的高度，結合當前的教學現狀，對教學內容和教學方法提出了一些新的思路和建議。希望這些能為相關教師提供一點參考和借鑒，為這門課程的教學改革起到一定的促進作用。

參考文獻

[1]溫謙.HTML+CSS網頁設計與布局從入門到精通[M].人民郵電出版社，2008.

[2]張春曉.網頁制作與網站建設寶典[M].電子工業出版社，2012.