《網(wǎng)頁設(shè)計(jì)與制作》課程教學(xué)方法與實(shí)踐應(yīng)用

湖北生物科技職業(yè)學(xué)院 周 全

《網(wǎng)頁設(shè)計(jì)與制作》課程教學(xué)方法與實(shí)踐應(yīng)用

湖北生物科技職業(yè)學(xué)院 周 全

政府機(jī)關(guān)、企事業(yè)單位以及網(wǎng)絡(luò)愛好者都有建設(shè)網(wǎng)站的需求，因此“網(wǎng)頁設(shè)計(jì)與制作”課程的地位非常重要，這也對該課程的教學(xué)提出了更高的要求。為提高該課程的教學(xué)效果，需要充實(shí)教學(xué)內(nèi)容，改革教學(xué)方法，注重培養(yǎng)實(shí)踐性、應(yīng)用性人才。本文著重探討了該課程常用的教學(xué)方法及實(shí)踐應(yīng)用。

網(wǎng)頁設(shè)計(jì)；教學(xué)方法；實(shí)踐

擁有自己的網(wǎng)站是政府機(jī)關(guān)、企事業(yè)單位以及廣大網(wǎng)絡(luò)愛好者的共同需求，制作精美的網(wǎng)頁來吸引瀏覽者，提高網(wǎng)站的知名度，是大家共同的目標(biāo)，而這一切都依賴于網(wǎng)頁的設(shè)計(jì)和制作技術(shù)的運(yùn)用，因此，也說明了網(wǎng)頁設(shè)計(jì)與制作課程的重要性?！毒W(wǎng)頁設(shè)計(jì)與制作》是近年來計(jì)算機(jī)領(lǐng)域發(fā)展最快和應(yīng)用最廣的課程之一，現(xiàn)階段急需培養(yǎng)掌握網(wǎng)頁設(shè)計(jì)、面向不同應(yīng)用層次的人才。

1.《網(wǎng)頁設(shè)計(jì)與制作》課程的特點(diǎn)

《網(wǎng)頁設(shè)計(jì)與制作》課程的特點(diǎn)是涵蓋知識面廣，綜合性和實(shí)踐性較強(qiáng)?！毒W(wǎng)頁設(shè)計(jì)與制作》不是作為一門課程孤立存在的，它需要依靠多門課程的知識給予支撐。它們相互滲透和依賴，構(gòu)成一個(gè)科學(xué)的、完整的課程體系。

《網(wǎng)頁設(shè)計(jì)與制作》課程的教學(xué)以“實(shí)用、必須、夠用”為原則，強(qiáng)化培養(yǎng)學(xué)生的實(shí)踐操作能力及分析應(yīng)用能力，做到“講、學(xué)、練”統(tǒng)一協(xié)調(diào)。課時(shí)分配上注意將理論與實(shí)踐進(jìn)行科學(xué)、合理的安排。突出實(shí)踐環(huán)節(jié)，注重培養(yǎng)學(xué)生的實(shí)踐動手能力，提高理論服務(wù)于實(shí)踐的意識。

2.《網(wǎng)頁設(shè)計(jì)與制作》課程的教學(xué)方法

2.1 項(xiàng)目教學(xué)法

將《網(wǎng)頁設(shè)計(jì)與制作》課程的總項(xiàng)目確定為開發(fā)一個(gè)具有一定實(shí)用功能的網(wǎng)站，并根據(jù)其中涉及到的知識點(diǎn)，將課程總項(xiàng)目劃分為若干子項(xiàng)目。項(xiàng)目以任務(wù)書的形式下發(fā)給學(xué)生，按制定計(jì)劃、實(shí)施、評價(jià)、發(fā)布和實(shí)際運(yùn)行等階段寫出時(shí)間和目標(biāo)要求。

2.1.1 制定項(xiàng)目計(jì)劃

