關閉導覽列 Close Menu
數位文創
English
吳統雄
數位美學
電子書
數位視覺
優化網站
微電影
數位文創管理
大學青年網誌
研究目錄
教學課程頁
討論區目錄
站務與協助
☰
More
社群地圖
社群新聞
│吳統雄
履歷
研究
教學
服務
榮譽
│社科
第1類知識
第2類知識
第3類知識
研究方法
統計/多變項分析
投票行為與選舉預測
53237 選民結構
人類取用行為新典範
取用行為國際研究團隊
│資管
管理學‧經濟學
貨幣主義
數位貨幣‧投資行為
資訊系統開發
電子商務
網路教育
數位電視
產學合作
就業進修‧甄選必勝
│文創
數位美學/數位文創導論
數位出版/電子書
視覺設計
優化網站
數位視訊/微電影
數位文創管理
大學青年‧網路雜誌
│電音
統雄 數位音樂作品選
我,被禁唱的民歌手
數位音樂創作教學
統雄的音樂知識美學
歡迎聽歌.點歌.下載樂譜
│人文
公共評論
法律評論
社會評論
教育文化傳媒評論
科技科普評論
美語樂學
文學創作
萬象現代(NBA)
資訊社會
幽默人生
統雄樂水
Web Video/ Web Media

An Intro to Web Media Players
網頁視訊與媒體播放器

在網頁嵌入媒體播放器Intro 導論 在網頁嵌入媒體播放器Windows Media Player   在網頁嵌入媒體播放器Adobe Flash Player   在網頁嵌入媒體播放器YouTube Player  在網頁嵌入媒體播放器HTML5 Player 在網頁嵌入媒體播放器Advanced 進階

視訊播放標籤命令與應用變遷 

網頁影音視訊的應用與發展,與 4 件事有關:網頁媒體播放器命令、媒體播放器、檔案格式、瀏覽器,而又以 HTML 4  與 HTML 5 形成分水嶺。

網頁媒體播放器命令

There are two ways to insert media your own by <Embed> and <Object>. While it uses <iframe> to play remote media such as YouTube play.

The embed tag was dThere are two ways to insert media your own by <Embed> and <Object>. While it uses <iframe> to play remote media such as YouTube play.

The embed tag was deprecated in HTML 4  and XHTML 1.0 in favor of the object tag, but then was added back into the HTML 5 specification.

網頁插入自有廣播影音物件的語法最早是使用<embed>,HTML 4 和XHTML 1.0停用<embed>而改用<object>,但 HTML 5 又恢復使用<embed>,同時再新增<video> 和 <audio> 命令。 

 

網頁媒體播放器 4 大命令 

網頁媒體播放器 4 大命令是<video>,<audio>,<embed>, <object>,前兩者分別以「HTML5 媒體播放器:旭光戰場」與「網路音訊與網路收音機」專章介述。

後兩者雖已有逐漸少用的趨勢,但由於<video>,<audio>所支援的檔案格式有限,如要兼容廣泛的影音檔案格式,還是有用到的必要。

<embed>

<embed>在HTML5 前後,使用有差異。

<embed> HTML5 時代 

<embed> 的應用更加寬廣,另以「<嵌入>標籤:語法與屬性澈底研究」專篇介述。

媒體播放器 Players

媒體播放器通常都是兼可播放視訊與音樂、音效。

內嵌 ﹦外掛 ﹦插入 Embedded = Plug-ins = Insert  

當前的網頁設計,都是使用以上命令處理「內嵌、外掛 、插入」媒體播放器。

「內嵌、外掛 、插入」這 3 個字面上看起來甚至相反的詞,其實是指同一件事:設計編輯者在網頁內「插入」瀏覽器「外掛」的播放器程式,而形成瀏覽者直接在網頁上看到的「內嵌」播放器,而不是跳到其他網頁、視窗、甚至軟體中去看。

但如果使用者的瀏覽器,沒有「外掛」網頁擬內嵌的播放器程式,使用者當然還是看不到。

檔案格式

早期不同的播放器,常有自訂專用的檔案格式,現在則發展通用格式,而各播放器也多能播放各種流行的格式。

瀏覽器

早期 PC 的瀏覽器只有 IE  與 Firefox 之爭,近年加入 Chrome 成為 PC 三大,如再考慮 Apple 與行動裝置的整合,加入 Safari, Opera 形成五大瀏覽器,各家偏好支援的播放器不同,譬如隱性形成的反 IE 聯盟,全部冷處理 Windows 播放器,而造成 Flash 的崛起壯大等。而各家即使支援相同播放器,設定與效果也有不同,造成網路影音播放的大混亂、與網站設計者的大負擔。

