如今的移動瀏覽器支持大部分HTML5功能

（綠色為支持，藍色為部分支持，紅色為不支持）

HTML5應(yīng)用在移動領(lǐng)域的魅力不言而喻：它基于Web、在移動瀏覽器內(nèi)運行，不受移動平臺及設(shè)備的限制，也不需要開發(fā)者針對每個移動操作系統(tǒng)分別開發(fā)，“一次寫成，到處運行”是它引以為豪的承諾。

沒錯，HTML5在很多時候表現(xiàn)得與原生手段并無二致，但是也有幾點原因讓它往往無法成為眾望所歸的“完美方案”：

首先，HTML5本身面臨“碎片化”問題，不同移動瀏覽器對HTML5應(yīng)用功能的支持存在差異性。

再者，雖然HTML5及其相關(guān)Web語言——JavaScript和CSS知名度極高，但是HTML5移動應(yīng)用的開發(fā)成本往往并不低，也不能單純地照搬桌面Web應(yīng)用——它們需要優(yōu)秀的專業(yè)人才，也需要巨大的精力投入。

美國消費者在Apps上花費的時間依然遠多于移動Web

（上方為Apps，下方為移動Web）

就算有了專業(yè)的開發(fā)人才，HTML5依然面臨嚴峻的市場挑戰(zhàn)：消費者如此青睞那些依賴平臺的原生應(yīng)用，HTML5如何才能勝出呢？（參見上圖）

我們將在本報告中剖析HTML5作為一種移動開發(fā)工具所遇到的障礙，并討論HTML5將如何克服它們。

• HTML5與原生應(yīng)用大比拼：我們會具體解釋為何從長遠來看，HTML5在移動開發(fā)領(lǐng)域比原生應(yīng)用更具優(yōu)勢。

• 性能差距：HTML5的監(jiān)管機構(gòu)W3C已經(jīng)大大推動了相關(guān)標準的制定和移動瀏覽器對HTML5功能的支持，但是很多性能方面的問題依然沒有解決。

• 開發(fā)者的心聲：我們采訪了各種各樣的人——從懷疑者、早期使用者到倡導(dǎo)者和先行者，我們向他們提出了同一個問題：“在這場HTML5與原生應(yīng)用的大爭論當中，我們的立場又是什么？”

總體而言，我們發(fā)現(xiàn)HTML5正在被越來越多人接受，而一些項目已經(jīng)證明了它的價值。

HTML5與原生應(yīng)用大比拼

性能差距

對HTML5移動Web及其他平臺感興趣的開發(fā)者比例

移動應(yīng)用云計算技術(shù)公司Appcelerator的企業(yè)策略總監(jiān)邁克爾•金（Michael King）表示,原生應(yīng)用的優(yōu)勢用一個詞概括就是：性能。

Appcelerator 提出了“互動性斜坡（The Slope Of Interactivity）”概念，指出HTML5適合那些互動性不太強的應(yīng)用，例如那些單純提供網(wǎng)絡(luò)內(nèi)容或界面非常簡單的應(yīng)用。然而，如果沿著互動性斜坡上行，那些互動更多的應(yīng)用就需要原生手段了。

但是，有些設(shè)備功能時HTML5做不到的，這往往是因為用戶的移動瀏覽器或瀏覽器版本不支持HTML5實現(xiàn)那些功能。

你準備在2013年用HTML5打造何種軟件？

（從左到右依次為：桌面網(wǎng)站、移動網(wǎng)站/HTML5應(yīng)用、可安裝的混合應(yīng)用、其他）  

這在一定程度上市瀏覽器“碎片化”的結(jié)果——一方面，瀏覽器市場本身就呈現(xiàn)出“群雄割據(jù)”之勢；另一方面，很多智能手機用戶（尤其是Android用戶）不會及時更新軟件。

即便是最新的瀏覽器，對HTML5的支持也并不完善——例如我們在近期的一份分析報告中發(fā)現(xiàn)，Android上的最新版Chrome瀏覽器在雖然支持98項HTML5功能，但是也不支持28項功能。

這種不均衡會影響HTML5的跨平臺吸引力，而事實上，大量HTML5開發(fā)工作依然是致力于桌面環(huán)境的。

此外，HTML5在移動領(lǐng)域也面臨一些安全性的問題，部分原因是HTML5應(yīng)用與數(shù)據(jù)的互動方式導(dǎo)致的。“保障HTML5數(shù)據(jù)的安全是件極其困難的事情。”金說道。

W3C非常重視HTML5的性能差距，正在著手改進HTML5和增強安全功能。

開發(fā)者對HTML5的幾點不滿——綠色為滿意，紅色為不滿，從左到右依次為跨平臺開發(fā)、快速更新、盈利、安全性、碎片化、性能、適時更新、用戶體驗、發(fā)行

但是對于HTML5能否在性能上與原生應(yīng)用平分秋色這一問題，Appcelerator的金持懷疑態(tài)度。他認為HTML5總會落后五六年，因為它瞄準的“靶子”是移動的——設(shè)備廠商和平臺運營商總會推出新的硬件、平臺和功能，它們很快就能融入原生應(yīng)用的開發(fā)環(huán)境，而HTML5不得不跟在后面苦苦追趕。

