認識HTML5 (二)瀏覽器支援度

因為Html5的規格都還在開發中,對於要支援什麼不支援什麼,其中參雜了許多商業競爭,舉例來說究竟網路影片格式要如何支援也是各家角力的項目之一,因為這牽扯到影片編碼的權利金問題。關於開發到現階段各家瀏覽器對於目前HTML5的支援度標準如何,比較可靠的參考數據就是THE HTML5 TEST網站,只要點開網站馬上幫你測你現在所使用的瀏覽器對HTML5的支援度和支援項目細節(下圖是用Google Chroma跑出來的分數)。

該網站有”目前”(2011/5/18)各家瀏覽器的支援狀況,為了等標準訂立出來以後還可以考古懷念一下,留一張目前為止的瀏覽器分數列表。

我們可以看到除了IE以外大家(笑)都很努力,甚至大家的目標都是在下一個瀏覽器版本支援到最好的分數,但是IE目前看起來好像意興闌珊,不可諱言以目前PC的普及率和IE的ActiveX應用市占率,即使常被拿來作文章他還是有老神在在的本錢,而也無庸置疑其他家瀏覽器目前就是連成同一戰線打算用HTML5來幹掉微軟,雖然私下也各懷鬼胎,畢竟這是影響下一世代的商場之戰,各家都有盤算。

如果覺得列表硬梆梆不夠生動,小樽再舉個比較視覺化一點的例子,與HTML5一起被歌頌的CSS3也是網頁設計師關注的焦點,在隱科技上有這麼一篇文章:波堤獅告訴你目前各家瀏覽器對 CSS3 的支援狀況…(台灣製造),看看這張精美的圖片,一目了然(按一下可放大):對這個作者有興趣的可以參考他這篇原始文章,想用自己的瀏覽器完玩看可以點這邊Live Demo一下

這篇文章中有提到作者的靈感是來自一位日本CSS高手Shop DD,他用CSS3畫了小叮噹,如果你不想一個一個試可以點下面的縮圖看結果。

但是在小樽撰文的此刻,小樽的電腦IE已經升級到9,結果看起來和Opera 10.53一樣,不會動也沒有陰影漸層,但至少沒有IE8這麼慘,光這點而言,我們可以得知微軟也不想因為不支援CSS3而得罪廣大設計師,雖然支援度還是有成長空間,看得出來是在不情願中設法取得平衡。

對於多媒體的支援,因為賈伯斯教主的關係,HTML5 V.S Flash這類的文章層出不窮,大家都有各自的觀點,但是小樽必須中肯的說,HTML5標準並還沒定好…而且請不要忘記Adobe家的軟體一年出一版,在一切沒有定論的時候請廣泛的接受知識而非偏好,而且事實上以小樽技術層面的了解,HTML5只是在許多部份的發展上(ex.canvas標籤和影音標籤…etc)與Flash的工作(動畫and flv影音編碼…etc)重疊,以前就是因為沒有Flash這樣方便的外掛補足瀏覽器貧弱的多媒體能力,新一代的HTML5說要支援是理所當然,但是截至目前為止canvas的控制和編輯需要相當的程式基礎尤其是Java,這對於已經習慣所見即所得編輯Flash的設計師而言,在HTML5相關的編輯器成熟問世之前,Flash並不會消失,甚至我們可以同理推想如果Adobe想要繼續吃這塊市場,難道不會有所改進?當然會~我們後面會提到Adobe很快就推出的Wallaby(袋鼠)技術的教學,讓Flash有條件的轉成HTML5網頁,雖然還在開發中,但小樽相信這樣發展下去只是會延生出新的整合搭配方案,不一定是誰吃死誰…雖然Apple現在排擠Adobe,但事實上當年指著微軟罵壟斷的蘋果,現在也一樣想使用多數占有率的暴力手法攻擊別人,商場上的戰爭我們凡人可能只有旁觀的份,但是靠這行生存的人,要有自覺替未來做點準備,請記住好的/友善的/環保的/時尚(?)的技術不一定就活的下來,在商言商的世界看的是利益,另外一個利益問題就來自HTML5的影片支援。

