HTML5網(wǎng)頁設(shè)計與制作課程游戲化教學(xué)設(shè)計

張愛軍 劉勝達(dá) 王英瑋

摘 要：為了更好地提升計算機(jī)專業(yè)畢業(yè)生的網(wǎng)頁設(shè)計與制作的能力，本文進(jìn)行了HTML5網(wǎng)頁設(shè)計與制作課程游戲化教學(xué)設(shè)計研究。首先對HTML5網(wǎng)頁設(shè)計與制作課程進(jìn)行了介紹，然后分析了HTML5網(wǎng)頁設(shè)計與制作課程對計算機(jī)相關(guān)專業(yè)學(xué)生的能力培養(yǎng)要求，最后提出了HTML5網(wǎng)頁設(shè)計與制作課程游戲化教學(xué)設(shè)計方案。實踐表明，該方案能夠有效地激發(fā)學(xué)生的學(xué)習(xí)興趣，有效地提升學(xué)生的自主學(xué)習(xí)能力，有效地提升學(xué)生的網(wǎng)頁設(shè)計與制作的實踐能力，具有一定的參考價值。

關(guān)鍵詞：HTML5;網(wǎng)頁設(shè)計與制作：游戲化教學(xué);設(shè)計

0 引言

隨著大智移云技術(shù)的飛速發(fā)展，網(wǎng)絡(luò)應(yīng)用越來越廣泛，涌現(xiàn)了大量的熱門網(wǎng)站，而HTML5網(wǎng)頁設(shè)計與制作課程是講授如何制作網(wǎng)頁的課程，對于計算機(jī)相關(guān)專業(yè)來說非常重要。因此，適時進(jìn)行HTML5網(wǎng)頁設(shè)計與制作課程游戲化教學(xué)設(shè)計研究，具有重要的現(xiàn)實意義。

1 HTML5網(wǎng)頁設(shè)計與制作課程簡介

HTML5網(wǎng)頁設(shè)計與制作課程，是計算機(jī)科學(xué)與技術(shù)專業(yè)的一門應(yīng)用性質(zhì)較強(qiáng)的重要專業(yè)必修課。本課程以應(yīng)用為主導(dǎo)，是一門關(guān)于網(wǎng)頁設(shè)計與制作的應(yīng)用課程，適合有編程基礎(chǔ)的同學(xué)學(xué)習(xí)。該課程具有操作性強(qiáng)、理論性強(qiáng)、結(jié)構(gòu)完整和很強(qiáng)的工程性等特點。

2 HTML5網(wǎng)頁設(shè)計與制作課程對計算機(jī)相關(guān)專業(yè)學(xué)生的能力培養(yǎng)要求

通過本課程的教學(xué)，幫助學(xué)生掌握學(xué)習(xí)互聯(lián)網(wǎng)基本知識，深入學(xué)習(xí)HTML、CSS，會完成基本的靜態(tài)頁面制作。會使用基本的設(shè)計軟件，如PhotoShop和Fireworks進(jìn)行切圖，會精確的還原設(shè)計圖，以及學(xué)習(xí)基本的瀏覽器兼容問題的處理方法。啟發(fā)學(xué)生的創(chuàng)新意識，提高學(xué)生在HTML5程序設(shè)計過程中分析問題和解決問題的動手能力，使學(xué)生的理論知識和實踐技能得到共同發(fā)展。

3 HTML5網(wǎng)頁設(shè)計與制作課程游戲化教學(xué)策略

1.HTML5網(wǎng)頁設(shè)計與制作課程游戲化教學(xué)案例設(shè)計

HTML5網(wǎng)頁設(shè)計與制作課程游戲化教學(xué)案例是教師在課堂講授課程時采用的案例，學(xué)生僅是將其聽懂并跟著教師動手驗證即可。為了吸引學(xué)生的注意力，激發(fā)學(xué)生的學(xué)習(xí)興趣，提升學(xué)生的學(xué)習(xí)參與度，設(shè)計了大量有趣的游戲化教學(xué)案例，例如數(shù)學(xué)計算高手、三國連連看、水果超市、作物大挑戰(zhàn)、瘋狂汽車、兒童識拼音和英語單詞好記星等，以上案例利用HTML5實現(xiàn)，能夠穩(wěn)定運行于眾多主流瀏覽器中，也能較好的運行于平板、手機(jī)等移動平臺，能夠有效地激發(fā)學(xué)生學(xué)習(xí)HTML5網(wǎng)頁設(shè)計與制作課程的興趣，有效地提升學(xué)生自主學(xué)習(xí)的能力，有效地提升學(xué)生的實踐動手能力。

2.HTML5網(wǎng)頁設(shè)計與制作課程游戲化實踐環(huán)節(jié)設(shè)計