制定高標準

也有人認為HTML5沒有落后那么多——移動應(yīng)用后端服務(wù)解決方案提供商 StackMob的CEO泰伊•阿米爾（Ty Amell）認為HTML5已經(jīng)開始縮小性能上的差距。

你認為用HTML5進行開發(fā)的最大吸引力是什么？從左到右依次為語言熟悉（HTML、JS、CSS）、跨平臺支持、性能、工具/代碼庫、產(chǎn)出、基于開放標準、開發(fā)成本、社區(qū)

然而，HTML5為何在企業(yè)內(nèi)部應(yīng)用當中比在面向消費者的應(yīng)用當中更受歡迎？一大原因，是企業(yè)應(yīng)用和消費應(yīng)用對用戶體驗的不同要求——對于消費應(yīng)用，iOS 已經(jīng)樹立了“黃金標準”而Android也隨后效仿：豐富多彩的界面和圖形、快捷的捏放操作、流暢的滾動、無縫訪問照片庫和通訊錄等設(shè)備功能……

這些都是HTML5尚未達到的，不是因為HTML5無法實現(xiàn)同樣的性能，而是因為“HTML5的用戶界面（UI）和用戶體驗（UX）沒有真正的標準可言”，因此讓很多開發(fā)者感到很茫然——StackMob的阿米爾如是說道。一些開發(fā)者試圖在HTML5環(huán)境下模仿iOS式的用戶體驗，但并不成功。

你是否贊同HTML5適用于移動應(yīng)用開發(fā)？——從左到右依次為強烈反對、不贊同也不反對、強烈贊同

移動解決方案公司Clearly Innovative的CEO埃倫•桑德斯（Aaron Saunders）認為，HTML5在Android環(huán)境下面臨的挑戰(zhàn)尤其大——這是眾所周知的Android“碎片化”問題造成的結(jié)果。

還有一個很常見的陷阱：即便是最優(yōu)秀的Web開發(fā)人員，也難免會錯誤地試圖把桌面和筆記本電腦上的Web體驗照搬到移動平臺上。“人們總是做著HTML5的美夢，卻意識不到它對開發(fā)者和設(shè)計者有另一套要求，而總想保留自己的老一套Web技能。”用戶界面設(shè)計公司Cynergy的技術(shù)總監(jiān)邁克爾•伍爾夫（Michael Wolf）如是說。

一些開發(fā)人員認為，F(xiàn)acebook對HTML5的否定其實與HTML5本身的局限性關(guān)系不大，更重要的原因是Facebook錯誤地試圖在移動領(lǐng)域推行PC時代的那套方法。

Sencha是一家致力于HTML5的公司，其開發(fā)人員已經(jīng)證明了用HTML5也能做出速度快、性能強大的Facebook應(yīng)用（他們將這一雛形應(yīng)用戲稱為“Fastbook”）。

說到底，HTML5與原生應(yīng)用在質(zhì)量上的差別，更多來自于移動開發(fā)者運用相關(guān)語言的才華和經(jīng)驗，而并非HTML5的局限性。

進入商店

你喜歡用什么方法來開發(fā)支持多平臺的應(yīng)用？紫色為HTML5、綠色為混合應(yīng)用、紅色為一個原生加一個HTML5、藍色為原生；從上到下依次為全球化企業(yè)、大型企業(yè)、中型公司、小公司、初創(chuàng)企業(yè)（少于5人）、整體。

HTML5是大型企業(yè)打造大量應(yīng)用的一個重要技術(shù)趨勢（參見上圖）。在全球化企業(yè)中，近40%的開發(fā)人員表示將采用純HTML5技術(shù)開發(fā)多平臺應(yīng)用。

但是對于面向消費者的應(yīng)用，HTML5卻遇到了“先有雞還是先有蛋”的問題。

圍繞iOS和Android這兩大操作系統(tǒng)，移動行業(yè)已經(jīng)有了自己的業(yè)內(nèi)標準。消費者迷戀原生應(yīng)用，在應(yīng)用上花的時間遠多于移動Web，每年從蘋果App Store和Google Play下載應(yīng)用的次數(shù)都以“十億”為單位。

原生應(yīng)用顯而易見的成功使得移動發(fā)布商不愿全面轉(zhuǎn)戰(zhàn)HTML5——即使HTML5徹底消除了性能上的差距，開發(fā)者對于開發(fā)純HTML5應(yīng)用也會相當謹慎，因為畢竟在線應(yīng)用商店才是最主流的發(fā)行渠道，而智能手機和平板電腦用戶還不習(xí)慣直接從移動Web下載軟件。

于是“混合應(yīng)用”應(yīng)運而生——它們是“披著”原生代碼的HTML5應(yīng)用，可以被提交到應(yīng)用商店中——例如職業(yè)社交網(wǎng)絡(luò)LinkedIn的Android、iPhone和iPad應(yīng)用就以HTML5為主但能在應(yīng)用商店下載。

