高職計(jì)算機(jī)《HTML+CSS網(wǎng)頁設(shè)計(jì)》課堂教學(xué)改革實(shí)踐探析

朱錦晶

摘要：該文以湖州職業(yè)技術(shù)學(xué)院為例，介紹了高職計(jì)算機(jī)類專業(yè)基礎(chǔ)課《HTML+CSS網(wǎng)頁設(shè)計(jì)》課堂教學(xué)改革的方法、創(chuàng)新舉措和改革效果。

關(guān)鍵詞：HTML+CSS；網(wǎng)頁設(shè)計(jì)；教學(xué)改革

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

1概述

隨著Web技術(shù)的不斷發(fā)展，網(wǎng)站越來越成為人們?yōu)g覽信息的一個(gè)重要媒介，越來越多的人關(guān)注網(wǎng)站的開發(fā)。伴隨著移動(dòng)互聯(lián)網(wǎng)、電子商務(wù)的飛速發(fā)展，計(jì)算機(jī)就業(yè)方向中一條以HTML5為方向的就業(yè)領(lǐng)域正在不斷地?cái)U(kuò)大，比如：Web前端開發(fā)工程師、HTML5開發(fā)工程師、Web APP開發(fā)工程師等崗位。

以Web前端開發(fā)工程師為例，這是一個(gè)很新的職業(yè)，為了滿足人們?cè)絹碓礁叩挠脩趔w驗(yàn)，前端開發(fā)的技術(shù)難度也越來越大，這一職業(yè)開發(fā)技術(shù)包括三個(gè)要素：HTML、CSS和JavaScript。

2課程簡介

HTML（HyperText Markup Language）超文本標(biāo)記語言，CSS（Cascading Style Sheet）層疊樣式表，是網(wǎng)頁制作的基礎(chǔ)語言，是每個(gè)前端開發(fā)工程師必須掌握的內(nèi)容?！禜TML+CSS網(wǎng)頁設(shè)計(jì)》是計(jì)算機(jī)相關(guān)專業(yè)學(xué)生必須掌握的一門基礎(chǔ)核心課，2012年起設(shè)置，開設(shè)在新生入學(xué)的第一個(gè)學(xué)期。其中包括HTML標(biāo)簽，基本的語法、說明，CSS樣式的屬性等內(nèi)容，是一門知識(shí)點(diǎn)多、應(yīng)用面廣、實(shí)用性強(qiáng)的基礎(chǔ)課程。

課程目標(biāo)旨在培養(yǎng)學(xué)生利用記事本編寫HTML和CSS代碼來實(shí)現(xiàn)網(wǎng)頁設(shè)計(jì)的能力。通過本課程的學(xué)習(xí)，使學(xué)生理解HTML文檔結(jié)構(gòu)，掌握HTML基本語法，掌握常用HTML標(biāo)簽的使用，學(xué)會(huì)使用CSS設(shè)置網(wǎng)頁元素的樣式，為后續(xù)的Web開發(fā)打下基礎(chǔ)。

主要教學(xué)內(nèi)容有：HTML文檔結(jié)構(gòu)、常見網(wǎng)頁元素、表格的使用、層的應(yīng)用、框架的作用、表單的使用、網(wǎng)頁模板、用CSS設(shè)置字體與顏色、用CSS實(shí)現(xiàn)文本排版和DIV與CSS樣式的定位技術(shù)。

教學(xué)對(duì)象為計(jì)算機(jī)信息管理、計(jì)算機(jī)網(wǎng)絡(luò)技術(shù)專業(yè)大一新生，生源上既有普高生、三校生，也有文科生、理科生，地域上來自五湖四海，學(xué)生計(jì)算機(jī)基礎(chǔ)參差不齊。

建議安排在多媒體機(jī)房，安裝極域軟件，可以監(jiān)控學(xué)生電腦，方便教師廣播操作演示，也可以廣播學(xué)生屏幕。

3改革創(chuàng)新的舉措

3.1課程教學(xué)重點(diǎn)解決問題

