鞠杰+牛慶麗

摘要：《網(wǎng)頁(yè)設(shè)計(jì)》是一門實(shí)踐性很強(qiáng)的課程，根據(jù)實(shí)際教學(xué)中遇到的問(wèn)題，將項(xiàng)目化教學(xué)模式引入進(jìn)來(lái)，通過(guò)特定項(xiàng)目的分析、設(shè)計(jì)及測(cè)試，培養(yǎng)了學(xué)生們的研討、溝通及成員之間的分工合作能力，開拓了學(xué)生的項(xiàng)目思維能力。

關(guān)鍵詞：項(xiàng)目化教學(xué)；教學(xué)改革；網(wǎng)頁(yè)設(shè)計(jì)

中圖分類號(hào)：G642 文獻(xiàn)標(biāo)識(shí)碼：A 文章編號(hào)：1009-3044（2016）08-0121-02

Abstract： Web Design is a practical course， according to the problems encountered in the actual teaching， project teaching mode is introduced， in the process of the project can improve the students' cooperative communication， discussion， such as organization and presentation on basic skills.

Key words： higher； the teaching reform； Web Design

1 背景

《網(wǎng)頁(yè)設(shè)計(jì)》是綜合應(yīng)用信息技術(shù)的課程，它主要有：網(wǎng)站建設(shè)dreamweaver、圖像處理fireworks、網(wǎng)頁(yè)動(dòng)畫flash等。為后續(xù)的《網(wǎng)頁(yè)程序設(shè)計(jì)》、《交互式網(wǎng)頁(yè)動(dòng)畫設(shè)計(jì)》等編程課程的順利進(jìn)行做好鋪墊。針對(duì)這門課程使用項(xiàng)目化教學(xué)法可以將比較零碎的知識(shí)內(nèi)容變?yōu)樵S多個(gè)項(xiàng)目塊，然后再根據(jù)項(xiàng)目來(lái)展開具體的教學(xué)，這樣整個(gè)項(xiàng)目過(guò)程學(xué)生們都可以參與其中了.這種教法就是以學(xué)生為中心，教師只是起到一個(gè)協(xié)助的作用，以設(shè)計(jì)的項(xiàng)目為支點(diǎn)、知識(shí)內(nèi)容為依據(jù)來(lái)完成整個(gè)學(xué)期網(wǎng)頁(yè)設(shè)計(jì)的教學(xué)過(guò)程。采用這種實(shí)踐方法可以讓學(xué)生更深切的理解課本中的理論知識(shí)，培養(yǎng)了學(xué)生在實(shí)際項(xiàng)目中解決問(wèn)題的能力，有利于開拓學(xué)生的思維。

2 項(xiàng)目化教學(xué)模式實(shí)施的必要性分析

《網(wǎng)頁(yè)設(shè)計(jì)》包含的內(nèi)容很多，涉及圖形圖像的處理技術(shù)、程序設(shè)計(jì)基礎(chǔ)、動(dòng)畫設(shè)計(jì)、網(wǎng)頁(yè)制作技術(shù)等，其目的是讓學(xué)生能熟練圖像文字及媒體的鏈接、表格的布局、互動(dòng)表單的制作等網(wǎng)頁(yè)制作的操作技能。首先，這些內(nèi)容在規(guī)定的學(xué)時(shí)內(nèi)依據(jù)課程的章節(jié)按順序講完是非常困難的。其次，即使能講完學(xué)生也只能簡(jiǎn)單復(fù)制不會(huì)自己發(fā)揮創(chuàng)造，這樣主觀能動(dòng)性根本不能發(fā)揮出來(lái)，違背學(xué)生普遍的認(rèn)知規(guī)律，最后導(dǎo)致學(xué)生感到枯燥，打擊他們學(xué)習(xí)的積極性。將《網(wǎng)頁(yè)設(shè)計(jì)》的具體教學(xué)內(nèi)容和教學(xué)任務(wù)分別進(jìn)行項(xiàng)目化組織和實(shí)施。根據(jù)這種項(xiàng)目教學(xué)模式可以將規(guī)劃網(wǎng)站和網(wǎng)站整體設(shè)計(jì)的知識(shí)與個(gè)人能力融合起來(lái)，可在一定程度上解決教學(xué)時(shí)數(shù)與教學(xué)內(nèi)容以及教學(xué)中學(xué)生職業(yè)技能的綜合培養(yǎng)難以系統(tǒng)協(xié)同的問(wèn)題。使專業(yè)人才培養(yǎng)的能力目標(biāo)得以實(shí)現(xiàn)。

3 項(xiàng)目化教學(xué)模式的實(shí)施