HTML5網(wǎng)頁設(shè)計與制作課程游戲化實踐環(huán)節(jié)是先由教師布置HTML5相關(guān)的游戲化實踐項目，然后由學(xué)生自主分組分工協(xié)作完成HTML5游戲化實踐項目，最后進(jìn)行學(xué)生自評、同學(xué)互評以及教師點評。HTML5網(wǎng)頁設(shè)計與制作課程的游戲化實踐環(huán)節(jié)主要包括項目布置、項目實施和實踐項目總結(jié)三大部分，其中，項目布置包括HTML5游戲化實踐項目情境、HTML5游戲化實踐項目要求和HTML5游戲化實踐項目分組;項目實施包括HTML5游戲化實踐項目討論、HTML5游戲化實踐項目搜集資料和HTML5游戲化實踐項目優(yōu)化;項目總結(jié)包括HTML5游戲化實踐項目學(xué)生展示、HTML5游戲化實踐項目師生評價和HTML5游戲化實踐項目教師點評。實踐表明，利用貼近生活實際的HTML5游戲化實踐項目能夠很好地激發(fā)學(xué)生的參與興趣，提升學(xué)生的學(xué)習(xí)動力，大幅提升學(xué)生的HTML5實踐應(yīng)用能力。

3.HTML5網(wǎng)頁設(shè)計與制作課程游戲化第二課堂設(shè)計

為了提升學(xué)生課后進(jìn)行HTML5網(wǎng)頁設(shè)計與制作課程的自主學(xué)習(xí)程度，可以搭建HTML5網(wǎng)頁設(shè)計與制作課程的游戲化網(wǎng)絡(luò)教學(xué)平臺，通過平臺開展游戲化第二課堂活動。其優(yōu)勢主要包括以下幾點：第一，在HTML5網(wǎng)頁設(shè)計與制作課程的游戲化網(wǎng)絡(luò)教學(xué)平臺中，學(xué)生可以進(jìn)行課后自主學(xué)習(xí)，以及在任何時間和任何地點進(jìn)行移動學(xué)習(xí)，因此該模式能夠很好地鍛煉學(xué)生的自主學(xué)習(xí)能力。第二，在HTML5網(wǎng)頁設(shè)計與制作課程的游戲化網(wǎng)絡(luò)教學(xué)平臺中，學(xué)生可以自由分組進(jìn)行積分對抗，即利用競爭機(jī)制、團(tuán)隊精神和集體榮譽感提升學(xué)生的參與程度，從而激發(fā)學(xué)生學(xué)習(xí)HTML5網(wǎng)頁設(shè)計與制作課程的興趣，提高學(xué)生利用HTML5進(jìn)行網(wǎng)頁設(shè)計與制作的能力。第三，通過HTML5網(wǎng)頁設(shè)計與制作課程的游戲化網(wǎng)絡(luò)教學(xué)平臺，學(xué)生還能夠進(jìn)行私信和群聊等方式進(jìn)行互動溝通，使得學(xué)生在遇到困難時能夠與同組同學(xué)討論，從而有效地提升學(xué)生的溝通能力、分析能力和創(chuàng)新能力。

4 結(jié)束語

為了更好地提升計算機(jī)相關(guān)專業(yè)學(xué)生的HTML5應(yīng)用能力，本文進(jìn)行了HTML5網(wǎng)頁設(shè)計與制作課程游戲化教學(xué)設(shè)計研究。首先對HTML5網(wǎng)頁設(shè)計與制作課程進(jìn)行了介紹，然后分析了HTML5網(wǎng)頁設(shè)計與制作課程對計算機(jī)相關(guān)專業(yè)學(xué)生的能力培養(yǎng)要求，最后提出了HTML5網(wǎng)頁設(shè)計與制作課程游戲化教學(xué)設(shè)計方案。經(jīng)過近一年的HTML5網(wǎng)頁設(shè)計與制作課程教學(xué)實踐，發(fā)現(xiàn)該游戲化教學(xué)策略能夠有效地激發(fā)學(xué)生的學(xué)習(xí)興趣，有效地提升學(xué)生的學(xué)習(xí)參與度，有效地提升學(xué)生的HTML5實踐應(yīng)用能力，具有一定的推廣價值。

參考文獻(xiàn)

[1]田華，陳敏娜，王朋嬌.以創(chuàng)新思維培養(yǎng)為導(dǎo)向的項目教學(xué)設(shè)計與實踐——以“網(wǎng)頁設(shè)計”課程為例[J].中國信息技術(shù)教育，2019（05）：106-109.

作者簡介：

張愛軍（1963-），男，黑龍江哈爾濱人，碩士，副教授，主要研究方向：信號頻譜分析.

基金項目：本文系2018年度黑龍江省哲學(xué)社會科學(xué)研究規(guī)劃項目“游戲化智慧課堂及智慧學(xué)習(xí)空間構(gòu)建與應(yīng)用研究”（18EDE498），2019年度黑龍江省教育科學(xué)“十三五”規(guī)劃重點課題“智慧城市視域下基于OBE的雙創(chuàng)型智能系統(tǒng)開發(fā)人才校企協(xié)同培養(yǎng)研究”（GJB1319105），2019年中國物流學(xué)會、中國物流與采購聯(lián)合會面上研究課題“智慧城市建設(shè)背景下智慧物流系統(tǒng)開發(fā)人才培養(yǎng)創(chuàng)新研究”（2019CSLKT3-209），2019年黑龍江財經(jīng)學(xué)院人文社會科學(xué)基金項目“智慧城市建設(shè)背景下校企共建雙導(dǎo)師工作室協(xié)同育人模式研究”（SK201912）階段性研究成果。