王 睿

(營(yíng)口職業(yè)技術(shù)學(xué)院，遼寧營(yíng)口115000)

【學(xué)術(shù)研究】

淺談HTML5的技術(shù)優(yōu)勢(shì)

王 睿

(營(yíng)口職業(yè)技術(shù)學(xué)院，遼寧營(yíng)口115000)

通過(guò)研究HTML5在技術(shù)上的創(chuàng)新和進(jìn)步，并依據(jù)HTML5開(kāi)發(fā)人員的實(shí)際應(yīng)用經(jīng)驗(yàn)，歸納和整理出HTML5在可用性、用戶體驗(yàn)友好性、性能上的改進(jìn)和對(duì)于SEO友好等方面的優(yōu)越性能，有利于Web程序員在應(yīng)用中充分發(fā)揮和利用HTML5的新特點(diǎn)，更有效的應(yīng)用基于HTML5程序的開(kāi)發(fā)工具．

移動(dòng)互聯(lián)；HTML5；Web語(yǔ)言

0 引言

HTML從第一版的出現(xiàn)到現(xiàn)在，已經(jīng)經(jīng)歷了5次改版．從HTML2.0開(kāi)始， HTML用自身的優(yōu)勢(shì)證明了其在構(gòu)建網(wǎng)站中的優(yōu)勢(shì)，甚至可以替代古老的C語(yǔ)言編程來(lái)架構(gòu)部分網(wǎng)站．到了HTML5一代，對(duì)比之前的版本有了更多的優(yōu)勢(shì)[1]．從可用性、更好的用戶體驗(yàn)，到對(duì)SEO友好性等，使HTML5的開(kāi)發(fā)人員可以貢獻(xiàn)出性能更優(yōu)越的各種終端應(yīng)用．首先，HTML5對(duì)跨瀏覽器方面的推動(dòng)，使得跨瀏覽器的應(yīng)用開(kāi)發(fā)不再是一件繁瑣的事情．在HTML4時(shí)代，由于語(yǔ)言本身的弱點(diǎn)，導(dǎo)致了瀏覽器各自為政，擴(kuò)展開(kāi)發(fā)了很多特性，導(dǎo)致瀏覽器之間不兼容．到了HTML5時(shí)代，這一問(wèn)題被徹底解決．其次，WHAT Working Group和W3C在制定HTML5標(biāo)準(zhǔn)的時(shí)候，吸取了XHTML的諸多教訓(xùn),將向后兼容作為了一個(gè)很重要的設(shè)計(jì)原則．HTML5在引入了許多新的特性之后，它始終堅(jiān)持一點(diǎn)：不打破已有的網(wǎng)頁(yè)．程序員可以將之前任何已有網(wǎng)頁(yè)代碼的第一行改成，它就立刻成為一個(gè)HTML5代碼頁(yè)面，之后就可以在瀏覽器里正常的展示．這些特點(diǎn)為開(kāi)發(fā)人員提供了極大地方便，同時(shí)，也在應(yīng)用中使得HTML5的諸多優(yōu)勢(shì)更多的展現(xiàn)出來(lái)．

1 HTML5的技術(shù)優(yōu)勢(shì)分析

1.1 最移動(dòng)化的開(kāi)發(fā)工具

移動(dòng)互聯(lián)技術(shù)的應(yīng)用將成為現(xiàn)在流行的生活模式，也是一種時(shí)尚．當(dāng)移動(dòng)互聯(lián)設(shè)備(如：手機(jī))廣泛應(yīng)用時(shí)，訪問(wèn)網(wǎng)站和Web的頻次迅速增長(zhǎng)．HTML5迎合了這種需要，使用HTML5來(lái)開(kāi)發(fā)Web應(yīng)用將會(huì)變得簡(jiǎn)單而流行[2]．

制作手機(jī)版網(wǎng)站時(shí)，需要界面簡(jiǎn)潔，充分利用手機(jī)的方寸屏幕．HTMH5的Meta標(biāo)簽用來(lái)提供頁(yè)面信息，Meta的一組標(biāo)簽會(huì)讓編程者得心應(yīng)手，做出適合于移動(dòng)終端的網(wǎng)頁(yè)．

以Meta的Viewport標(biāo)簽為例．Viewport是屏幕的可視區(qū)域．使用Viewport標(biāo)簽時(shí)，可以設(shè)置它的屏幕尺寸屬性，包括高度、寬度、初始縮放比例、最大縮放比例和最小縮放比例．這樣，制作網(wǎng)頁(yè)時(shí)，我們可以設(shè)置一個(gè)或幾個(gè)屬性，終端瀏覽時(shí)會(huì)根據(jù)尺寸的相關(guān)性調(diào)整到最佳的比例．這樣可以避免瀏覽網(wǎng)頁(yè)時(shí)因?yàn)楣潭ǖ某跏汲叽鐜?lái)的尷尬[3]．