首先，我選取dreamweaver、fireworks 和flash這三個(gè)軟件來(lái)完成整個(gè)網(wǎng)頁(yè)設(shè)計(jì)的圖片處理、動(dòng)畫設(shè)計(jì)及網(wǎng)站規(guī)劃。以制作網(wǎng)頁(yè)為主線，涉及哪個(gè)知識(shí)點(diǎn)再有針對(duì)性的講授，這樣知識(shí)要點(diǎn)也掌握了，同時(shí)學(xué)生更清楚自己的需求及該知識(shí)的運(yùn)用。

為了更好地將理論知識(shí)應(yīng)用到實(shí)踐中來(lái)，這門課程的知識(shí)講解及實(shí)驗(yàn)都應(yīng)安排在機(jī)房完成，在機(jī)房環(huán)境下可以比較真實(shí)的模擬網(wǎng)站項(xiàng)目的運(yùn)作情況，通過(guò)具體的上機(jī)實(shí)踐將講授內(nèi)容直接應(yīng)用到項(xiàng)目之中。項(xiàng)目化實(shí)施模式可以分為基礎(chǔ)知識(shí)講解、項(xiàng)目的設(shè)計(jì)、項(xiàng)目小組任務(wù)分配、項(xiàng)目小組的實(shí)現(xiàn)和評(píng)價(jià)四個(gè)階段。

對(duì)于沒有任何編程基礎(chǔ)的學(xué)生來(lái)說(shuō)，我采取循序漸進(jìn)的方法來(lái)安排我的項(xiàng)目化教學(xué)。在項(xiàng)目設(shè)計(jì)之前，先講述圖形圖片的處理及動(dòng)畫的制作的原理，并以最直觀的上網(wǎng)瀏覽的方式逐步講解。這種方式在實(shí)踐過(guò)程時(shí)，學(xué)生的興致普遍很高，主動(dòng)學(xué)習(xí)的欲望明顯增高。

在學(xué)生了解并掌握基本網(wǎng)頁(yè)知識(shí)之后開始我們的項(xiàng)目的分析與設(shè)計(jì)。它也是進(jìn)行項(xiàng)目教學(xué)實(shí)施最為關(guān)鍵的一步。我們?cè)谡n堂教學(xué)中設(shè)定的項(xiàng)目要符合教學(xué)大綱要求，既要緊密結(jié)合教材內(nèi)容，也要給學(xué)生留有想象的空間，以供他們可以利用所學(xué)知識(shí)來(lái)發(fā)揮創(chuàng)造。設(shè)計(jì)項(xiàng)目不能過(guò)大，盡量在較短時(shí)間內(nèi)完成整個(gè)項(xiàng)目，最終形成的成果應(yīng)該是一個(gè)比較完整的作品。這樣，既可以保證學(xué)生在完成項(xiàng)目的過(guò)程中努力學(xué)習(xí)，又讓學(xué)生體會(huì)到成功的喜悅。

根據(jù)學(xué)生的興趣愛好和門戶網(wǎng)站的主流趨勢(shì)，我們?cè)O(shè)計(jì)了這樣幾個(gè)項(xiàng)目：門戶網(wǎng)站的欣賞、鄭州科技學(xué)院校友錄（學(xué)生參與度較高的一個(gè)子網(wǎng)站）、個(gè)人網(wǎng)站（模擬QQ空間或個(gè)人博客）、淘寶網(wǎng)個(gè)人網(wǎng)店板塊及優(yōu)秀企業(yè)網(wǎng)站。

門戶網(wǎng)站的欣賞：讓學(xué)生瀏覽搜狐、新浪、百度、雅虎等大的門戶網(wǎng)站，通過(guò)瀏覽這些主流網(wǎng)站可以讓學(xué)生對(duì)網(wǎng)站布局、圖文排版、色彩背景搭配等等進(jìn)行初步了解，同時(shí)也會(huì)產(chǎn)生學(xué)好網(wǎng)頁(yè)設(shè)計(jì)這門課程的想法。另外通過(guò)學(xué)生平時(shí)上個(gè)人QQ空間、個(gè)人微博等積累的個(gè)人網(wǎng)站知識(shí)，都會(huì)對(duì)自己制作網(wǎng)頁(yè)有一定的影響。

鄭州科技學(xué)院校友錄：這是一個(gè)具有我們學(xué)校特色的網(wǎng)站，可以作為與學(xué)校往屆師兄師姐交流的一個(gè)子網(wǎng)站。通過(guò)使用表格布局或DIV+CSS設(shè)計(jì)布局，可以讓學(xué)生掌握幾種網(wǎng)頁(yè)布局的方法。制作導(dǎo)航板塊時(shí)需要自己動(dòng)手制作漂亮的導(dǎo)航條，這樣就激發(fā)了學(xué)生使用fireworks制作想要的圖片，借機(jī)可以讓學(xué)生學(xué)習(xí)如何處理圖片的知識(shí)和技巧。利用這種方式學(xué)生比較容易接受，可以達(dá)到較好的效果。在展示歷屆學(xué)長(zhǎng)照片時(shí)采用“marquee”標(biāo)記來(lái)制作滾動(dòng)圖片時(shí)，采用先欣賞引導(dǎo)再講述嘗試制作的模式，讓每一個(gè)學(xué)生都產(chǎn)生較大的興趣，自然會(huì)事半功倍。

