基于工作過程的“網頁設計與制作”課程改革的探索與實踐

摘要:“網頁設計與制作”課程教學改革的出發點是提高學生的網站實戰技能。本文提出課程應以典型的網站項目為核心，按照實際開發的工作過程將項目分解為若干個任務，并按照任務實施的需要來進行相關知識和技能的培養和訓練。

關鍵詞:工作過程;教學改革;網頁制作;教學方案

工作過程導向的教學思想和方法是在學習與借鑒德國“雙元制”職業教育經驗、改革我國職業教育的過程中，逐步在我國教育界受到重視。所謂“工作過程”，是指在企業里為完成一件工作任務并獲得工作成果而進行的一個完整工序[1]。工作過程的核心是行動導向，強調學生是學習過程的中心，教師是學習過程的組織者與協調人，教師采取“資訊、計劃、決策、實施、檢查、評估”的整體行動，在教學中與學生互動，讓學生通過“獨立地獲取信息、獨立地制定計劃、獨立地實施計劃、獨立地評估計劃”，使學生在實踐中掌握職業技能、習得專業知識，從而構建屬于自己的經驗、知識或能力體系[2]。

以工作過程為導向構建教學內容和教學方法的具體思路是:根據確定的職業崗位，先分析其典型工作過程與工作任務，得出完成工作任務對應的職業要求，按照職業要求設計專業知識模塊和項目案例，分解工作任務，形成教學情境。從而實現按照職業成長規律與學習規律將職業能力從簡單到復雜，從單一到綜合進行整合，歸納出相應的行動領域，再轉換為學習領域。

1典型工作任務與職業能力分析

根據計算機類專業畢業生的就業調查情況，大多

數學生在中小型軟件公司從事網站開發工作，其典型工作過程如圖1所示:

圖1Web網站開發工作過程

針對該工作過程進行分析，可以得出Web網站開發工程師崗位對應的典型工作任務有:網站的規劃與策劃、網頁界面設計，網頁布局，動畫設計，Web后臺與前臺的整合，項目程序開發等。典型工作任務及其對應的職業能力如表1所示:

作者簡介:劉萬輝(1978-)，男，河南鞏義人，講師，工程師，碩士，研究方向為計算機網絡、多媒體與網頁設計。獲江蘇省多媒體課件一等獎1項、二等獎1項，主編教材2部，參編教材2部，制作橫向企、事業單位網站200余項。

表1典型工作任務與職業能力分析表

工作任務職業能力

網站的規劃與策劃網站的規劃與策劃能力

網頁界面設計網頁色彩搭配與網站布局能力

利用Photoshop進行網站效果圖的設計能力

利用Flash進行動畫制作的能力

網頁布局與編輯符合Web2.0標準的XHTML代碼編輯能力

利用DIV+CSS實現網頁布局能力

利用JavaScript實現DOM操作的能力

表格與框架的布局能力

CSS樣式表的運用能力

Web前臺與后臺的代碼融合CMS系統地搜索能力

CMS系統的使用能力

項目程序開發使用ADO訪問數據庫的能力

利用Session、Cookie等實現頁面間傳值、身份驗證、權限管理的能力

利用Web控件實現業務邏輯的能力

利用Asp實現簡單的MIS系統地的能力

以上這些能力目標，在教學領域中主要對應的是網頁設計與制作中應完成的教學任務。但目前高職院校的網頁設計與制作教學中均存在很多問題，制約和影響了能力目標的實現。問題之一:雙師師資不足，教師能夠正常講授課程但是沒有項目開發的工程經驗;問題之二:教師選用的案例過于簡單，脫離實際工作過程。問題三:教學過程中無法體現關鍵知識點的前后連續性，這樣的案例無法滿足實際工作要求，也無法激發學生的學習興趣。

2將項目資源轉化為教學資源的教學情境

設計

要解決教學中存在的一系列問題，順利實現“網頁制作與網站設計”課程的教學目標，首要解決的問題就是如何將項目資源轉化為教學資源。在目前高職院校中，每年都有一定的數字化建設項目，各處室網站改版，例如專題學習網站，同時在網絡上也很容易找到一些網站外包項目，在社會上也很容易找到一些

