基于工學結合的《HTML&CSS網(wǎng)站設計》一體化課程建設

摘 要：高職院校擔負著培養(yǎng)面向生產(chǎn)、建設、服務、管理第一線需要的高技能、應用型專門人才的使命，將工學結合和一體化教學綜合運用是高職課程改革的有效方法。本文介紹了《HTML5CSS3網(wǎng)站設計》課程建設思路，以及以培養(yǎng)學生綜合職業(yè)素質(zhì)能力為目標的任務導向一體化課程的教學設計等，為今后的高職課程改革提供一定的經(jīng)驗。

關鍵詞：HTML5CSS3 網(wǎng)站設計 工學結合 一體化 項目導向

一、引言

網(wǎng)站開發(fā)技術日新月異，尤其在近幾年呈現(xiàn)多元化的發(fā)展，在網(wǎng)絡直播、移動APP、微信小程序、桌面應用開發(fā)等應用領域處處可見。HTML5和CSS3是下一代Web應用的基礎，使互聯(lián)網(wǎng)進入了一個嶄新的時代。高職院校網(wǎng)站開發(fā)類課程需要改革創(chuàng)新，將課程教學與市場需求、技術變革相結合，才能適應時代的發(fā)展。

二、課程建設基本情況

《HTML5CSS3網(wǎng)站設計》課程以企業(yè)網(wǎng)站前端開發(fā)的崗位需求與工作過程為導向，將實際的案例項目為載體導入課堂引導基礎教學，通過學習情境設計、教學設計、學習任務書編寫、教學資源開發(fā)等環(huán)節(jié)進行課程內(nèi)容的開發(fā)，從HTML5和CSS3的基礎知識入手，重點講解HTML5和CSS3新增功能和最新前端技術，通過大量實例對HTML5和CSS3進行深入淺出的分析，培養(yǎng)學生的技術應用能力、創(chuàng)新能力及綜合職業(yè)素質(zhì)，充分體現(xiàn)課程的實踐性、職業(yè)性和拓展性。

三、課程設計的理念與思路

1.課程設計理念?！禜TML5CSS3網(wǎng)站設計》課程作為動漫設計與制作專業(yè)的核心課程，秉持“以就業(yè)為導向，以能力為本位”的職業(yè)教育理念，針對高職學生的認知特點，我們從專業(yè)人才需求分析、工作崗位分析、典型工作任務分析、學習領域生成、職業(yè)能力分析、項目設計、教學設計、任務書編寫、教學資源開發(fā)等環(huán)節(jié)對課程進行建設，突出學生的教學主體作用，重視職業(yè)能力的培養(yǎng)，充分體現(xiàn)課程教學的職業(yè)性、實踐性和開放性。

2.課程設計思路?！禜TML5CSS3網(wǎng)站設計》課程以能力為本位、以職業(yè)實踐為主線、以項目課程為主體，打破了傳統(tǒng)的學科體系的模式，將職業(yè)崗位能力中用到的知識點融合在項目中。學生通過各項目的實踐操作，熟練地掌握崗位所需知識和技能，不斷提高解決問題和項目實操能力。

2.1根據(jù)區(qū)域經(jīng)濟的特征與學院的職業(yè)教育能力進行專業(yè)定位。根據(jù)陜西地區(qū)經(jīng)濟的特征與西北地區(qū)的發(fā)展趨勢，結合學院職業(yè)教育能力，將動漫設計與制作專業(yè)定位為培養(yǎng)應用型動漫人才。

2.2根據(jù)專業(yè)定位，對《HTML5CSS3網(wǎng)站設計》課程進行定位。根據(jù)動漫設計與制作專業(yè)定位，深入西北地區(qū)乃至全國相關企業(yè)進行調(diào)研，對專業(yè)的工作崗位和工作任務進行分析，明確專業(yè)的核心能力，進行課程設計，使課程目標與專業(yè)的工作崗位和工作任務相對應，確定《HTML5CSS3網(wǎng)站設計》課程為動漫設計與制作專業(yè)的專業(yè)核心課。

2.3以“工作過程”為導向，參考行業(yè)標準，確定網(wǎng)站設計崗位的工作過程。參考行業(yè)職業(yè)資格標準和行業(yè)專家意見，加強與企業(yè)之間交流合作，并且根據(jù)企業(yè)對從業(yè)人員崗位需求共同修訂教學大綱、課程標準，確定在職業(yè)崗位上，實施工作過程，完成工作任務所需要的職業(yè)知識和技能。

2.4提煉典型工作任務，設計學習情境。根據(jù)網(wǎng)站設計崗位職責的描述和實際工作情況，提煉典型工作任務，通過任務案例驅(qū)動，再根據(jù)課程內(nèi)容的關聯(lián)性設計成學習情境。