個(gè)人網(wǎng)站：為了更好的展示自己，學(xué)生們可以自己積攢生活或?qū)W習(xí)的素材用網(wǎng)頁(yè)的形式展現(xiàn)出來(lái)，供更多的人認(rèn)識(shí)自己。因此設(shè)計(jì)個(gè)人網(wǎng)站項(xiàng)目可以調(diào)動(dòng)學(xué)生們學(xué)習(xí)的積極性與主動(dòng)性。很多學(xué)生每天會(huì)逛一逛QQ空間，對(duì)這里的布局非常熟悉，讓他們動(dòng)手模擬這類網(wǎng)站也很有興趣。通過(guò)制作這類個(gè)人網(wǎng)站可以掌握網(wǎng)站素材的制作技能，也就是圖片的處理，以及使用不同的布局方法來(lái)制作網(wǎng)站的技巧與方法。

淘寶網(wǎng)個(gè)人網(wǎng)店板塊：隨著網(wǎng)絡(luò)技術(shù)的飛速發(fā)展，便捷的網(wǎng)絡(luò)購(gòu)物已經(jīng)成為購(gòu)物的主流方式。這個(gè)項(xiàng)目需要老師提供需求和技術(shù)支持，學(xué)生分組完成項(xiàng)目實(shí)施過(guò)程。目前淘寶網(wǎng)站是非常成熟的購(gòu)物類網(wǎng)站，其中的個(gè)人網(wǎng)店板塊的需求分析師非常明確的。使用需求分析之后，可以根據(jù)小組的討論結(jié)果商定一個(gè)合適的LOGO和色彩搭配進(jìn)行主題的設(shè)計(jì)。這就要求小組成員之間的分工和合作、討論和商議，無(wú)形之中就將課本知識(shí)的內(nèi)容應(yīng)用到整個(gè)項(xiàng)目過(guò)程中了，不僅如此還鍛煉學(xué)生們之間協(xié)作溝通能力、研討、組織等基本能力。

優(yōu)秀企業(yè)網(wǎng)站：在目前的互聯(lián)網(wǎng)飛速發(fā)展的大背景下，不論企業(yè)規(guī)模的大小，都想擁有自己的網(wǎng)站來(lái)展示自己的企業(yè)，因此設(shè)計(jì)該這個(gè)項(xiàng)目特別符合社會(huì)的需求。班級(jí)項(xiàng)目小組應(yīng)在老師的引導(dǎo)下，完成從網(wǎng)站的分析、設(shè)計(jì)和實(shí)現(xiàn)的全過(guò)程，在項(xiàng)目中可以規(guī)劃出該企業(yè)的主頁(yè)、新聞動(dòng)態(tài)板塊、人力資源板塊、企業(yè)文化板塊、服務(wù)與支持板塊等。學(xué)生們通過(guò)制作這樣一個(gè)完整的企業(yè)項(xiàng)目為以后進(jìn)入社會(huì)接手這種類型的項(xiàng)目打好堅(jiān)實(shí)的基礎(chǔ)。

其實(shí)每個(gè)項(xiàng)目的實(shí)現(xiàn)需要分配出項(xiàng)目任務(wù)，在課堂上組織的每個(gè)項(xiàng)目我們都會(huì)分成若干個(gè)子任務(wù)，根據(jù)項(xiàng)目的具體操作步驟分配項(xiàng)目小組，每個(gè)小組由4-6人組成，可以分別擔(dān)任各種角色，包括客戶、經(jīng)理、分析員、程序員、測(cè)試員、驗(yàn)收人員等等。這些項(xiàng)目的角色要輪流擔(dān)當(dāng)，互換角色，讓每一個(gè)角色都能親自體驗(yàn)。通過(guò)這種分工合作讓學(xué)生們的智慧得到最大程度的應(yīng)用。