橫向的網站項目。從中可見，并不缺乏真實的網站項目，但是，如何將這些項目資源轉化為教學資源，是一個需要反復實踐的課題。本人從2004年開始，以我院創新實驗室的近200多名學生作為試點，先后開發了企事業單位網站近200個，開發教學專題網站30多個，幾年來，這些項目都以不同程度的在向教學資源的轉化，從而對教學形成了良性的循環，每屆畢業的學生都能夠從中受益。為了更好的指導教學，將項目資源轉化為教學資源，我們構造了以網站欣賞、網站規劃規范、網站效果圖設計、網頁色彩與布局設計、網頁動畫設計、HTML語言基礎、網頁布局與編輯、模板與庫的應用、層疊樣式表CSS、DIV+CSS網頁布局、靜態網站動態化、動態程序開發、綜合教學案例、項目開發實訓14個模塊為主教學單元，然后將教學內容進行了重構，整理成5個典型的工作情境，編寫了基于工作過程的《網頁設計與制作教程》，教材內容體系清晰，教學模塊符合崗位需求。表2是結合我院實際情況，制定的關于網頁設計與制作的整體教學情境。

表2“網頁設計與制作”教學情境設計

學習情境子情境設計

情境1:教學成果申報網站建設項目基礎與流程設計、效果圖設計與切片、網站的后期編輯、網站的發布與測試

情境2:書法家莊輝個人網站建設網站項目策劃、主頁效果圖設計與制作、模板頁效果圖的設計與制作、網站切片與導出、網站動畫的設計、網站的后期編輯、HTML學習、CSS樣式表的應用、項目完善

情境3:英語等級考試專題學習網站建設項目前期組織工作、效果圖的設計與切片與動畫設計、網頁的后期編輯、代碼融合

情境4:軟件項目化綜合實訓精品課程網站項目前期策劃、效果圖的設計與切片與動畫設計、DIV+CSS布局網站、使用模板與庫完善網站

情境5:班級通訊錄管理系統的實現前期策劃與效果圖的設計、框架布局圖形網站、登錄系統的實現、通用查詢系統的實現、通訊錄管理系統的實現

學習情境是學習領域教學內容的具體化。表2中學習情境的設計思路是:按照Web網站項目開發實際工作過程，將典型的工作任務融入到為這5個工作情境中，這些工作情境從個體上看，都代表了某一類網站;從整體上看，則是難度逐步加深，推動了工作進度，最終完成5種類型的網站項目、網頁設計與制作的理論知識點技能要求，分布在這些工作情境之中，它和傳統教學順序完全不同，教學內容設計完全取決于實際開發需要，從而大大激發了學生的興趣，達到了“學中做、做中學”的效果，學生的學習主觀能動性得到了發揮。

3教學模式與教學過程的設計

教學模式采用工作流程模塊化，模塊內容案例

化，課程考核過程化，理論實踐一體化的教學模式，充分實現教學做一體化的教學體系。

工作流程模塊化:根據課程培養目標，遵循基于工作過程的課程開發與設計理論，聽取IT專家以及歷屆畢業生的意見，重組教學內容。

模塊內容案例化:每一模塊下都設立了相應實踐教學的教學案例，供學生學習參考。

課程考核過程化:采用形成性過程考核的方式，形成了以能力培養為目的的考核方式。

理論實踐一體化:通過理論實踐一體化的教學模式，使理論與實踐有機融合，教學做合一，不但培養了學生的專業能力，還充分培養了學生的方法能力、社會能力和職業素養。

以項目驅動為主線，遵循教育教學規律，由簡單到復雜，實現教學目標。如圖2所示:

完善的、科學的、規范的、立體化的課程資源

圖2教學模式的設計

教學內容與教學模式確定后，教學過程的實施，首先進行項目分組，然后給各組下發任務單，采用項目資訊、計劃與決策、項目實施、項目檢查與評價四

步教學法。整個教學過程采用過程考核。

4教學的考核方式

考核方式如表3所示。

表3“網頁設計與制作”教學考核方法

考評

方式過程考評(項目考評)期末考評

(項目考評)

素質考評工單考評實操考評

10分20分30分40分

考評

實施由指導教師根據學生表現集中考評由主講教師根據學生完成的工單情況考評有指導教師對學生進行項目操作考評按照教考分離的原則，由學校教務處組織考評