2.5實施“教、學、練、做”一體化的教學過程，多種教學模式結合使用。充分利用校內(nèi)外實訓基地，構造一個立體化的多層次的完善的工學結合的實踐教學體系，通過專職教師和企業(yè)工程師的及時指導，順利達到預期的培養(yǎng)效果。采用互動式教學、案例教學相結合的模式，調(diào)動學生學習的興趣和主動性。

2.6注重網(wǎng)站設計能力培養(yǎng)，多角度考核，提高學生的職業(yè)能力和職業(yè)素養(yǎng)?！禜TML5CSS3網(wǎng)站設計》課程以網(wǎng)站設計能力考核為主線，建立一體化的考核體系，包括過程考核和終結性考核兩部分。

四、教學內(nèi)容的組織與安排

《HTML5CSS3網(wǎng)站設計》課程以學習情境為載體，在具體任務中說明知識要求、能力要求、任務描述與分析、相關理論知識以及任務實施的步驟和方法等，實行任務驅(qū)動式教學模式，使教、學、做、練相結合，突出工學結合與職業(yè)素質(zhì)的培養(yǎng)。

1.課程整體內(nèi)容結構分布。在教材原本章節(jié)的基礎上對知識進行重構，將整體教學內(nèi)容設置為6個學習情境，通過大量實例對HTML5、CSS3及JavaScript的各個知識點進行深入淺出的分析和講解；通過引入任務案例，讓學生掌握綜合運用學習情境中各個任務的所有知識點；通過項目實訓，使學生對所學知識得以鞏固掌握和實踐能力的鍛煉；通過綜合項目實訓，使學生從全局角度掌握建立站點、站點初始化設置、切片、效果圖分析、頁面布局、定義公共樣式、定義頁面結構代碼等網(wǎng)站設計的流程。

2.課程單元內(nèi)容安排。每個課程單元即一個學習情境，每個學習情境中包含一個或多個任務。每個任務包括以下四個教學環(huán)節(jié)內(nèi)容：上節(jié)知識點回顧、本課時內(nèi)容學習、任務案例講解和項目實訓。

五、教學方法與教學手段改革

1.采用靈活多樣的教學方法。在課程教學中，通過設置學習情境、引入任務案例、知識點案例、補充案例等，將理論與實踐相結合，運用啟發(fā)式討論法引導學生思考，采取案例教學法、項目驅(qū)動教學法去調(diào)動學生學習的積極性和主動性，提高學生學習的興趣、效率和效果，培養(yǎng)學生分析判斷、獨立思考和解決問題的綜合能力，實現(xiàn)讓動漫專業(yè)網(wǎng)站設計教學對接市場需求，企業(yè)模擬化案例變成教學內(nèi)容，教學模式貼近工作過程。

2.運用現(xiàn)代教育技術、深化教學手段改革。充分利用現(xiàn)有的實驗實訓設備，積極采用現(xiàn)代教育技術手段，使教學內(nèi)容更加豐富充實。先進的教學方法與手段為學生提供了一個更加靈活、方便、使用和廣闊的學習和實踐空間，也使教學效率大大提高，使教學水平邁上了一個新臺階。

3.課堂教學與網(wǎng)絡教學相結合。目前已完成了網(wǎng)絡課程建設，包括課程標準、教案、PPT課件、案例源碼、實訓指導書等教學資源網(wǎng)絡開放，為學生提供了自學的條件，使教學不再受時間和空間的限制，學生可以通過網(wǎng)絡進行本課程的自主學習和創(chuàng)新研究，促進了學生專業(yè)能力和綜合能力的提高實現(xiàn)優(yōu)質(zhì)教學資源共享。

六、結語

目前，《HTML5CSS3網(wǎng)站設計》課程建設已取得一定的成效。但在教學實施的過程中，授課教師發(fā)現(xiàn)學生對知識的自主探究學習能力較為薄弱，教師講授仍然作為課堂教學的主體，因此，我們在培養(yǎng)學生自主學習方面進行了更深入的研究。在項目實訓環(huán)節(jié)，我們打算將百單網(wǎng)的真實企業(yè)項目作為項目實訓環(huán)節(jié)的拓展，讓學生通過制作真實且有收益的網(wǎng)站項目，進一步調(diào)動他們學習的主動性和積極性，從而實現(xiàn)知識的遷移和應用。

參考文獻：

[1]Elizabeth Castro，Bruce Hyslop.HTML5與CSS3基礎教程（第8版）[M].北京：人民郵電出版社，2014，5.

[2]大漠.圖解CSS3：核心技術與案例實戰(zhàn)[M].北京：機械工業(yè)出版社，2014，7.

[3]Mark Pilgrim.HTML5揭秘[M].北京：電子工業(yè)出版社，2010，12.

作者簡介：薄璐（1985—）。陜西西安人。講師。碩士研究生。主要從事計算機學科教學工作。

※基金項目：2014年高等職業(yè)院校專業(yè)綜合改革試點項目——陜西職業(yè)技術學院動漫設計與制作.