1.2 HTML5支持跨瀏覽器

目前較為流行的瀏覽器，比如：IE9、Firefox、Chrome、Safari等，都支持HTML5，甚至很低版本的IE6都可以使用．難能可貴的是HTML5充分吸取了之前版本的經(jīng)驗(yàn)，本著向下兼容的原則，對(duì)之前基于低版本的IE瀏覽器開(kāi)發(fā)的網(wǎng)頁(yè)，只要添加JAVASCRIPT代碼便可以使用新的元素：

．

HTML5的這種親和力會(huì)使得大多數(shù)Web應(yīng)用程序員喜歡使用它．

1.3 更易于開(kāi)發(fā)互動(dòng)應(yīng)用

我們?cè)跒g覽網(wǎng)頁(yè)時(shí)，往往更容易被那些互動(dòng)項(xiàng)目所吸引，HTML5也充分考慮到了這一點(diǎn)．

在HTML5提供的大量API(Application Programming Interface,應(yīng)用程序編程接口)中，有一部分專(zhuān)為開(kāi)發(fā)互動(dòng)應(yīng)用而設(shè)計(jì)，如：Drag and Drop 、Offline storage database、Browser history management、Document editing和Timed media playback 等．這些都是有關(guān)交互式網(wǎng)頁(yè)開(kāi)發(fā)的API．使用這些程序接口，程序員很方便開(kāi)發(fā)出交互式的網(wǎng)頁(yè)，這也是HTML5的魅力之一．

1.4 對(duì)于SEO很友好

使用 HTML5，減少了網(wǎng)站對(duì)插件的依賴，如：Flash，使得網(wǎng)站加載速度變快，有利于用戶體驗(yàn)，并且由于結(jié)構(gòu)上改變，有更多能被搜索引擎識(shí)別的內(nèi)容．這些表現(xiàn)對(duì)SEO帶來(lái)很友好的影響．

相對(duì)于之前的版本，HTML5主要有兩個(gè)方面發(fā)生了變化：

一是結(jié)構(gòu)上的變化．以前我們?cè)诙x頭部時(shí)一般用Div標(biāo)簽，然后用Id=Header來(lái)說(shuō)明，但是這種情況下每個(gè)人都有一套不同的命名方法，搜索引擎就很難識(shí)別網(wǎng)站的結(jié)構(gòu)．使用HTML5，就可以直接用Header標(biāo)簽，同樣的還有Nav標(biāo)簽、Footer標(biāo)簽、Section標(biāo)簽等．我們可以直接使用這些有利于搜索引擎索引的標(biāo)簽，讓搜索引擎了解我們網(wǎng)站的結(jié)構(gòu)．

二是功能上的變化，如增加了Video標(biāo)簽，Audio標(biāo)簽等，減少了網(wǎng)站對(duì)Flash插件等的依賴．還有一些其他的內(nèi)容如Time標(biāo)簽，該元素能夠以搜索引擎可讀的方式對(duì)日期和時(shí)間進(jìn)行編碼．

1.5 最優(yōu)化的存儲(chǔ)方式

HTML5設(shè)計(jì)了一個(gè)很聰明的存儲(chǔ)方式，它把用戶信息及緩存數(shù)據(jù)保存在用戶的瀏覽器中，建立了一個(gè)客戶端的數(shù)據(jù)庫(kù)，也就是本地存儲(chǔ)數(shù)據(jù)庫(kù)．這樣設(shè)計(jì)的優(yōu)點(diǎn)在于存取速度快，安全性高．當(dāng)用戶加載上一次的應(yīng)用狀態(tài)時(shí)，更能體驗(yàn)到優(yōu)越的性能．并且，這一技術(shù)不需要第三方插件，同時(shí)支持所有主流瀏覽器．而早期的版本更多是使用Cookie技術(shù)，關(guān)閉瀏覽器后Cookie將被刪除．使用HTML5開(kāi)發(fā)的Web程序，用戶完全不需要有這種擔(dān)心．

1.6 重視游戲開(kāi)發(fā)

互聯(lián)網(wǎng)游戲已經(jīng)是IT產(chǎn)業(yè)不可或缺的重要部分，游戲業(yè)的年產(chǎn)值很大一部分是在移動(dòng)互聯(lián)領(lǐng)域?qū)崿F(xiàn)的．HTML5也沒(méi)有忽略這一方面．

在游戲開(kāi)發(fā)方面HTML5的最大特點(diǎn)是提供了大量的開(kāi)發(fā)框架，如：Simpler框架，F(xiàn)oundation框架等等．并且，新的框架還在不斷涌現(xiàn)．HTML5的游戲框架注重游戲開(kāi)發(fā)的不同方面，有的注重音頻特效，有的偏重前端開(kāi)發(fā)．不同的框架程序給游戲開(kāi)發(fā)者提供了極大的方便，可以使程序員將更多的精力注重在游戲的內(nèi)部邏輯方面．