接下來(lái)就是項(xiàng)目實(shí)現(xiàn)，在這一過(guò)程中，各個(gè)小組結(jié)合其自身的項(xiàng)目計(jì)劃來(lái)實(shí)施項(xiàng)目。具體來(lái)說(shuō)，每一個(gè)小組成員都必須做到下面的兩個(gè)要求：一方面，必須保證具備團(tuán)結(jié)協(xié)作意識(shí)，提升工作效率；另一方面，每一個(gè)小組成員都必須詳細(xì)記錄具體的項(xiàng)目操作流程。在項(xiàng)目實(shí)施的過(guò)程中，教師不應(yīng)該放任自流，而必須進(jìn)行適當(dāng)?shù)囊龑?dǎo)?？紤]到每一個(gè)小組成員在進(jìn)行主頁(yè)的設(shè)計(jì)過(guò)程中，存在著分工的差異，負(fù)責(zé)圖片處理工作的學(xué)生和負(fù)責(zé)版式布局的設(shè)計(jì)的學(xué)生一般并非同一個(gè)人，這就導(dǎo)致處理得到的圖片可能會(huì)和布局規(guī)格不吻合。這就要求教師引導(dǎo)學(xué)生根據(jù)設(shè)計(jì)圖來(lái)科學(xué)合理地設(shè)計(jì)網(wǎng)頁(yè)。在具體實(shí)踐的過(guò)程中，學(xué)生可能不能夠達(dá)到計(jì)劃書中的部分預(yù)期的設(shè)計(jì)效果，比如，不能夠準(zhǔn)確地定位內(nèi)容等等，教師有必要加以引導(dǎo)和幫助，以便保證項(xiàng)目的順利完成。

最后是項(xiàng)目評(píng)價(jià)，包括自我評(píng)價(jià)和教師評(píng)價(jià)兩種。 首先小組成員自我評(píng)估，然后教師會(huì)根據(jù)項(xiàng)目分工情況進(jìn)行整體和細(xì)節(jié)審查與評(píng)價(jià)。根據(jù)提出的意見，每個(gè)項(xiàng)目小組成員之間再進(jìn)行整改，不會(huì)的技術(shù)問(wèn)題有老師和學(xué)生們共同討論，最終找到解決的辦法。

4 注意事項(xiàng)

我們進(jìn)行的項(xiàng)目化教學(xué)在其實(shí)施的過(guò)程中，學(xué)習(xí)的主體是學(xué)生，充當(dāng)引導(dǎo)者角色的是教師。因此在選擇教學(xué)項(xiàng)目時(shí)不但要結(jié)合實(shí)際更要有典型性，在課堂上實(shí)踐的項(xiàng)目既能用到課本的基礎(chǔ)知識(shí)，又能通過(guò)該項(xiàng)目使學(xué)生觸類旁通。另外就是教師的角色問(wèn)題，老師本人要徹底改變傳統(tǒng)的在講臺(tái)講授模式，要從單一課堂的講授角色轉(zhuǎn)變?yōu)轫?xiàng)目小組的技術(shù)顧問(wèn)角色。因?yàn)槊總€(gè)學(xué)生的基礎(chǔ)和理解接受能力的不同，所以來(lái)時(shí)也要兼顧項(xiàng)目小組成員的個(gè)性差異，做到不同能力的學(xué)生可以完成不同的項(xiàng)目，能力較強(qiáng)的學(xué)生引導(dǎo)更深層的學(xué)習(xí)。

5 結(jié)束語(yǔ)

通過(guò)引入項(xiàng)目化教學(xué)方法超越了傳統(tǒng)式的教學(xué)模式，同時(shí)也充分地調(diào)動(dòng)了學(xué)生們的學(xué)習(xí)《網(wǎng)頁(yè)設(shè)計(jì)》這門課的積極性，更拓寬了學(xué)生的思維模式、發(fā)揮了潛能、培養(yǎng)了個(gè)性和團(tuán)隊(duì)精神，更提高了學(xué)生的自信心和成就感。使用這種教學(xué)模式讓課堂教學(xué)不再是單純的老師教學(xué)生學(xué)，而變?yōu)閷W(xué)生為主線從始至終參與到項(xiàng)目的全過(guò)程之中。學(xué)習(xí)知識(shí)不再是盲目地學(xué)習(xí)，而是主動(dòng)的積極的學(xué)習(xí)，實(shí)現(xiàn)了學(xué)生和教師的“雙贏”。

參考文獻(xiàn)：

[1] 吳建. 項(xiàng)目化教學(xué)在VB程序設(shè)計(jì)教學(xué)中的探索與實(shí)踐[J]. 文教資料， 2006（30）：108-109.

[2] 孫景民. 項(xiàng)目教學(xué)在Excel教學(xué)中的實(shí)踐與探索[J]. 職業(yè)教育研究， 2006（9）：42.

[3] 李錦元， 趙軼. 高職院校教師在項(xiàng)目教學(xué)中的作用[J]. 山西財(cái)政稅務(wù)專科學(xué)校學(xué)報(bào)，2008（2）：69-72.

[4] 徐朔. 項(xiàng)目教學(xué)法的內(nèi)涵、教育追求和教學(xué)特征[J]. 職業(yè)技術(shù)教育， 2008（28）.