孫華

摘要：隨著移動互聯(lián)網(wǎng)技術(shù)的不斷發(fā)展和創(chuàng)新，HTML5技術(shù)儼然已成為下一代互聯(lián)網(wǎng)的Web標準?；贖TML5的移動互聯(lián)網(wǎng)應(yīng)用正逐漸成為一種新的應(yīng)用形式。文章重點介紹了HTML5的部分特性，對基于HTML5的移動互聯(lián)網(wǎng)應(yīng)用的技術(shù)進行了闡釋，對HTML5技術(shù)對于移動互聯(lián)網(wǎng)的發(fā)展趨勢及前景做了展望。

關(guān)鍵詞：HTML5；移動互聯(lián)網(wǎng)；APP； CSS3； Web

1 HTML5概述

HTML5是移動互聯(lián)網(wǎng)最前沿的開發(fā)技術(shù)，運用HTML5可以很好地進行移動應(yīng)用的開發(fā)。目前，蘋果、微軟和谷歌三大移動互聯(lián)網(wǎng)巨頭都在支持HTML5，它的發(fā)展也給移動互聯(lián)網(wǎng)應(yīng)用帶來全新變化。本文研究HTML5應(yīng)用于移動互聯(lián)網(wǎng)應(yīng)用開發(fā)的核心技術(shù)，探討離線緩存、Web Workers、Ajax、地理定位等新技術(shù)的應(yīng)用，并針對HTML5技術(shù)現(xiàn)有不足進行探討。文章主要分析了 HTML5適合移動互聯(lián)網(wǎng)應(yīng)用開發(fā)的幾大特性。

2 HTML5技術(shù)的優(yōu)勢

HTML5在HTML4的基礎(chǔ)上，又增添了很多元素與屬性，并在一定程度上廢除掉了一些元素與屬性。首先，它擁有較低的開發(fā)成本與維護成本；其次，它使用的頁面數(shù)據(jù)量相對較小，運行更為流暢，耗電量不高，使用時，也可以隨時完成設(shè)計，只需要將應(yīng)用程序打開，則可以直接升級到最新的版本，無需下載并安裝，使用時也可以完成更新，離線的狀態(tài)下，也能夠完成緩存，這些都是其他技術(shù)無法企及的[1]?？偟膩碚f，HTML5在文檔結(jié)構(gòu)、頁面元素、本地存儲、地理位置信息等多個方面都發(fā)生了很大變化，而這些變化也相應(yīng)的提升了HTML5對Web應(yīng)用的開發(fā)支持。像是在媒體支持上，HTML5中增進了video元素與audio元素，視頻、音頻以及動畫等多媒體的播放，再也無需進行第三方插件的安裝。另外，HTML5開發(fā)是使用統(tǒng)一的開發(fā)環(huán)境、開發(fā)語言、數(shù)據(jù)模型，在音頻、視頻和圖像、文本綁定上都存在一整套規(guī)范。也就是說在HTML5標準下進行開發(fā)，便為“一次開發(fā)、多次分發(fā)”，無需在HTML5與其他開發(fā)環(huán)境間自由切換，由此簡化移動網(wǎng)絡(luò)的開發(fā)，開發(fā)成本與維護成本都有所降低。

2.1 離線緩存技術(shù)

HTML5 Web Storage API屬于高級版的cookie，不會因數(shù)據(jù)大小發(fā)生變化，且架構(gòu)以及彈性較好，能夠?qū)?shù)據(jù)融入本機ROM中，如遇到突發(fā)情況，瀏覽器關(guān)閉后，再次打開后數(shù)據(jù)能夠自動恢復(fù)，流量損耗也會減小[2]。

緩存技術(shù)也是另外一種方式的后臺“操作記錄”，但是不會對后臺資源造成任何影響，不占用空間，同時程序?qū)τ布O(shè)備造成的壓力也會減小，運行更為流暢。

2.2 交互方式較多

HTML5技術(shù)的互動功能得以提升，能夠輕松實現(xiàn)拖拽、撤銷等操作，文本選擇更為簡單便捷，例如：Transition代表組件的移動效果；Transform代表組件的變形效果；Animation代表將移動和變形加入動畫支持中。

2.3 加入視覺設(shè)計輔助——CSS3

CSS3支持了字體嵌入、版面排版以及動畫功能。比如：豐富的彈性選擇器——Selector；嵌入式的字體——Webfonts；形式多樣的排版選擇——Layout；圓角、漸變、陰影Stlying radius gradient shadow；邊框背景支持——Border background。我們可以使用CSS3完成部分視覺設(shè)計，其具有載入速度快的特點，且代碼、圖片數(shù)據(jù)量小，能夠為用戶節(jié)約一定的流量[3]。

2.4 排版形式更為靈活，能夠自由嵌入多媒體內(nèi)容

HTML4在對文字和音視頻混排的多媒體內(nèi)容處理上是比較麻煩的，需將文字、圖片、視頻和音頻等內(nèi)容進行拆分，再解析對應(yīng)的URL，再以不同方式加以處理，但是基于HTML5網(wǎng)絡(luò)互動性的增強，便不會再受到限制。HTML5技術(shù)與其他技術(shù)不同，其能夠在同一時間處理多媒體內(nèi)容，利用Canvas對象加載圖片，便于依照數(shù)據(jù)計算與作圖，支持圖片移動、縮放和旋轉(zhuǎn)等常規(guī)編輯，借助HTML5的視頻標簽功能，輔助Web開發(fā)工作者更加容易地添加視頻，從而靈活地展現(xiàn)出各類內(nèi)容，這就是它的優(yōu)勢所在。