可以預(yù)見(jiàn)在未來(lái)的相當(dāng)一個(gè)時(shí)期，游戲的制作將會(huì)進(jìn)入HTML5時(shí)代．

1.7 更多的多媒體效果

HTML5有兩個(gè)專(zhuān)門(mén)的標(biāo)簽用于多媒體網(wǎng)頁(yè)的設(shè)計(jì)．Video用于訪問(wèn)視頻資源，Audio標(biāo)簽用于訪問(wèn)視音頻資源． 使用HTML5開(kāi)發(fā)Web應(yīng)用時(shí)，

使用HTML5可以很好的替代Flash和Silverlight．較少的插件應(yīng)用將提高運(yùn)行效率．

1.8 易學(xué)易用，增強(qiáng)用戶的友好體驗(yàn)

首先，HTML5很像HTML，熟悉HTML的程序員不需要重新學(xué)習(xí)．有些程序員寫(xiě)過(guò)XHTML Strict代碼，HTML5則完全包容XHTML Strict．HTML5更多的元素已經(jīng)被很多公司所采用．

其次， HTML5諸多新技術(shù)的使用，使得創(chuàng)建網(wǎng)站更加簡(jiǎn)單．像使用Video和Audio標(biāo)簽開(kāi)發(fā)多媒體網(wǎng)頁(yè)，利用框架開(kāi)發(fā)游戲，以及開(kāi)發(fā)交互式Web應(yīng)用，都在很大程度增強(qiáng)的了用戶的友好體驗(yàn)，更有利于網(wǎng)站提高用戶粘性．

2 結(jié)論

上述歸納總結(jié)了關(guān)于HTML5幾個(gè)方面的技術(shù)優(yōu)勢(shì)，是基于許多前端開(kāi)發(fā)人員的使用經(jīng)驗(yàn)．分析HTML5技術(shù)上的改進(jìn)，會(huì)引導(dǎo)更多的程序開(kāi)發(fā)人員在開(kāi)發(fā)應(yīng)用中更好的利用這些技術(shù)更新．因?yàn)镠TML5較之先前的版本有比較多的突破，隨著前端的開(kāi)發(fā)人員更加深入地使用基于HTML5的開(kāi)發(fā)平臺(tái)，會(huì)積累更多的經(jīng)驗(yàn)，總結(jié)出更多的關(guān)于HTML5的技術(shù)特點(diǎn)和優(yōu)勢(shì)，同時(shí)也會(huì)發(fā)現(xiàn)其局限和不足．對(duì)于這些經(jīng)驗(yàn)的歸納和總結(jié)，有益于推動(dòng)HTML技術(shù)邁入更高級(jí)的階段．也因?yàn)镠TML5作為應(yīng)用服務(wù)平臺(tái)技術(shù)的重要組成部分，研究HTML的技術(shù)改進(jìn)與提高很有價(jià)值．特別是在移動(dòng)通信和互聯(lián)網(wǎng)應(yīng)用蓬勃發(fā)展的今天，對(duì)于HTML技術(shù)至臻至美的追求，會(huì)使對(duì)于這一技術(shù)的研討持續(xù)地深入下去．

[1]李東博. HTML5+CSS3從入門(mén)到精通[M]. 北京：清華大學(xué)出版社，2013.

[2]Christopher Schmitt ， Kyle Simpson. HTML5經(jīng)典實(shí)例[M].北京：中國(guó)電力出版社，2013.

[3]陸建華，俞洋.基于Wed的組態(tài)界面軟件架構(gòu)的設(shè)計(jì)與實(shí)現(xiàn)[J].遼寧師范大學(xué)學(xué)報(bào)：自然科學(xué)版，2013，(4)：491-496.

(審稿人 李樹(shù)東 鄧景茹，責(zé)任編輯 王 巍)

On the technical advantages of HTML5

WANG Rui

(Yingkou College of Vocational Technology，Yingkou Liaoning 115000)

Through the research on the innovation and progress of HTML5 in technology, combined with the practical experience of HTML5 programmers, the paper inducts and sorts out the excellent performance of HTML5 in usability, user-friendliness, performance improvement and SEO friendliness and so on, which is beneficial for Web programmers to give full play and make best use of the new features of HTML5, and then take advantage of the development tools based on HTML5 more effectively.

mobile internet; HTML5; web programming language

2016—12—10

王睿(1961-)，女，遼寧營(yíng)口市人，副教授，主要從事軟件工程方面研究．

TN915.03

A

1008-5688(2017)01-0040-02