《網頁設計與制作》課程教學方法與實踐應用

湖北生物科技職業學院 周 全

《網頁設計與制作》課程教學方法與實踐應用

湖北生物科技職業學院 周 全

政府機關、企事業單位以及網絡愛好者都有建設網站的需求，因此“網頁設計與制作”課程的地位非常重要，這也對該課程的教學提出了更高的要求。為提高該課程的教學效果，需要充實教學內容，改革教學方法，注重培養實踐性、應用性人才。本文著重探討了該課程常用的教學方法及實踐應用。

網頁設計；教學方法；實踐

擁有自己的網站是政府機關、企事業單位以及廣大網絡愛好者的共同需求，制作精美的網頁來吸引瀏覽者，提高網站的知名度，是大家共同的目標，而這一切都依賴于網頁的設計和制作技術的運用，因此，也說明了網頁設計與制作課程的重要性。《網頁設計與制作》是近年來計算機領域發展最快和應用最廣的課程之一，現階段急需培養掌握網頁設計、面向不同應用層次的人才。

1.《網頁設計與制作》課程的特點

《網頁設計與制作》課程的特點是涵蓋知識面廣，綜合性和實踐性較強。《網頁設計與制作》不是作為一門課程孤立存在的，它需要依靠多門課程的知識給予支撐。它們相互滲透和依賴，構成一個科學的、完整的課程體系。

《網頁設計與制作》課程的教學以“實用、必須、夠用”為原則，強化培養學生的實踐操作能力及分析應用能力，做到“講、學、練”統一協調。課時分配上注意將理論與實踐進行科學、合理的安排。突出實踐環節，注重培養學生的實踐動手能力，提高理論服務于實踐的意識。

2.《網頁設計與制作》課程的教學方法

2.1 項目教學法

將《網頁設計與制作》課程的總項目確定為開發一個具有一定實用功能的網站，并根據其中涉及到的知識點，將課程總項目劃分為若干子項目。項目以任務書的形式下發給學生，按制定計劃、實施、評價、發布和實際運行等階段寫出時間和目標要求。

2.1.1 制定項目計劃

對項目涉及的問題進行分析，確定操作步驟，選擇方法，制定計劃。在此階段，學生的主要任務是制定項目實施計劃。教師的主要任務是關注學生的做法是否正確，啟發和指導學生。在教學中采用分組法，將班級學生分成多組，每組人數約8人，選派一名“項目負責人”，為了讓大家都能得到鍛煉的機會，一般讓團隊的學生輪流當項目負責人。學生以團隊為單位制定項目計劃。例如，在做“學院主頁”這一項目時，教師將此項目的學習目標和能力目標告訴學生。然后和學生一起分析項目，制定完成項目的基本步驟：首先確定網頁的主題、內容、布局結構、色彩設計方案等以及團隊人員的分工安排；然后根據設計繪制草圖；最后寫成項目計劃書。項目教學注重學生主體作用的發揮和綜合能力的培養，在制定項目計劃過程中，教師要重視學生個性發揮，鼓勵學生形成自己的特色。制定好計劃后，教師要讓每個團隊的“項目負責人”介紹制定的計劃，并說明設計理由。通過對項目計劃的介紹，一方面可以提高學生的表達能力，另一方面，學生之間可以互相啟發和學習。教師適當的把自己的見解和意見告訴學生，幫助提高計劃的可行性。

2.1.2 實施項目計劃

在實施過程中，要求學生注意兩點：一是團隊的合作精神和工作效率；二是要求學生認真記錄每個操作步驟和過程。教師不僅要為學生提供充足的資源，而且要在學生實踐操作過程中邊觀察邊指導。學生在制作網頁時，由于分工不同，處理圖片的學生與設計版式的學生往往不是同一人，處理出來的圖片經常會與布局規格不一致。教師要及時指導學生按照計劃書的設計圖進行設計，指導“項目負責人”組織好團隊，與同學做好交流和溝通。有時候，計劃書里一些預期的設計效果學生不能完成，如層的精確定位、FLASH動畫的透明顯示等，教師可及時進行指導，一方面可加深和鞏固所學的知識點，另一方面，提高學生的學習積極性。

2.1.3 項目評價

學生在完成項目后，教師要求他們進行自評和互評。學生對各自項目自評，不僅有利于學生的自主學習，而且可以改進課程或教學的設計，其作用是重視學生學習主體，重視學生的反思，以促進學生的發展。學生互評是讓學生對學習成果進行共享，從學生的角度發現問題以及提出改進意見，教師要引導學生盡量客觀地從正面進行相互評價。