《HTML+CSS網(wǎng)頁設(shè)計(jì)》自2012年起設(shè)置為計(jì)算機(jī)信息管理專業(yè)、計(jì)算機(jī)網(wǎng)絡(luò)技術(shù)專業(yè)的專業(yè)基礎(chǔ)課程，在新生入學(xué)的第一個(gè)學(xué)期就開設(shè)。經(jīng)過了三年的教學(xué)實(shí)踐，發(fā)現(xiàn)該課程存在著以下問題：

1）客觀原因：新生第一個(gè)學(xué)期因報(bào)道、軍訓(xùn)等事宜，大約少一個(gè)月，故教學(xué)時(shí)間緊張，很多教學(xué)內(nèi)容只能相應(yīng)壓縮或減少，因課時(shí)緊張，無法真正實(shí)施分層分級(jí)教學(xué)，項(xiàng)目化教學(xué)，很多難點(diǎn)、細(xì)點(diǎn)只能舍棄；

2）教學(xué)方法：基本采用的是案例驅(qū)動(dòng)等教學(xué)法，傳統(tǒng)的案例教學(xué)法主要還是教師教授、學(xué)生被動(dòng)聆聽的方式，沒有真正做到工學(xué)結(jié)合，項(xiàng)目和任務(wù)設(shè)置過于簡單，與實(shí)際應(yīng)用脫節(jié)，不能滿足就業(yè)要求，導(dǎo)致學(xué)生不能很好地運(yùn)用知識(shí)解決實(shí)際應(yīng)用問題；

3） 教學(xué)團(tuán)隊(duì)：相關(guān)課程任課教師大多數(shù)是畢業(yè)后直接進(jìn)入高校，從高校到高校，并沒有在企業(yè)實(shí)踐過，缺乏真實(shí)的網(wǎng)站開發(fā)經(jīng)驗(yàn)，只能照本宣科，教師實(shí)踐操作能力不強(qiáng)，導(dǎo)致學(xué)生的動(dòng)手能力更差；

4） 使用教材：目前課程所使用的教材主要有兩種：一種是傳統(tǒng)的，按照相關(guān)知識(shí)點(diǎn)羅列，重點(diǎn)難點(diǎn)不明確，沒有結(jié)合實(shí)際應(yīng)用項(xiàng)目，實(shí)踐操作性不強(qiáng)；另一種是項(xiàng)目開發(fā)類教材，介紹幾個(gè)簡單、虛擬的網(wǎng)站，與企業(yè)真實(shí)開發(fā)項(xiàng)目有一定的差距，不能實(shí)際應(yīng)用，不能更好地培養(yǎng)學(xué)生的職業(yè)能力和職業(yè)素養(yǎng)；

5） 學(xué)生計(jì)算機(jī)基礎(chǔ)參差不齊，學(xué)習(xí)興趣也有明顯差別；學(xué)生學(xué)習(xí)積極性不高，自主學(xué)習(xí)能力差，疲于應(yīng)付，被動(dòng)地接受相關(guān)知識(shí)與技能，獨(dú)立解決問題的能力差，網(wǎng)頁制作過程中缺乏創(chuàng)造力。

3.2教學(xué)改革方法

教學(xué)方法將從組織安排、課程項(xiàng)目設(shè)置進(jìn)行改革，從企業(yè)引進(jìn)實(shí)際的網(wǎng)站開發(fā)項(xiàng)目，從實(shí)際的應(yīng)用需求出發(fā)將其分解成若干個(gè)子項(xiàng)目，再細(xì)化到任務(wù)，采用由淺入深、由易到難、由局部到整體的順序，將網(wǎng)頁設(shè)計(jì)基礎(chǔ)、HTML語言、CSS樣式表等知識(shí)點(diǎn)融入實(shí)際設(shè)計(jì)中，使學(xué)生能掌握網(wǎng)站前端開發(fā)過程中必學(xué)的理論知識(shí)，提升學(xué)生項(xiàng)目開發(fā)的水平。