對項(xiàng)目涉及的問題進(jìn)行分析，確定操作步驟，選擇方法，制定計(jì)劃。在此階段，學(xué)生的主要任務(wù)是制定項(xiàng)目實(shí)施計(jì)劃。教師的主要任務(wù)是關(guān)注學(xué)生的做法是否正確，啟發(fā)和指導(dǎo)學(xué)生。在教學(xué)中采用分組法，將班級學(xué)生分成多組，每組人數(shù)約8人，選派一名“項(xiàng)目負(fù)責(zé)人”，為了讓大家都能得到鍛煉的機(jī)會，一般讓團(tuán)隊(duì)的學(xué)生輪流當(dāng)項(xiàng)目負(fù)責(zé)人。學(xué)生以團(tuán)隊(duì)為單位制定項(xiàng)目計(jì)劃。例如，在做“學(xué)院主頁”這一項(xiàng)目時(shí)，教師將此項(xiàng)目的學(xué)習(xí)目標(biāo)和能力目標(biāo)告訴學(xué)生。然后和學(xué)生一起分析項(xiàng)目，制定完成項(xiàng)目的基本步驟：首先確定網(wǎng)頁的主題、內(nèi)容、布局結(jié)構(gòu)、色彩設(shè)計(jì)方案等以及團(tuán)隊(duì)人員的分工安排；然后根據(jù)設(shè)計(jì)繪制草圖；最后寫成項(xiàng)目計(jì)劃書。項(xiàng)目教學(xué)注重學(xué)生主體作用的發(fā)揮和綜合能力的培養(yǎng)，在制定項(xiàng)目計(jì)劃過程中，教師要重視學(xué)生個(gè)性發(fā)揮，鼓勵學(xué)生形成自己的特色。制定好計(jì)劃后，教師要讓每個(gè)團(tuán)隊(duì)的“項(xiàng)目負(fù)責(zé)人”介紹制定的計(jì)劃，并說明設(shè)計(jì)理由。通過對項(xiàng)目計(jì)劃的介紹，一方面可以提高學(xué)生的表達(dá)能力，另一方面，學(xué)生之間可以互相啟發(fā)和學(xué)習(xí)。教師適當(dāng)?shù)陌炎约旱囊娊夂鸵庖姼嬖V學(xué)生，幫助提高計(jì)劃的可行性。

2.1.2 實(shí)施項(xiàng)目計(jì)劃

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

2.1.3 項(xiàng)目評價(jià)

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

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

2.1.4 項(xiàng)目歸檔及發(fā)布

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

每個(gè)項(xiàng)目組，申請一個(gè)域名及網(wǎng)站空間，并把各自的網(wǎng)站傳送至Web服務(wù)器中，完成站點(diǎn)的發(fā)布工作。進(jìn)行市場化運(yùn)作的項(xiàng)目交用戶驗(yàn)收使用，并要經(jīng)常對用戶網(wǎng)站進(jìn)行維護(hù)和更新，以提高網(wǎng)站的訪問量，達(dá)到好地宣傳效果。

實(shí)踐表明，以項(xiàng)目為驅(qū)動的教學(xué)方法，有效地建立了課堂與社會現(xiàn)實(shí)生產(chǎn)生活的聯(lián)系，使學(xué)生學(xué)習(xí)更有針對性和實(shí)用性，為以后進(jìn)入實(shí)踐和實(shí)習(xí)打下了基礎(chǔ)；同時(shí)也有效調(diào)動了學(xué)生的積極性，充分發(fā)揮了學(xué)生的主動性和創(chuàng)新精神。

2.2 案例教學(xué)法

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

2.2.1 收集和整理素材

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

2.2.2 選擇和設(shè)計(jì)網(wǎng)頁案例

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

2.2.3 演示和講解網(wǎng)頁案例

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

2.2.4 總結(jié)和應(yīng)用

在每次課結(jié)束前，引導(dǎo)學(xué)生進(jìn)行歸納總結(jié)。對本次課的實(shí)際意義、重點(diǎn)、難點(diǎn)、容易出錯(cuò)處等及時(shí)進(jìn)行總結(jié)。并針對案例的不足之處，進(jìn)行引申和提高。注意在這個(gè)階段，強(qiáng)調(diào)的是“引導(dǎo)”學(xué)生，而不是老師講解。

案例源于生活，最終要應(yīng)用于生活。為了使學(xué)生能學(xué)以致用、舉一反三、觸類旁通，每次教學(xué)結(jié)束時(shí)及時(shí)布置相關(guān)的課后練習(xí)，使學(xué)生在課后進(jìn)一步復(fù)習(xí)鞏固，并且將課后作業(yè)納入形成性考核的內(nèi)容之一。同時(shí)給出下一次課的學(xué)習(xí)內(nèi)容，提示學(xué)生預(yù)習(xí)。