首先讓每一組同學進行自評，完成自評過程后，請每一組以項目負責人為主，介紹本組設計的網站，在介紹過程中要求說明各自網站的設計的過程，遇到過什么問題，這些問題是如何解決的。其他組的同學可提出問題，讓設計者解釋網站所用的相關技術及特點，隨后進行互評。在評價過程中要充分發揮學生的評價能力，適時引導學生通過自我反思和相互評價了解自己的優勢和不足，學習別人的特長和優點，以評價促進學習，讓學生在互評中相互學習、相互促進，共同提高。最后教師對各項目組的網站進行綜合評價，這一工作很重要，是必不可少的。教師在評價學生網站時不能只進行優劣評價，而應該要指出問題所在，給出具體改進及修改建議等，讓學生去完善網站。

2.1.4 項目歸檔及發布

項目完成后，歸檔工作也是網站工作的一部份。要求每個項目組對各自網站設計時的書面材料的右上角標注編號，并做好各種材料的目錄表。對文本文件，圖像文件，Flash動畫文件、聲音文件、視頻文件，以統一的格式保存，做好這些文件材料書面記錄。記錄好在網站設計過程中使用過的軟件名稱、型號、版本號和相關參數手冊、說明資料等。最后刻錄好光盤，做好用戶手冊，并制作好電子文件的備份。

每個項目組，申請一個域名及網站空間，并把各自的網站傳送至Web服務器中，完成站點的發布工作。進行市場化運作的項目交用戶驗收使用，并要經常對用戶網站進行維護和更新，以提高網站的訪問量，達到好地宣傳效果。

實踐表明，以項目為驅動的教學方法，有效地建立了課堂與社會現實生產生活的聯系，使學生學習更有針對性和實用性，為以后進入實踐和實習打下了基礎；同時也有效調動了學生的積極性，充分發揮了學生的主動性和創新精神。

2.2 案例教學法

從《網頁設計與制作》課程的實際問題出發，精心準備各種典型案例，構建課程的宏觀教學設計。例如，層與導航、書籍專賣、旅游網站、房地產公司網站、個人網站等。以若干個案例為載體，形成循序漸進、種類多樣的項目群，構建完整的教學布局。在案例教學中，首先要確定掌握哪些基本原理，然后，再選擇出能夠說明這些原理、理論的案例來。具體實施步驟如下：

2.2.1 收集和整理素材

這是實施案例教學法的基礎和前提。信息是網站的根本，根據網站主題內容收集各種信息資料。如學院網站包括：學院簡介、專業簡介、招生就業等內容資料。整理資料則是根據將上述收集到的資料進一步挑選和細化，收集到的網頁素材應落實為站標、內容、導航欄等頁面元素。將收集到的資料轉換成網頁所能識別的文件格式。我們可以在各類網站收集或自己制作所需的網頁素材，以便在教學案例中使用。

2.2.2 選擇和設計網頁案例

在選擇和設計教學案例時應注意幾點：一是案例必須具有教學性：通過直觀的網頁案例可以形象生動的展示學習的目標，也使學生能明確所學知識的實用價值，從而提高學生學習的興趣和積極性，這也是運用案例教學的主要目的。二是案例必須具有典型性：所選擇的案例要能充分地考慮理論知識點和操作技能等學習目標，應遵循由簡到繁，由易到難，循序漸進地原則。所選擇和設計的網頁教學案例更要能突出重點，突破難點，真正起到幫助學生理解如何制作和設計網頁的作用。三是案例必須具有針對性：選擇和設計教學案例應針對學生的實際興趣和接受能力來選擇，這樣學生就會學得興致盎然，教師的點撥也會事半功倍。

2.2.3 演示和講解網頁案例

通過案例演示，提出問題，講解案例應用背景，給學生一個切入點，建立感性認識。目的是激發學生的學習興趣、讓學生感到學有所用，從而明確本次課的教學目標。將案例分解為若干個可行的任務，然后在一個個任務的驅動下，逐步完成案例的演示。一個網頁案例往往包含了多個知識點，授課教師在講操作時如果一口氣把整個案例過程講完，學生雖然能聽懂，但不能記住。因此必須分步驟講解，新知識點越多，步驟應分得越細。教師每講完一步就要讓學生練習一步，學生練完、練會后，老師再接著講。這樣直到學生一步一步地跟著老師把整個案例完成為止。教師在授課時一定要注意控制好速度，在講到一些新知識點或學生操作比較生疏時，速度要盡量放慢些。一段時間后，學生有了一些基礎，講課速度可稍快些，特別是一些已經學過的知識點，可以快速講解，甚至可以略過而只講新知識點，以便多節省點時間給學生練習。

