HTML5 的 標簽真的很威武,幾乎所有的主流瀏覽器可以直接提供本地的視頻播放功能,相對于以前通過 Flash 這種類似“中繼”的播放方式,要先進很多。同時也為一些不支持 Flash 播放的移動設備帶來的希望。
也許,你會因為標簽可以支持到的視頻種類而感到困惑。嗯,到底為了實現 HTML5的特性,到底要轉換多少種編碼格式的視頻?WebM,Ogg 還是 MP4?那…iPhone 和 Android又需要哪種編碼格式?如果我還要提供高、中、低三種碼率的視頻呢?
下面就來看看到底 HTML5 標簽的詳細情況吧。
關于Web 格式
目前來說,廣泛被瀏覽器支持的的視頻編碼格式總共有三種,但是沒有一種可以達到通吃所有瀏覽器的境界。所以對于同一個視頻,至少需要兩種格式,才能在所有瀏覽器里播放。
首先要選擇一個被支持最多的視頻格式,那么就是 MP4 + H.264 這個組合了,音頻方面則是 AAC 或者 MP3。MP4封裝的視頻,可以在 Safari、Chrome 和 IE9 里播放(悲劇的是 IE9 只支持 Windows Vsita 和 Windows7)。同時,這個組合也是你通過 Flash 來作為播放器播放的最好選擇了,同時這個組合也可以在很多手持設備上播放,比如iOS、Android、Blackberry、PSP、PS3 等等。在 H.264 編碼的時候,可以選擇“High Profile”以獲得最好的編碼質量,或者“Baseline”來應對一些移動設備。
除此之外,還有兩個組合,WebM + VP8 和 Ogg + Theora + Vorbis 來滿足其他的瀏覽器。WebM 可以在Firefox(4.0+)、Chrome(6.0+)和 Opera(10.60+)中播放;Ogg 可以在Firefox(3.5+)、Chrome(3.0+)和 Opera(10.54+)中播放。
那么問題又來了,如果要從中選擇一個,是 Ogg 呢,還是 WebM 呢?
從我們(Zencoder)來看,WebM 肯定是未來開放式視頻格式的領跑者,VP8 比起 Theora 來說,要更加的優秀,而且還有強大的社區作為其后盾,特別是 Google 的支持。
反過來看 Ogg,其最大的特點是她支持了 44.64%的瀏覽器(譯者注:這里應該是指瀏覽器分部率中,可以播放的比例),而 WebM僅支持 9.35%的瀏覽器。如果僅著眼于 2010 年 10 月,那么 Ogg 也是一個不錯的選擇。如果你是為了未來的 1-2年,那么WebM 似乎更有優勢一些。
推薦:MP4 + WebM 或者 Ogg 其中一種,當然全部都編碼出來也可以 ^^。
關于移動設備
和瀏覽器的情況一樣,在移動設備上也沒有一個可以通吃全盤的編碼方案。不同的移動設備有著不同的編碼標準,甚至比起瀏覽器領域來說,更加的復雜。不過還是有一些方案可以讓你省不少精力的。
在這里你可以查看一個完整的移動設備編碼列表。
1.現在絕大多數的移動設備都支持 MP4/H.264。包括 iOS 系列的產品(iPhone、iPod、iPad、Apple TV等),絕大多數的 Android 設備,新的黑莓手機。對于這類設備,編碼的時候應該選擇“Baseline”。在分辨率上,對于 iOS 和Android 設備,選擇不高于 640×480 的分辨率即可,對于黑莓系列手機,選擇不高于 480×360 的分辨率即可。
注意:可以在 iPhone 上播放的這類編碼格式,同樣也可以在 HTML5(當然僅僅是一部分瀏覽器)或者 Flash中播放。如果你怕麻煩或者想節省一些轉換花費的時間,可以考慮選擇在編碼的時候,不高于 iOS 系列設備和 Android系列設備的分辨率。如果你不怕麻煩,并且視頻在不同的碼率上表現差異很大,或者需要在電腦上有更清晰的表現,就多編碼出來幾個不同的碼率吧。
2.對于一些老的移動設備,選擇 3GP/MPEG4。絕大多數的黑莓手機和一些 Android 的手機,都支持這種格式。同時,3GP 在 iPhone 和 iPod 上都可以播放。
3.關于 WebM,現在也許還不是一個好的選擇,雖然在一些 Android 的手機上已經可以播放,但是支持還不是很廣泛。預計未來 1-2 年會有更多的支持 WebM 格式的手機。
推薦:怕麻煩則 MP4 格式,640×480 或者 480×360。不在乎編碼時間和存儲空間,就應該選擇三種 MP4 編碼方案(480×360,640×480,720p +“Main profile”)
外加一到兩種 3GP 格式(320×240 或者 176×144),可以參考這份日志來獲取更加詳細的編碼參數。
關于多種比特率
有可能你在考慮,是不是要為帶寬很足的用戶準備高比特率的視頻,并且為了照顧小帶寬的用戶,另外再準備一份低比特率的視頻呢?如果你的用戶已經開始在互聯網上觀看高清的視頻,那么為了迎合這類用戶的習慣和用戶體驗,那么答案則為是。可以考慮提供 2-3種不同比特率或者分辨率的視頻來滿足使用不同互聯網連接方式的用戶。比如提供一份 640×360 和一份 1280×720的選擇。未來我們會更多的討論這個問題。
關于流媒體播放
本篇文章不討論關于流媒體的問題,并且 RTMP(Flash)、Smooth Streaming(Silverlight)、HTTP Live Streaming(iOS)都要求特殊的視頻格式。這已經超出了我們要討論的范圍了。未來將會有相關的文章進行討論
結論
1.最低限度的支持 HTML5,應該選擇 MP4 + WebM 或者 Ogg 其中的至少一種,并且使用 Flash 來播放 MP4 以便提供向下兼容支持。
2.移動設備方面,H.264/MP4 會讓你省心很多,如果可以提供 2-3 種不同分辨率和碼率的視頻,會大大增加兼容性。
建議
以下是關于所有類型的視頻編碼方案建議,Zencoder 支持以下列出的所有編碼格式(廣告了…)
1.只為能播放
HTML5,Flash和移動設備:MP4/H.264,使用“Baseline”編碼,480×360 或者 640×480
HTML5:WebM 或者 Ogg
2.更上一層樓
HTML5,Flash:MP4/H.264,“High profile”編碼
HTML5:WebM
HTML5:Ogg
移動設備:MP4/H.264,“Baseline profile”編碼,分辨率 480×360 或者 640×480
3.我要支持所有設備和瀏覽器
HTML5,Flash:MP4/H.264,“High profile”編碼
HTML5: WebM
HTML5:Ogg
移動設備:MP4/H.264,“Baseline profile”編碼,分辨率選擇 480×360 以便提供高兼容性
移動設備:MP4/H.264,“Main profile”編碼,分辨率 1280×720 以便支持新的設備(如 iPhone4、iPad 和 Apple TV)
移動設備:3GP/MPEG4,分辨率320×240 和(或) 177×144 以便支持非智能手機