Html 5網(wǎng)頁(yè)設(shè)計(jì)課程的教學(xué)研究

姜滟穩(wěn) 程鴻芳

摘 要：Html 5網(wǎng)絡(luò)技術(shù)已經(jīng)成為當(dāng)今時(shí)代主流的網(wǎng)絡(luò)平臺(tái)前端開發(fā)技術(shù)，高職院校為適應(yīng)當(dāng)今網(wǎng)絡(luò)技術(shù)新形式、新時(shí)代的要求，研究相關(guān)課程的教學(xué)工作是非常必要的，本文就Html 5網(wǎng)絡(luò)課程的教學(xué)做了重要的闡述，合理地安排該課程的教學(xué)方法是目前相關(guān)專業(yè)教師的首要任務(wù)。

關(guān)鍵詞：Html 5;瀏覽器;B/S結(jié)構(gòu)

在2010年3月的微軟MIX2010大會(huì)上，微軟的工程師在介紹Internet Explorer 9瀏覽器的同時(shí)，也提出未來(lái)將進(jìn)入Html 5的時(shí)代。他從開發(fā)的角度把互聯(lián)網(wǎng)的發(fā)展分解成為三個(gè)階段，而即將進(jìn)入的Html 5就是第三個(gè)階段——豐富的圖形內(nèi)容和豐富的媒體內(nèi)容階段，網(wǎng)站開發(fā)即將迎來(lái)一個(gè)新的時(shí)代。因此，高校關(guān)于網(wǎng)絡(luò)開發(fā)的課程要適應(yīng)新時(shí)代新環(huán)境就要求，基于Html 5的網(wǎng)頁(yè)設(shè)計(jì)的課程教學(xué)研究是非常必要的。

一、網(wǎng)頁(yè)設(shè)計(jì)課程目標(biāo)

超文本置標(biāo)語(yǔ)言（Html）為了能夠創(chuàng)建更為簡(jiǎn)單的Web開發(fā)程序，代碼書寫更簡(jiǎn)潔更高效，在2008年進(jìn)行了大規(guī)模的修改更新，推出了Html 5版本。對(duì)比以往的Html版本，Html 5提供了更多的屬性更多的元素，大大拓展了Html本身的功能。Html 5的互聯(lián)網(wǎng)應(yīng)用能夠改善用戶的體驗(yàn)，是當(dāng)前Web設(shè)計(jì)和開發(fā)的首選，也是高校網(wǎng)頁(yè)設(shè)計(jì)相關(guān)課程的首選。

二、以往相關(guān)專業(yè)課程存在的問(wèn)題

（一）內(nèi)容涵蓋不足，新內(nèi)容較少

在當(dāng)今時(shí)代IT行業(yè)的任何一個(gè)方向的發(fā)展都是突飛猛進(jìn)的，網(wǎng)絡(luò)開發(fā)技術(shù)的平臺(tái)一直沒有統(tǒng)一的標(biāo)準(zhǔn)，在移動(dòng)端開發(fā)出現(xiàn)后，基于移動(dòng)端框架的網(wǎng)絡(luò)開發(fā)發(fā)展迅猛，近幾年需求量已經(jīng)遠(yuǎn)遠(yuǎn)超過(guò)了PC端，而與此相關(guān)的專業(yè)知識(shí)，以往課程內(nèi)容涵蓋不足。當(dāng)今網(wǎng)頁(yè)的瀏覽器的種類繁多，常用的包括Internet Explore、Google、Firefox、Safari、Opera等Web瀏覽器。開發(fā)者在開發(fā)相應(yīng)的網(wǎng)頁(yè)的過(guò)程中，不僅要了解相關(guān)的Html知識(shí)，還要了解對(duì)不同瀏覽器的運(yùn)行支持。而以往的課程只是以講解理論知識(shí)為主，技術(shù)開發(fā)在網(wǎng)絡(luò)上的適應(yīng)性和拓展性并沒有花太大的篇幅去介紹，新案例講解較少。要適應(yīng)網(wǎng)絡(luò)平臺(tái)實(shí)時(shí)更新新技術(shù)新框架的發(fā)展要求，開發(fā)者不僅需要有扎實(shí)的理論知識(shí)，更需要通過(guò)開發(fā)新案例來(lái)了解最新的技術(shù)和網(wǎng)絡(luò)發(fā)展方向。

（二）知識(shí)點(diǎn)過(guò)于松散

關(guān)于網(wǎng)頁(yè)設(shè)計(jì)相關(guān)的課程因?yàn)镠tml版本的繁多，語(yǔ)法的不統(tǒng)一，網(wǎng)絡(luò)課程的知識(shí)點(diǎn)重復(fù)太多，有些知識(shí)點(diǎn)并不需要開發(fā)者都掌握，只是保證開發(fā)出的網(wǎng)頁(yè)在不同瀏覽器的兼容性，不同的語(yǔ)法實(shí)現(xiàn)相同功能的情況較多，開發(fā)者往往需要二次開發(fā)。Html每次推出新版本后，舊有的語(yǔ)法規(guī)則會(huì)保留部分，再用新語(yǔ)法替換部分棄用的語(yǔ)法規(guī)則，新舊語(yǔ)法交替，教師在講解課程的過(guò)程中會(huì)出現(xiàn)知識(shí)斷層，學(xué)生在學(xué)習(xí)的過(guò)程中也遇到相關(guān)知識(shí)無(wú)法銜接或語(yǔ)法混淆的問(wèn)題，課程的學(xué)習(xí)效果很低。