2.2.4 總結和應用

在每次課結束前，引導學生進行歸納總結。對本次課的實際意義、重點、難點、容易出錯處等及時進行總結。并針對案例的不足之處，進行引申和提高。注意在這個階段，強調的是“引導”學生，而不是老師講解。

案例源于生活，最終要應用于生活。為了使學生能學以致用、舉一反三、觸類旁通，每次教學結束時及時布置相關的課后練習，使學生在課后進一步復習鞏固，并且將課后作業納入形成性考核的內容之一。同時給出下一次課的學習內容，提示學生預習。

在《網頁設計與制作》課程中采用案例教學法，讓學生對網頁設計的基本理論知識的理解和技巧的掌握更具體化。案例教學法對激發學生的學習興趣、提升學生的學習效率作用十分明顯。

3.網頁設計實踐環節

當學生已基本掌握了本課程的大部分內容時，可以布置一份綜合作業，要求每位學生設計一個網站。要求學生對自己的網站要做到既有鮮明、統一的風格又有完善的內容，將頁面的結構、圖片的位置、鏈接的方式設置合理，做到網頁布局的和諧統一，并且還要做到容易更新等。要做到這些，就必須在制作網站之前，對網站進行一個總體規劃，然后再逐步進行設計。

為了讓學生有良好的創作技巧和獨特的風格，把綜合作業布置之后，先讓學生進行選題，構建出自己的網站結構，再上網查詢相關的資料，然后對網站進行規劃，寫出書面的網站設計方案，教師對每個學生的方案進行審查和評閱，及時指出應改進的地方和存在的問題，符合要求了，學生方可開始制作。

3.1 培養自主學習能力和基于問題式學習能力

綜合作業里貫穿著問題式學習方法，完成綜合作業需要學生發現問題，帶著各種問題，考慮自己要學習哪些內容，在課后自行學習課堂和書本上未曾講過的知識，需要自行查找大量的資料，確定設計方案，獨立完成從設計、測試、排除問題到實現的全過程，通過綜合作業，培養學生靈活運用所學知識解決比較復雜的實際問題的能力。

3.2 培養團隊合作精神

在實際工作中，很多工作都不是一個人能獨立完成的，這就需要團隊合作，以集體的智慧攻克難關。學生在完成綜合作業的過程中，勢必要遇到一些相對比較棘手或者百思不得其解的問題，這個時候同學之間的溝通與交流乃至合作是非常必要和有益的。在對問題的討論過程中不僅能了解對同一問題的不同解決方法，更能加深對知識的理解，同時學生自身的能力也在這一過程中獲得了提高。

3.3 鼓勵學生勇于創新

在布置綜合作業的時候，要給學生留有充分發揮的空間，鼓勵學生勇于創新，最大限度地接觸最新技術，鼓勵學生敢于向難題挑戰。在滿足綜合作業基本設計要求的前提下，鼓勵學生自行添加附加功能，為自己的作品“錦上添花”。在網頁設計綜合作業中，個人網頁設計精彩紛呈，有些沒有講過的技術，學生也能應用。學生的思維是非常活躍的，只要加以正確的引導，在建立了興趣的基礎上，他們總能帶給我們“意外的驚喜”，甚至是驚嘆，教師在這一過程中也能從學生那里學到一些新知識。

學生在完成綜合作業以后，不僅僅增強了動手能力，鞏固和提高了對知識的掌握和理解，更是極大地培養了創新意識與創新思維。我們只有讓學生在快樂的基礎上主動學習、實踐，讓學生在學習的過程中嘗到成功的喜悅，感受到自身能力的提高，增強學習的主動性，才能夠真正達到學習的目的，才能最大限度地將“以學生能力發展為本，培養學生的創新意識與創新思維”的教學理念滲透進教學中去。

4.結束語

《網頁設計與制作》課程教學內容活潑多樣，教學方法靈活多變，目的明確。實踐證明，以上教學方法及實踐環節，都充分調動了學生的學習積極性，體現了以學生為主體的思想，充分體現了理論與實踐的緊密結合，學生既學到了理論知識也掌握了實踐技能，提高了學生的技術應用能力，收到良好的教學效果。

[1]劉英暉.探索項目導向法在《網頁設計與制作》中的運用[J].制造業自動化,2011(6):188-190.

[2]韓勇.案例驅動教學法在《網頁制作》課程分階段教學中的運用[J].電腦與信息技術,2010(4):68-70.

[3]余平.項目驅動在網頁設計實踐教學中的應用[J].實驗室科學,2007(5):94-95.

周全，男，湖北武漢人，湖北生物科技職業學院講師，研究方向：計算機網絡。