WebM能否取代GIF？

歐美知名貼圖討論版4Chan在4月6日發表開始支援WebM格式檔案為其動態圖片格式之一，這一舉動似乎開始引起一股熱潮與討論，動態圖片格式GIF終於有挑戰者要出現了嗎？

本篇建議需使用Firefox、Chrome、Opera等瀏覽器閱讀，IE與Safari可能看不見其中一些圖與影片。

根據維基百科，GIF格式早在1987年就被制定，它的優點是檔案小、可包含多張圖片而產生動畫效果，但缺點是只有256種顏色，然因其動畫功能，讓它至今還活躍於網路上。GIF不是沒有過挑戰者，過去PNG也有支援動畫格式的擴張格式APNG，不過並不普及，無法撼動GIF動態圖片霸主的地位。

WebM是Google在2010年提倡的免費開源HTML5「影片格式」*，現在最常在Google自家Youtube HTML5版裡看見他的蹤跡。雖然WebM是影片，不過由於大多數瀏覽器有原生支援，不像flash影片還要額外載入播放器，以HTML5新增播放標籤指令，使得他能像圖片一樣，很容易就放在網頁當中。

*HTML5支援3種影片格式，分別是MP4、WebM與Ogg，MP4支援最為普及但沒人想這樣用，大概是因為MP4含有非開放的編碼技術，在使上，未來可能有衍生問題與授權爭議，WebM某種程度上就是Google因應這種問題才提出此規格(因為他們有Youtube嘛)。而Ogg雖然也是開放格式，但相容瀏覽器比WebM少，相較之下WebM是目前的最佳解。

你能看見上方的圖嗎？沒有可能表示你的瀏覽器並不支援WebM，請你改用Firefox、Chrome或是Opera瀏覽器。而有看見的朋友，上圖就是把WebM當GIF用的例子，當你把自動播放打開、隱藏控制列、開啟循環播放、靜音(或本來就不帶聲音也可)，它看起來就是GIF，只是品質更高、檔案更小。(可右鍵暫停播放，圖片取自4chan討論串)

WebM比起GIF有著以下的一些優勢：

• 圖片越大的情況下 效能越划算
• 更先進的演算法，檔案更小
• 全彩，不受限於256色，品質更好
• 原始用途是影片，所以可以有音效
• 解析度、每秒格數自由，解析度可上4K，格數可以60fps
• 大檔案時讀取更平順
• 控制自由：HTML5影片可設定不自動或自動播放，播放速度也有0.5倍、1.5倍、2倍等選擇，還支援循環播放等功能。

我製作上圖的GIF版來做對照(製作工具GifCam，設定33fps、Quantize輸出)：

在容量上，WebM是565KB，GIF版則是高達1.5MB，更要注意的是，WebM版尺寸為1280 X 720，而GIF版我只壓了640 X 360，GIF版畫面尺寸只有1/4，但容量卻大了3倍，更不用說GIF只有256色而造成畫面的顆粒感與鮮豔度上的差異，品質與容量上GIF都是完敗。

WebM品質表現範例：

新海誠《言葉之庭》片段 1920 X 1080，1700Kbps，15秒 無聲音，3.15MB

這麼優異的畫質卻只要3MB，不過這什麼好驚訝的，WebM使用的影像編碼是與H.264同級的VP8(與VP9)，完爆快30年前創造出來的老格式是自然的事。

放個長寬比異於普通影片的，《冰雪奇緣》 Elsa，520 X 856，所以基本上尺寸也是隨便你

解析度4K的範例，須注意硬體能力，硬體不足的設備可能有當機之虞。在我的電腦上，播起來像幻燈片：

再來說到效能，一開始我認為WebM本身是影片，其影像編碼技術是較近年所開發，雖然壓縮效率好，但推想其所耗費的效能應該不便宜，為了做點簡單驗證，我製作了另一組WebM/GIF來測試：

WebM:427 X 240 30fps 2.46MB 無聲音 2000Kbps

GIF版:427 X 240 33fps 18.1MB Quantize輸出

GIF由於檔案太大了，會影響瀏覽體驗並耗費許多頻寬，就不直接貼圖而只貼連結。而原始影片片段是1280 X 720，檔案3.39MB，1800Kbps。