HTML5對於影片格式的支援度目前都還因為瀏覽器的廠商支援度搖擺中,因為這牽扯到權利金和占有率等商業問題,youtube因為藉由Flash的影音編碼技術讓網路影音市場爆紅,但賈教主詬病Flash肥大笨重也不是沒有原因,就技術原理上來說就是瀏覽器對影片硬體加速的問題,Flash硬體支援的問題其實在PC上一直有持續被改進(因為PC上許多瀏覽器支援Flash硬體加速),很大的因素也是由於新硬體和作業系統接受Flash存在的事實而互相”配合”,但蘋果瀏覽器Safari不支援對Flash硬體加速,所以這個觀點是因”商業”立場而異…身為開發者最好不要因對品牌的偏好而顧此失彼,數據會說話請看本報導,Flash之所以影音播放在瀏覽器上被詬病簡單來說,原本影片可能可以直接在電腦上被硬體解碼撥放,但是由於目前的HTML技術不支援直接呼叫並撥放影片媒體,Flash Player就變成一個中繼的播放外掛,於是流程變成瀏覽器呼叫Flash Player來幫忙解碼影片,讓用戶可以在網頁上看影片,因此多少會有效能浪費的爭議(當然如果有硬體加速支援根本就…),HTML5希望改善的就是以後插入影片插入聲音也可以像插入圖片那樣單純,基本上這點大家都同意,因此由Google為首而成的WebM專案就是目前大家都引領期盼的救贖(?)

WebM目標是建構一個開放免費的視訊檔案格式,能提供高質量的視訊壓縮配合HTML5使用,主打的是VP8格式,目前聲勢如日中天…目前,目前除了蘋果瀏覽器以外其他瀏覽器都在支援名單內,甚至硬體大廠諸如AMD/Nvidia…etc也在支援名單內(伏筆?…Intel沒在名單內),甚至最心不甘情不願的IE至少也公開發表只要安裝原生的編碼器也可以支援播放WebM,軟體廠商連Adobe自家也聲明將會支援VP8格式,Youtube也不例外,如果有興趣體驗位來的朋友,目前youtube已經有提供使用HTML5撥放影片的測試,想要嘗鮮體驗不使用Flash Player撥放的朋友可以按這裏啟動Youtube HTML5撥放器,當然請先確認你的瀏覽器支援度~理所當然Google Chroma支援度最方便,而且由於系統目前不支援含有廣告的影片這項優點限制,啟用這個功能將看不到廣告,其他支援和限制請參閱:

剛剛提到的HTML5支援的影片格式,另外一個主流便是Safari主要支援的H.264/AVC(IE也原生支援),H.264是很成熟的具備專利的影片編碼器,但是要使用他必須支付相當的權利金,相較於免費的VP8,可以想見在HTML5規格制定戰還有一段路要走,如果最後是兼容的結果…我想苦難還是開發者扛吧,因為為了廣大的客戶群你必須所有影片都需要轉至少兩種格式,最好還要可以自動辨識瀏覽器,雖然說”理論上”依照目前HTML5的開發方向這將不會是難事,但勢必未來開發者也必須對影片編碼多一些了解,因為你不再是可以把影片轉成FLV就丟給Flash Player就了事,你將直接面對影片編碼的控制及最佳化問題,編碼本身就是一個大學問,更遑論還沒成為標準之前每一家編碼都想獨占鰲頭阿。關於格式支援度”目前”的簡表如下,當然一句老話規格訂出來之前都還有變數,圖片來源在此

如果不怕閱讀原文這裡有一篇更細的

補充數據HTML5 & CSS3 Support

下一篇開始將會進入HTML5開發編寫的教學部分。