（三）了解企業(yè)需求

相關(guān)專業(yè)課程提出的需求不能僅僅需要滿足于課堂，更應(yīng)該契合企業(yè)和市場(chǎng)的需求，促進(jìn)人才培養(yǎng)與產(chǎn)業(yè)需求相結(jié)合。Web前端相關(guān)的技術(shù)發(fā)展速度非常快，新的技術(shù)理念層出不窮，而市場(chǎng)和企業(yè)的需求才是最終的需求方向。因此人才培養(yǎng)方案需注重加強(qiáng)崗位能力培養(yǎng)，積極推進(jìn)產(chǎn)教融合、課證融合，提升專業(yè)群與產(chǎn)業(yè)群的契合度，才能夯實(shí)學(xué)生就業(yè)創(chuàng)業(yè)基礎(chǔ)。

三、Html 5課程的優(yōu)勢(shì)

（一）適應(yīng)時(shí)代的要求

Html 5相關(guān)知識(shí)是今后互聯(lián)網(wǎng)通用標(biāo)準(zhǔn)的統(tǒng)一標(biāo)準(zhǔn)，這也是時(shí)代的迫切要求，之前的課程光講解Web瀏覽器之前的兼容性就浪費(fèi)了大量的時(shí)間，Html 5在Web應(yīng)用平臺(tái)上開發(fā)標(biāo)準(zhǔn)非常明確，在此平臺(tái)上，視頻、音頻、圖像、動(dòng)畫以及電腦的交互都是標(biāo)準(zhǔn)化的，非標(biāo)準(zhǔn)化所導(dǎo)致的問(wèn)題得以解決，知識(shí)點(diǎn)構(gòu)建是非常明確的。

（二）完善以往課程的不足

Html 5相關(guān)知識(shí)向上兼容，可以完善網(wǎng)絡(luò)開發(fā)專業(yè)的教學(xué)計(jì)劃，在原有課程的基礎(chǔ)上，彌補(bǔ)以往因?yàn)槠脚_(tái)、瀏覽器等兼容性所導(dǎo)致的漏洞。用Html 5標(biāo)準(zhǔn)創(chuàng)建的網(wǎng)頁(yè)程序也可以識(shí)別舊版本的語(yǔ)法，并且Html 5追加了很多新規(guī)則、新知識(shí)、新框架，大大拓展了開發(fā)潛力，不僅如此，還結(jié)合了包括微格式、無(wú)障礙應(yīng)用等各種周邊的技術(shù)，完善以往語(yǔ)法的不足，提高了語(yǔ)法的可讀性。

（三）與其他核心課程有很好的銜接

以往的網(wǎng)頁(yè)設(shè)計(jì)相關(guān)的課程都是基于PC平臺(tái)，但當(dāng)今社會(huì)手機(jī)平臺(tái)的使用已成為主流，因此基于手機(jī)開發(fā)相關(guān)的知識(shí)也是當(dāng)前網(wǎng)絡(luò)開發(fā)方向?qū)W習(xí)的熱門方向之一，而Html 5的課程，不僅介紹了PC平臺(tái)的開發(fā)知識(shí)，也介紹了手機(jī)平臺(tái)的相關(guān)知識(shí)。教師在介紹本課程的相關(guān)知識(shí)的同時(shí)也會(huì)涵蓋其他方向的一些知識(shí)點(diǎn)，學(xué)生在學(xué)習(xí)完本課程之后，再學(xué)習(xí)其他核心課程，比如手機(jī)APP開發(fā)課程時(shí)，相關(guān)的知識(shí)點(diǎn)是可以通用的。

四、Html 5課程的整體框架

如下圖所示，Html 5有完整的結(jié)構(gòu)框架，高校在開設(shè)相關(guān)的網(wǎng)頁(yè)設(shè)計(jì)課程包含了目前流行的網(wǎng)絡(luò)開放相關(guān)知識(shí)，包括css、svg、Animation等，Html 5所包含的全新的標(biāo)簽和元素更是課程的重點(diǎn)內(nèi)容，以適應(yīng)新時(shí)代、新環(huán)境下的教學(xué)要求。

五、Html 5課程主要特色

（一）制定Html 5網(wǎng)頁(yè)設(shè)計(jì)課程體系

新的課程體系的建立是為了讓Html 5網(wǎng)頁(yè)設(shè)計(jì)課程的課程目標(biāo)、課程內(nèi)容、課程方法滿足Web前端職業(yè)技能人才需求，適應(yīng)國(guó)家和社會(huì)發(fā)展的需求，提高高職教學(xué)效果和人才培養(yǎng)質(zhì)量，以崗位技能目標(biāo)為導(dǎo)向，提升學(xué)生的就業(yè)競(jìng)爭(zhēng)力和可持續(xù)發(fā)展的能力。

（二）明確Html 5網(wǎng)頁(yè)設(shè)計(jì)的課程定位

Html 5網(wǎng)頁(yè)設(shè)計(jì)課程總目標(biāo)定位于使學(xué)生掌握常用的網(wǎng)頁(yè)設(shè)計(jì)和網(wǎng)站工具，掌握網(wǎng)頁(yè)設(shè)計(jì)的基本技能，熟悉HTML5語(yǔ)言，能夠利用HTML5和CSS3知識(shí)進(jìn)行Web前端網(wǎng)頁(yè)設(shè)計(jì)、制作及站點(diǎn)管理的基本知識(shí)和技能，能夠獨(dú)立制作中小型的靜態(tài)網(wǎng)站。