在我AMD雙核2800的老PC上，兩者個別在相同瀏覽器中播放，CPU使用量都在10~20%間跳動，但感覺WebM可能平均高點的感覺，覺得GIF平均15%、WebM是16%這樣，不過又有GIF的CPU使用量跳動較劇烈、WebMCPU使用上下跳動幅度較小，然而沒有使用工具軟體紀錄，這是不可靠的個人感覺。然而差距不大實在讓我有點意外，雖然僅是非常粗糙且不精準的簡單測試。而在過去使用經驗上，GIF在大張並且較劇烈的動態圖片非常吃效能應是無誤的，我的電腦在播4K的WebM還會動，但我不敢想像4K的GIF...至於小尺寸且複雜度較低的動態圖片上，GIF可能還是有優勢，若WebM真有取而代之的一天，我猜動態的表情符號可能會是GIF最後用途。另外已經有許多硬體廠商已經說要為WebM做硬體加速，未來WebM的耗能只會只會更小。

WebM支援60fps(甚至120fps)，那種流暢感可以說看過就回不去了，看看以下範例：

補插至60fps的《冰雪奇緣》(Frozen)片段

補插至60fps的《魔髮奇緣》(Tangled)片段

補插至60fps的《言葉之庭》片段

補插至60fps的《冰與火之歌:權力遊戲》(Game of Thrones)第四季首集片段

WiiU遊戲《瑪利歐賽車8》(Mario Kart 8)60fps遊戲片段

WiiU遊戲《魔兵驚天錄2》(Bayonetta 2)60fps遊戲片段

《雷曼超人：傳奇》(Rayman Legends)開場畫面

另外，再來個有聲音的範例：

動畫《乒乓》孔文革登場橋段

進階功能，如播放速度之類的可以在影片上右鍵自己開來玩玩看。還有一個我覺得很重要的是可以設定不自動播放，不知大家有沒有過開啟大量GIF圖片時(很多Tumblr愛這麼幹)，整個網頁就因為大量的讀取而凍住好幾秒的經驗，且GIF又肥又大，讀取時極度衝擊效能，載入時畫面一點一點地動，幾乎要等完全載入完，畫面才正常，是很不舒服的瀏覽體驗。不自動播放就可以防止這種惡夢發生，而進階的HTML5語法，還可以設定滑鼠滑過影片就開始播放，或預先讀取但不播放等等，彈性大許多。

最後還是不免要談到缺點，WebM目前最大缺點就是並非每個瀏覽器都支援。主流5大瀏覽器中，IE與Safari就沒有支援，雖說IE9可透過安裝Google為提供的元件來取得支援，但就我個人的使用經驗，雖然可以看IE自己的提供測試頁還有Youtube的WebM影片，但看不了4chan的WebM，我自己在這部落格上貼的WebM影片(在《乒乓》觀後感一文中)也看不見，感覺支援還是有問題。更不用說IE9不支援XP與以下作業系統，XP的IE用戶無法享受此格式帶來的好處。

網路內容管理者與提供者，包括像我這樣寫部落格的人，使用WebM也要考慮到會有部分觀眾看不見的問題，4Chan提到過他們86%的造訪者使用的瀏覽器支援WebM，換句話說，即是有14%並不支援，而本部落格也會有大約10%的造訪者會看不見WebM，雖然WebM有著種種好處，但就本站而言，短時間還不能把WebM當成常用圖片格式。

WebM未來是否能有更進一步的普及呢？就短期看來，4Chan這一決定似有推動使用WebM的潮流，另外一個我常造訪，歐美最大型的遊戲論壇NeoGAF，就是因此而有人開始推動使用WebM；而reddit特定的主題區近日也逐漸看到有人在放WebM的連結(甚至出現專門子區)。這一潮流是否進一步擴大，或者只是限在某些「網路核心使用者」群體圈內短暫的風潮，還需後續觀察，但我得說，GIF老態已現，趕緊來個人來取代GIF吧。

---

倘若WebM未來真是因為取代GIF而普及，我想Google大概是最驚訝的人，畢竟他們還有提出過衍生自WebM的圖片格式WebP(雖然被人吐槽比JPG還差)。而這個WebM要是大為流通，恐怕IE市占率可能又要加速下滑了?

 

參考來源：NeoGAF、維基百科、英語版維基百科

WebM相關資訊：

4Chan目前的WebM限制： 3MB、無聲音、最長120秒、尺寸最大 2048 X 2048

 

IE的WebM元件(僅支援IE9與以上)：

• https://tools.google.com/dlpage/webmmf

微軟的HTML5影像支援測試頁面：

• http://ie.microsoft.com/testdrive/graphics/videoformatsupport/default.html

 

目前支援WebM的「圖床」：

• http://pomf.se/ (限制50MB)
• http://gfycat.com/ (容量不限，但限15秒)

影片轉Web方式：

• Potplay錄製影片支援WebM格式
• http://video.online-convert.com/convert-to-webm (線上轉換)
• http://gfycat.com/ (線上轉換 GIF->WebM)
• https://github.com/Wsheerio/webmConverter (免費轉換軟體)