close
Blogtrottr
T客邦
T客邦 - 全站文章 
Eventbrite makes it happen

Create an event and sell tickets online through Eventbrite. It's simple! Sign up and get started today.
From our sponsors
影音漫談:HTML5 vs Flash 如何讓影音實現跨螢幕播放
Jul 23rd 2014, 04:00, by Phimedia通泰媒體

43420509d6944557490850131d113c34 在HTML 5 普及前,電腦上,99%的瀏覽器都安裝Flash Player,只要Flash Player有支援的影音格式,就能在瀏覽器中觀看。因此,早期的影音平台,包括YouTube在內,僅需使用Flash編寫的播放器在網站上觀看影音。但是,在行動裝置上,iOS系統與Android 4.0後的系統並不支援Flash。

行動裝置為什麼不願意支援Flash?主因是它較消耗資源,在記憶體較小,且電池續航力十分重要的行動裝置上並不適合。因此,Apple從一開始就拒絕Flash登陸iOS系統,而2012年,開發Flash的Adobe公司也主動宣佈退出Android的舞台。

大家可以用Adobe Flash的網站做個測試,用你的手機瀏覽器點擊這個連結,只要你是Android 4.0後的版本,或是使用iPhone、iPad,點擊後會見到錯誤訊息。代表你的手機無法觀看Flash Player播放的影片。

PC Adobe

▲在電腦上,網頁會自動偵測瀏覽器的Flash版本並告知更新

2014-01-22_11-27-55▲在行動裝置中,網頁會告知你Flash並不支援你的裝置

這是早期在iPhone的Safari瀏覽器中無法觀看線上影音的原因。儘管可以透過下載影音App來解決,但是對於影音平台來說,讓用戶必須多繞一個彎,顯然不是聰明的決定。

後來,出現了HTML5

幸虧有HTML5的發展,瀏覽器內HTML5的<video> tag功能,可以呼叫裝置中內建的播放器運作,不需額外安裝Flash Player,除了較不消耗資源之外,也讓用戶在行動裝置裡無須透過下載影音App就能播放影片。

2014-01-26_18-49-57▲ HTML5的<Video> 功能可以呼叫手機內建撥放器

只是,在行動裝置上,HTML5也有一些小缺點,例如這個YouTube中林書豪的賽事影片,由於是呼叫手機內建的播放器,因此無法像在電腦上一般,能夠任意調整畫質、開啟字幕。

2014-01-22_18-16-39▲手機的內建播放器介面不只不太好看,功能也較侷限

不過,仍然有一些變通方法,這個網站分享了相關語法,讓影片不會跳至手機內建的播放器來開啟,也因此能夠保留客製化的外觀,以及更多的操作功能。

2014-01-26_18-44-11
▲ 該影片的播放條外觀為自行設計、較有質感,還提供了字幕功能

可惜因為不是呼叫內建播放器,因此較不流暢。在旋轉螢幕改變觀看方向時,就會發現畫面切換有點卡住。不過客製介面跟功能的優點還是非常吸引人。是否要採用這種方法,可能就得看架設者的考量了。

2014-01-26_18-38-47▲如本圖,改變觀看方向時,畫面會切換得不太順暢

不能捨棄Flash的理由

既然HTML5如此強大,那為何不乾脆完全捨棄Flash Player,在電腦上也都用HTML5就好了呢?這是因為目前某些較舊瀏覽器(比如IE 8)不支援HTML5,若是貿然放棄Flash會導致某些用戶無法觀看影音。

有關瀏覽器的支援情形,可以到這個網站來瞧瞧,網站裡除了為瀏覽器評分以外,也有列出各瀏覽器開始支援HTML5的時間表。

HTML5

▲IE對HTML5的支援度始終都輸人一截,從IE 9之後總算有改善

總結來說,目前在電腦上,通常會以Flash或HTML 5編寫/呼叫播放器,讓影音能順利播放(根據瀏覽器所支援的不同,網站自動判斷給予使用者適合的語法);至於行動裝置上,則是利用HTML 5,提供使用者的觀賞影音。

HTMLFLASH

▲ 影音平台會偵測連接過來的裝置,提供Flash Player或HTML5播放功能

Facebook

馬上按讚 加入T客邦粉絲團

標籤:flash, html5, 軟體, 新聞, 技術研究

更多3C新消息,快來加入T客邦粉絲團

This entry passed through the Full-Text RSS service — if this is your content and you're reading it on someone else's site, please read the FAQ at fivefilters.org/content-only/faq.php#publishers.

You are receiving this email because you subscribed to this feed at blogtrottr.com.

If you no longer wish to receive these emails, you can unsubscribe from this feed, or manage all your subscriptions
arrow
arrow
    全站熱搜
    創作者介紹
    創作者 nbv6d9vomp1hu 的頭像
    nbv6d9vomp1hu

    線上遊戲排行榜2013/2014,進擊的巨人線上看,candy crush saga外掛,正妹寫真三圍

    nbv6d9vomp1hu 發表在 痞客邦 留言(0) 人氣()