2.5 隨時隨地分享地理位置信息以及準確的定位技術(shù)

為保證位置精確，需要借助GPS，WiFi等實現(xiàn)定位。HTML5技術(shù)的應(yīng)用，能夠更為精準地實現(xiàn)定位，不論是何時何地，都可用任意設(shè)備來順暢地完成任務(wù)[4]，打破了定位以及導(dǎo)航技術(shù)專屬于導(dǎo)航軟件的歷史，無需下載大量的數(shù)據(jù)包，僅需要使用緩存即可完成，做到隨用隨下。它充分發(fā)揮了移動設(shè)備對定位上的優(yōu)勢，推動基于位置服務(wù)（Location Based Service，LBS）應(yīng)用發(fā)展。

2.6 Canvas繪圖對移動平臺的繪圖能力的優(yōu)化

借助Canvas API就能夠完成簡單的熱點圖繪制[5]，同時，也能夠?qū)τ脩趔w驗數(shù)據(jù)進行收集并分析，輕松實現(xiàn)圖片的旋轉(zhuǎn)、縮放、移動等功能，例如：Canvas代表2D的繪圖功能支持；Canvas 3D代表3D的繪圖功能支持；向量圖的支持SVG。

2.7 擁有能夠為移動平臺定制的表單元素

表1為IE瀏覽器中顯示的HTML5表單元素與對應(yīng)鍵盤。只需要輸入例如，就能夠調(diào)用不同樣式鍵盤，操作較為方便快捷。

2.8 完善的實時通信支持

由于Web頁面使用的是HTTP協(xié)議，所以無法有效實現(xiàn)實時互動的全部功能，僅能夠借助模擬達到實時通信效果，HTML5技術(shù)實時通訊支持較為完善，在應(yīng)用中就能夠?qū)⑿畔?nèi)容嵌入，更好地實現(xiàn)實時通信、實時提醒等功能。

2.9 優(yōu)越的文檔功能

在日常使用的Gmail郵件中，已經(jīng)實現(xiàn)了通過拖拉等操作將文檔作為附件上傳到郵件中進行發(fā)送。而這一項技術(shù)就是HTML5文檔功能中的Dragn Drop和File API的應(yīng)用[6]。

2.10 語意化網(wǎng)絡(luò)

語意化網(wǎng)絡(luò)即計算機對當前頁面顯示內(nèi)容有一定理解，這一點可以幫助我們在SB3技術(shù)上有進一步的突破。

2.11 更具優(yōu)勢的跨平臺融合APP開發(fā)

按照當前最為流行的兩個操作系統(tǒng)iOS和Android市場的占有率來看，如果未來想要利用智能手機更改應(yīng)用程序，需要使用Objective-C+CocoaTouch Framework編寫基于iOS的應(yīng)用程序，也可以使用Java+Android Framework編寫。如果同時使用兩個平臺，這就需要設(shè)計兩套不同平臺的程序，這樣一來就不得不設(shè)計兩套完全不同的程序。而使用HTML5及CSS3來撰寫Web-based的應(yīng)用程序，可以同時支援iOS及Android兩種不同的操作系統(tǒng)，只需要維護一份程序即可，所以HTML5技術(shù)擁有更強的靈活性和優(yōu)勢。

3 結(jié)語

由于當前HTML5技術(shù)的標準還不成熟，處在一個不斷完善的階段，在開發(fā)方式上，仍未指定規(guī)范性的標準，由此，致使開發(fā)應(yīng)用不規(guī)范，程序用戶體驗無法達到原生開發(fā)應(yīng)用效果。為了提升用戶體驗滿意度，則需要對程序進行改進。

目前階段，用HTML5技術(shù)作為移動設(shè)備硬件接口的API，還無法發(fā)揮其作用，在調(diào)用移動硬件相關(guān)設(shè)備時仍較為困難，比如重力感應(yīng)器、GPS、攝像頭等。不過隨著HTML5技術(shù)的不斷發(fā)展和完善，這些功能也將一一實現(xiàn)。

[參考文獻]

[1]于洋.淺析HTML5的特點及其在移動Web App中的應(yīng)用[J].計算機光盤軟件與應(yīng)用，2014（24）：288.

[2]劉國紅.HTML5在移動互聯(lián)網(wǎng)開發(fā)中的應(yīng)用[J].科技廣場，2014（4）：59-62.

[3]嚴偉中.關(guān)于HTML5的核心技術(shù)研究與應(yīng)用[J].網(wǎng)絡(luò)安全技術(shù)與應(yīng)用，2014（3）：30.

[4]楊鵬，蘆陽.HTML5的發(fā)展與移動互聯(lián)網(wǎng)的前景[J].電腦編程技巧與維護，2013（10）：67-68.

[5]李偉.HTML5技術(shù)在電子商務(wù)專業(yè)課程改革中的授課方法探討[J].電腦知識與技術(shù)，2013（5）：1249-1250.

[6]彭濤，楊煉.基于移動瀏覽器的HTML5核心技術(shù)的研究及其應(yīng)用[J].廣東通信技術(shù)，2012（4）：47-50.