考評

標準根據遵循實驗室規則，能夠團結同學，配合小組工作任務等情況打分(10分)預習內容(10分)

項目操作過程有計劃與實施記錄(10分)任務方案正確(10分)

操作過程正確(10分)

任務完成良好(10分)建議采用項目考試，已完成真實項目的能力來考核

注:1.造成設備損壞的項目計0分。

2.課程結合學習過程可以采用以項目代考、以獎代考、以認證代考。

5對教師的要求

要實施上述教學模式，對教師的能力有以下幾點要求:

(1) 具有獨立開發中型商業網站的的水平和能力;

(2) 具備一定的項目設計能力和項目組織經驗;

(3) 課內實踐部分指導教師必須具備現場實際工作經歷2年以上;

(4) 具備設計基于行動導向的教學法的設計應用能力;

(5) 能采用先進的教學方法，具有比較強的駕馭課堂的能力;

(6) 具有良好的職業道德和責任心。

6教學效果和體會

在經過2006級學生小班化試點后，我們在2007級計算機軟件技術專業學生中應用了基于工作過程導向的，將真實項目資源轉化為教學資源的任務驅動教學方法，實踐證明，在實際教學過程中，學生能夠主動發現問題，并積極主動去解決問題，特別是由于所有的情境都基于同一項目，學生在做后面的實訓時，經常能發現以前作業的不足之處，從而主動將業

余時間用來做網站項目，部分同學甚至在學期末將本學期20個工作任務全部重做了一遍，大多數學生具備了學習的主動性和能動性，明確了知識模塊的聯系和課程的學習目標，為后繼課程的學習打下了堅實的基礎。

當然，衡量教學效果最重要的是學生的就業質量和可持續發展能力。目前，2006級小班化試點的學生已經走上工作崗位，截至到2009年6月底，兩個班級就業率達到95%以上，對口就業率達到70%以上。其中上海壹擇軟件公司分3批招收了4名學生，南京樂天堂科技有限公司分2批招收了5名學生，蘇州電信軟件開發中心也分2批招收了4名學生，蘇州宏拓科技有限公司也分2批招收了5名同學，學生質量得到了用人單位的肯定。

在實踐過程中，發現存在如下問題與不足:由于整個教學情境在邏輯上前后聯系，對于動手慢的同學前一個任務沒有完成，就失去了實現當前任務的基礎。針對這一問題，在下一步工作中，需加強過程管理和課余輔導，鼓勵同學間相互幫助與溝通，先進帶動后進;另外，需強化基礎圖象處理訓練與審美訓練，培養良好的界面設計能力，提高網站設計能力。

作為江蘇省首批示范性高等職業建設院校之一，我院積極學習國內外先進的教學模式和教育思想，根據專業和課程的具體情況，努力探索適合自己的教學改革之路。以工作過程為導向，將真實項目資源轉化為教學資源，調動學生的主觀能動性，在教師引導下來實施教學進程，是培養學生理論知識、實踐技能和學習能力的重要手段，是能力本位教學模式的體現。而這種教育模式也對教師的教學水平、責任意識、實踐經驗等提出了更高的要求。開發多種類型的課程模式，不斷深化高職教學改革，提高教學質量和就業質量，是一線教師義不容辭和長期艱巨的任務。

參考文獻:

[1] 馬英. 工作過程導向的高職機械制圖教學探索[J]. 工程圖學學報，2008，29(4):137-141.

[2] 姜大源. “行為”、“活動”、與“行動”辯——“行動導向”教學管見[J]. 職教通訊，2003(1):42-43.

[3] 趙志群. 職業教育與培訓新概念[M]. 北京:科學出版社，2003:97.

Teaching Research and Practice on Webpage Design and Making Course Based on Working Process

LIU Wan-hui， SONG Gui-ling

(Huaian College of Information Technology， Huaian 223003， China)

Abstract: The point of departure of the teaching reform of the item course Webpage Design and Making is to raise students actual making skills of website. The course takes the typical website item as the core， resolves the item into some tasks according to the work process of the actual development， and carries on the development and training of the related knowledge and skills according to the demand that tasks carry out.

Key words:working process; teaching reform; webpage making; teaching plan

(編輯:彭遠紅)