此外，Mozilla等機構(gòu)也在努力解決HTML5的發(fā)行問題——Mozilla已經(jīng)推出了完全基于HTML5的Firefox OS智能手機操作系統(tǒng)和面向HTML5應(yīng)用的“Firefox Marketplace”應(yīng)用商店。

“用戶們都去應(yīng)用商店尋找內(nèi)容，這迫使發(fā)布商走向原生。”斯蒂凡諾•梅魯奇（Stefano Melucci）說道。他是移動內(nèi)容公司Buongiorno的副總裁，該公司已經(jīng)推出了自己的國際化HTML5應(yīng)用商店Appsfuel。

HTML5的影響力

越來越多的公司和初創(chuàng)企業(yè)開始采用一種非常微妙的移動開發(fā)方法——結(jié)合HTML5和原生應(yīng)用的長處，一邊開發(fā)HTML5應(yīng)用一邊開發(fā)一款或更多原生應(yīng)用，以覆蓋所有用戶群體。

一些開發(fā)人員轉(zhuǎn)向混合式解決方案，以HTML5為中心但引入原生元素，讓應(yīng)用打入應(yīng)用商店或是給人以更自然的感覺。

而另一個選擇，是針對某個對目標用戶尤其重要的平臺（如iOS或Android）開發(fā)一款100%原生的應(yīng)用，然后在用HTML5或混合手段開發(fā)面向其余平臺的應(yīng)用。

不過換個角度來看，“一點兒也沒用到HTML5的原生應(yīng)用也是難得一見的。”移動開發(fā)公司appMobi的CTO薩姆•阿巴蒂爾（Sam Abadir）如是說道——他所在的這家公司最近剛剛將自己的HTML5開發(fā)平臺出售給英特爾。（參見下圖）

總之，在原生與HTML5之間"腳踩兩只船"的解決方案并不少見。

對于純粹的原生應(yīng)用來說，為每個平臺從頭折騰一遍是既費時又費錢的事情。“我得設(shè)計兩遍、維護兩遍、開發(fā)兩遍。”Cynergy的伍爾夫說道。

如果開發(fā)商或發(fā)布商沒有特別充足的資源或資金，那么針對不同平臺重復(fù)利用HTML5或JavaScript往往不失為明智的開發(fā)策略。Clearly Innovative的桑德斯認為，這一策略不但尤其適用于那些需要在多個平臺上開發(fā)多款應(yīng)用的大公司，也適用于初創(chuàng)企業(yè)——它們可以先利用HTML5以較低的成本進行開發(fā)、測試和改進，然后“在賺了些錢、有了些知名度之后，再開始開發(fā)原生或混合應(yīng)用”。

HTML5 的一個應(yīng)用案例

很多人抱有一種成見，認為高度互動、圖形豐富的應(yīng)用應(yīng)當是原生的。

TradeMONSTER

或許用原生代碼的確更容易實現(xiàn)高級效果——例如將數(shù)據(jù)轉(zhuǎn)化為圖表，但是HTML5事實上也能做到。

芝加哥在線交易公司TradeMONSTER的iOS客戶端應(yīng)用就是一個例子——該公司對移動應(yīng)用有一系列要求，包括移動交易環(huán)境能與桌面Web同步、跨平臺保存用戶的個性化設(shè)置、性能穩(wěn)定無bug、控制開發(fā)成本、可以重復(fù)應(yīng)用于不同大小的屏幕、易于更新、保障數(shù)據(jù)安全，等等——但是，這一長串必要條件之下，TradeMONSTER依然選擇了基于HTML5的解決方案（加上一個讓應(yīng)用進入應(yīng)用商店的“原生外衣”）。

近一段時間內(nèi)，開發(fā)者對HTML5的興趣變化不大

（從2012年9月到2013年1月；藍色為積極使用HTML5的開發(fā)者比例，紅色為計劃在年內(nèi)開始使用HTML5的開發(fā)者比例，綠色為今年不準備使用HTML5的開發(fā)者比例）

TradeMONSTER 的CTO桑吉布•薩胡（Sanjib Sahoo）表示，公司最擔心的問題是用戶體驗?zāi)芊裣裨鷳?yīng)用一樣出色，而他們也遇到了很多復(fù)雜而棘手的問題（包括實時數(shù)據(jù)的圖形化等等），并且需要進行很多調(diào)整，好在最后效果不錯——TradeMONSTER現(xiàn)在有了能實現(xiàn)跨設(shè)備流暢同步的跨平臺應(yīng)用，并且無需經(jīng)過蘋果或谷歌就能向用戶推送更新。

結(jié)論

• HTML5并非完美方案。它不能完美地解決多平臺、多設(shè)備應(yīng)用開發(fā)中所有令人頭痛的問題。

• HTML5應(yīng)用要想充分發(fā)揮其潛力，就必須格外注意用戶體驗。只要方法對路，HTML5應(yīng)用的性能也能與原生應(yīng)用相匹敵。

• 盈利與發(fā)行問題是可以解決的。通過混合手段讓包裝過的HTML5打入應(yīng)用商店，就能最大程度地減輕這些問題。此外，已經(jīng)有移動發(fā)布商對其HTML5應(yīng)用的獨立營銷獲得了成功。