遠端播放器

隨著瀏覽器間競爭激烈,播放器版本更新又快速,除非為了保障自己流量,維護負擔日益加重。

近年則流行將影音物件上傳影音網站後,再嵌入該網站的播放器,由該網站在遠端播放,如 YouTube。如果自有伺服器,沒有搭配 Stream server,反而是較佳的選擇。

嵌入遠端播放器使用<iframe>標籤,不過各影音站都會提供程式,不必自己撰寫。

HTML 5 媒體播放器 HTML 5  Players

HTML 5 媒體播放器-通常又分 HTML 5 Video 和 HTML 5 Audio,是以 HTML 5 規格發展設計的播放器,並非指單一品牌。

HTML 5 播放器目前正在戰國時代,另以HTML 5 播放器專篇介述。 

<embed> HTML4 時代 

<embed> is simpler to use and good for most popular players and media files including video files such as .wmv and .swf but .flv. However, it may not be functioning well for different browsers.

<embed>語法比較簡單,支援多數媒體播放器;IE 優先內嵌的Windows Player支援.wmv和.swf,但不支援.flv。其他瀏覽器通常優先內嵌支援 Flash 或 Quick Player。


<object>

<object>的應用範例,可參考Windows Media Player  和 Adobe Flash Player 的設定。

以下是進階說明。 

Advanced Settings<object> Settings 媒體播放器之參數與說明

Parameter Default Description
autoStart true Specifies or retrieves a value indicating whether the current media item begins playing automatically.
balance 0 Specifies the current stereo balance.
Values range from ?00 to 100.
baseURL   Specifies the base URL used for relative path resolution with URL script commands that are embedded in media items.
captioningID 0 Specifies the name of the element displaying the captioning.
currentMarker 0 Specifies the current marker number.
currentPosition 0 Specifies the current position in the media item in seconds.
defaultFrame - Specifies the name of the frame used to display a URL.
enableContextMenu true Specifies a value indicating whether to enable the context menu, which appears when the right mouse button is clicked.
enabled false Specifies whether the Windows Media Player control is enabled.
fullScreen false Specifies whether video content is played back in full-screen mode.
InvokeURLs true Specifies a value indicating whether URL events should launch a Web browser.
Mute false Specifies if audio is muted.
PlayCount 1 Specifies the number of times a media item will play. Minimum value of one.
Rate 1.0 Specifies the playback rate.
0.5 equates to half the normal playback speed, 2 equates to twice.
stretchToFit false Specifies whether video displayed by the control automatically sizes to fit the video window, when the video window is larger than the dimensions of the video image.
uiMode full Specifies which controls are shown in the user interface.
Possible values: invisible, none, mini, full.
URL - Specifies the name of the media item to play.
You can specify a local filename or a URL.
Volume Last setting Zero specifies no volume and 100 specifies full volume.
windowlessVideo false Specifies or retrieves a value indicating whether the Windows Media Player control renders video in windowless mode.
When windowlessVideo is set to true, the Player control renders video directly in the client area, so you can apply special effects or layer the video with text.
Supported by Windows Media Player for Windows XP or later.

連線速度改善:公共 DNS連線速度改善:公共 DNS

<Object> Settings, File Converter, Widget Design 播放標籤參數.視訊檔案轉換.視訊小工具設計File Converter, Widget Design 視訊檔案轉換.視訊小工具設計

回頁首 Up to page head 至相關主題 Go to related pages
上一頁 Back to previous page 回頁首 Up to page head 下一頁 Go to nex page
請點這裡看所有留言分類 Please click here to view categories of comments
同類別內相關主題