在《網(wǎng)頁設(shè)計(jì)與制作》課程中采用案例教學(xué)法，讓學(xué)生對網(wǎng)頁設(shè)計(jì)的基本理論知識的理解和技巧的掌握更具體化。案例教學(xué)法對激發(fā)學(xué)生的學(xué)習(xí)興趣、提升學(xué)生的學(xué)習(xí)效率作用十分明顯。

3.網(wǎng)頁設(shè)計(jì)實(shí)踐環(huán)節(jié)

當(dāng)學(xué)生已基本掌握了本課程的大部分內(nèi)容時(shí)，可以布置一份綜合作業(yè)，要求每位學(xué)生設(shè)計(jì)一個(gè)網(wǎng)站。要求學(xué)生對自己的網(wǎng)站要做到既有鮮明、統(tǒng)一的風(fēng)格又有完善的內(nèi)容，將頁面的結(jié)構(gòu)、圖片的位置、鏈接的方式設(shè)置合理，做到網(wǎng)頁布局的和諧統(tǒng)一，并且還要做到容易更新等。要做到這些，就必須在制作網(wǎng)站之前，對網(wǎng)站進(jìn)行一個(gè)總體規(guī)劃，然后再逐步進(jìn)行設(shè)計(jì)。

為了讓學(xué)生有良好的創(chuàng)作技巧和獨(dú)特的風(fēng)格，把綜合作業(yè)布置之后，先讓學(xué)生進(jìn)行選題，構(gòu)建出自己的網(wǎng)站結(jié)構(gòu)，再上網(wǎng)查詢相關(guān)的資料，然后對網(wǎng)站進(jìn)行規(guī)劃，寫出書面的網(wǎng)站設(shè)計(jì)方案，教師對每個(gè)學(xué)生的方案進(jìn)行審查和評閱，及時(shí)指出應(yīng)改進(jìn)的地方和存在的問題，符合要求了，學(xué)生方可開始制作。

3.1 培養(yǎng)自主學(xué)習(xí)能力和基于問題式學(xué)習(xí)能力

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

3.2 培養(yǎng)團(tuán)隊(duì)合作精神

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

3.3 鼓勵學(xué)生勇于創(chuàng)新

在布置綜合作業(yè)的時(shí)候，要給學(xué)生留有充分發(fā)揮的空間，鼓勵學(xué)生勇于創(chuàng)新，最大限度地接觸最新技術(shù)，鼓勵學(xué)生敢于向難題挑戰(zhàn)。在滿足綜合作業(yè)基本設(shè)計(jì)要求的前提下，鼓勵學(xué)生自行添加附加功能，為自己的作品“錦上添花”。在網(wǎng)頁設(shè)計(jì)綜合作業(yè)中，個(gè)人網(wǎng)頁設(shè)計(jì)精彩紛呈，有些沒有講過的技術(shù)，學(xué)生也能應(yīng)用。學(xué)生的思維是非?；钴S的，只要加以正確的引導(dǎo)，在建立了興趣的基礎(chǔ)上，他們總能帶給我們“意外的驚喜”，甚至是驚嘆，教師在這一過程中也能從學(xué)生那里學(xué)到一些新知識。

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

4.結(jié)束語

《網(wǎng)頁設(shè)計(jì)與制作》課程教學(xué)內(nèi)容活潑多樣，教學(xué)方法靈活多變，目的明確。實(shí)踐證明，以上教學(xué)方法及實(shí)踐環(huán)節(jié)，都充分調(diào)動了學(xué)生的學(xué)習(xí)積極性，體現(xiàn)了以學(xué)生為主體的思想，充分體現(xiàn)了理論與實(shí)踐的緊密結(jié)合，學(xué)生既學(xué)到了理論知識也掌握了實(shí)踐技能，提高了學(xué)生的技術(shù)應(yīng)用能力，收到良好的教學(xué)效果。

[1]劉英暉.探索項(xiàng)目導(dǎo)向法在《網(wǎng)頁設(shè)計(jì)與制作》中的運(yùn)用[J].制造業(yè)自動化,2011(6):188-190.

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

[3]余平.項(xiàng)目驅(qū)動在網(wǎng)頁設(shè)計(jì)實(shí)踐教學(xué)中的應(yīng)用[J].實(shí)驗(yàn)室科學(xué),2007(5):94-95.

周全，男，湖北武漢人，湖北生物科技職業(yè)學(xué)院講師，研究方向：計(jì)算機(jī)網(wǎng)絡(luò)。