教學(xué)內(nèi)容預(yù)計(jì)包括12個(gè)項(xiàng)目，26個(gè)任務(wù)，分為基礎(chǔ)篇、提高篇和進(jìn)階篇。基礎(chǔ)篇，使學(xué)生學(xué)會(huì)使用HTML設(shè)計(jì)網(wǎng)站的基本頁面，掌握網(wǎng)站發(fā)布與推廣的方法；提高篇，使學(xué)生能夠通過CSS實(shí)現(xiàn)網(wǎng)站的整體表現(xiàn)上的美化與優(yōu)化，從而改善網(wǎng)站的整體視覺效果；進(jìn)階篇，使學(xué)生能夠使用簡單的動(dòng)作腳本進(jìn)一步提升網(wǎng)站的靈活性和交互性。

3.3課程考核方法和支撐手段

考核成績由以下三部分組成：平時(shí)課堂表現(xiàn)與考勤20%，平時(shí)實(shí)踐作品40%，期末小型網(wǎng)站項(xiàng)目40%。此次課堂教學(xué)改革中，考慮將所有同學(xué)的實(shí)踐作業(yè)發(fā)布到課程網(wǎng)站平臺(tái)，利用課余時(shí)間，讓學(xué)生登錄平臺(tái)進(jìn)行打分，在課堂上，教師就可以有針對(duì)性的展示得分最高和最低的學(xué)生作品，進(jìn)行講評(píng)，這種作業(yè)評(píng)分方式一方面增加了學(xué)生的參與度，另一方面也提高了學(xué)生作業(yè)得分的透明度和客觀性。

4教學(xué)效果

通過改革，進(jìn)一步整合課程的教學(xué)內(nèi)容，讓其更貼近企業(yè)的實(shí)際需求；新的作業(yè)評(píng)價(jià)形式充分激發(fā)學(xué)生學(xué)習(xí)課程的興趣，調(diào)動(dòng)他們的積極性，真正成為課堂的主人，搞活課堂氣氛，使每位學(xué)生在專業(yè)技能上都有一定的提高。

課程改革后預(yù)計(jì)能達(dá)到以下目標(biāo)：

1） 提高了學(xué)生的網(wǎng)頁設(shè)計(jì)和制作能力及專業(yè)素養(yǎng)，為后續(xù)相關(guān)課程及將來的就業(yè)做好準(zhǔn)備；

2） 提高了教師的專業(yè)素質(zhì)，促進(jìn)教師成為真正的“雙師型”人才，在原有深厚的理論功底的基礎(chǔ)上，進(jìn)一步提升了實(shí)踐能力，還能通過參與相關(guān)企業(yè)的項(xiàng)目實(shí)踐，積累工作經(jīng)驗(yàn)。

5結(jié)束語

《HTML+CSS網(wǎng)頁設(shè)計(jì)》課程進(jìn)行教學(xué)改革，可以更好地解決學(xué)生方面對(duì)專業(yè)培養(yǎng)目標(biāo)不明確，對(duì)將來的發(fā)展方向感到迷茫；學(xué)習(xí)興趣和自覺性不夠；創(chuàng)造能力不足，思維存在局限性等問題；也能改變以往傳統(tǒng)的成績?cè)u(píng)價(jià)不能很好地衡量學(xué)生專業(yè)技能的強(qiáng)弱；教學(xué)方法和內(nèi)容不能很好地指導(dǎo)學(xué)生就業(yè)等問題?？梢栽谟?jì)算機(jī)類各個(gè)專業(yè)基礎(chǔ)課程中推廣，適合實(shí)踐類課程。

參考文獻(xiàn)：

[1] 張秀玉.探討高職“網(wǎng)頁設(shè)計(jì)”課程混合式教學(xué)[J].西昌學(xué)院學(xué)報(bào)，2014（12）：87-89.

[2] 仲靜.高職網(wǎng)頁設(shè)計(jì)與制作課程教學(xué)改革探析[J].電腦知識(shí)與技術(shù)，2014（11）：7698-7702.

[3] 魚明.基于CDIO模式的《網(wǎng)頁設(shè)計(jì)》課程實(shí)踐性教學(xué)改革與創(chuàng)新[J].高教學(xué)刊，2015（1）：33-36.

[4] 鄭慧君.CDIO模式下的ASP.NET課程教學(xué)改革[J].軟件導(dǎo)刊，2015（2）：163-164.