上層主題
Digital Video Crew 數位視訊/微電影製作劇組
數位視訊創作分析架構與建構元素 Digital Video Creation Analysis Framework and Its Formation Elements
Digital Video Design 數位視訊設計:鏡頭‧運鏡‧剪接編輯
Digital Video Storyboard 數位視訊劇本實作
劇本是用眼睛說故事 Storyboard Presented by Seeing Instead of Reading
李安自述
數位視訊-戲劇片劇本範例
微電影品析/戲劇片:劇情片‧正格3微網路極短片 Web Micromovie Analysis
微電影品析/戲劇片:廣告片‧公益片‧科幻片‧驚奇片 Drama: Adverting, Scientific Fiction
微電影品析/戲劇片:喜劇片‧諷刺片 Drama: Comedy
微電影品析/戲劇片:驚悚片‧推理片‧另類片 Horror, Detective and Alternative
微電影品析/戲劇片:行動微電影與劇本研討 Mobile Micromovie and Storyboard Discussion
記錄片的定義與分類__數位視訊/報導與評論影片 Interpretative Documentary Video
詮釋式記錄片__數位視訊/記錄片品析 Interpretative Documentary Video
新聞式記錄片_數位視訊/記錄片品析 Journalistic Documentary Video
戲劇化式記錄片_數位視訊/記錄片品析 Dramatized Documentary Video
記錄片劇本範例-產學合作成果展示
Documentary Video Design 記錄片/報導片企畫表
MV導論_音樂/歌舞影片品析 An Introduction to MV
臺灣MV的潛力_音樂/歌舞影片品析 Taiwan's Potentials, MV
臺灣MV2000後的成就與轉型掙扎 Taiwan's Fame and Reform after 2000, MV
臺灣MV流行樂:上世紀中葉的風華 Taiwan's Fame 1950s~1960s, MV
美國MV的商業與藝術的極致 USA's Edge in Commercial and Arts, MV
美國MV的重鹹什錦電音系-女性 USA's MV in Heavy Taste and Electronic Looping- Female, MV
美國MV的重鹹什錦電音系-男性與Rap文化_USA's MV in Saucy Assortment, Heavy Taste and Electronic Looping- Male and Rap Culture
美國MV的非電音系 USA's MV in None-Looping Production, MV
日本MV的多元與包裝 Japan's Diversity and Packaging, MV
AKB48家族:經營、創作、文化、人類行為 AKB48 Family: Management, Creation, Culture and Human's Behavior _Japan's MV
韓流MV三部曲 Korea K-pop Trilogy, MV
中國大陸MV的變遷 Mainland China's MV Changing, MV
大中華區MV的變遷與展望 Great China's MV Forecasting, MV
歐洲 MV 的繁華 + 女權 MV Europe's Prosperity and Women's Rights MV
東歐MV的重建 East Europe's Reforming
第三世界MV的多元文化 Third World's Pluralistic Bursting, MV
另類MV與前衛綜合視聽文創 The Other Kind of MV and Vanguard Mixed Visual/ Audio Creation
業餘歌舞快閃音樂片/快閃片品析1  Amateur Flash Mob Video
職業化快閃片‧快閃音樂劇/快閃片品析2 Professional Flash Mob Video
混合型快閃片‧快閃音樂劇/快閃片品析3 Hybrid Flash Mob Video
快閃迷模瘋/快閃片品析4  Flash Mob Video Memos
數位視訊:病毒廣告片品析 Viral Video
劇本研討-尾聲設計-原稿
劇本研討-尾聲設計-修改
劇本研討-尾聲設計-修改2
劇本研討-尾聲設計-修改3
視訊攝影機應用 Digital Video Recorder
數位影象-影片-器材
數位影象-影片-轉檔
Video Post Production 視訊後製作 Power Director 應用與剪接
Video Post Production 視訊後製作 Power Director 轉場.特效.殺青
Video Post Production 視訊後製作 Movie Maker 2012 應用與剪接
Video Post Production 視訊後製作 Movie Maker 2012 轉場.特效.殺青
Video Post Production 視訊後製作 Movie Maker 2.1 應用與剪接
Video Post Production 視訊後製作 Movie Maker 2.1 轉場.特效.殺青
網頁視訊與媒體播放器
在網頁插入微軟視窗媒體播放器
Insert Adobe Flash Player 插入Adobe Flash 播放器
Embed YouTube Player and iframe Tag 嵌入YouTube播放器與遠端影音之標籤
HTML5 Video: A Morning Glare Battlefield/ HTML5 媒體播放器:旭光戰場
Video and Media Player 播放器進階與視訊小工具
數位影象-影片-廣播


內容網站:提供與分享各種知識、資訊、作品。互動群組:社員可以討論、展示、交流、企畫、分工、管理、投票決策。合作群組:Web2.0的民主自治精神,社員可以參與決定群組的內容與表現形式。

吳統雄的音樂-Sean TX Wu's Music  笑話中學美語-Humor and American English Learning   私人來信-Write a private mail to Sean TX Wu  留言與討論 Leave Comments/ Forum 吳統雄的相簿-Sean TX Wu's Album

只在「統雄社群」內查詢以下主題 Search in TXCommunity

統雄網群的Google排行本站Google排行榜‧全球冠軍