使用HTML5在當前瀏覽器中顯示視頻

HTML 5視頻標籤可以輕鬆地將視頻添加到您的網頁中 。 儘管表面看起來很簡單，但您需要做很多事情才能使視頻正常運行。 本教程將引導您完成在HTML 5中創建頁面的步驟，該頁面將在所有現代瀏覽器中運行視頻。

• 承載自己的HTML 5視頻與使用YouTube
• Web上的視頻支持快速概述
• 創建和編輯您的視頻
• 將視頻轉換為Ogg for Firefox
• 將視頻轉換為Safari的MP4
• 將視頻轉換為Internet Explorer的FLV
• 將視頻元素添加到您的網頁
• 添加JavaScript和Flash Player以使Internet Explorer工作第1部分
• 在盡可能多的瀏覽器中進行測試

01 10

承載自己的HTML 5視頻與使用YouTube

YouTube是一個很棒的網站。 它使得將視頻快速嵌入網頁變得很容易，並且在執行這些視頻時有一些小的例外情況是相當無縫的。 如果您在YouTube上發布視頻，您可以相當確信任何人都可以觀看該視頻。

但使用YouTube嵌入您的視頻有一些缺點

YouTube的大部分問題都出現在消費者方面，而不是設計師方面，例如：

• 搜索和索引緩慢
• 服務器中斷
• 內容被任意刪除（表面上）
• 太多不好的內容

但是YouTube對內容開發人員不利的原因也有一些，其中包括：

• 視頻最長10分鐘（免費帳戶）
• 上傳性能不佳
• YouTube獲得視頻的無限使用權
• 任何YouTube用戶都可以獲得視頻的無限使用權

HTML 5視頻在YouTube上提供了一些優勢

將HTML 5用於視頻可讓您控制視頻的每個方面，從哪些人可以查看視頻，視頻的時間長度，內容的內容，託管位置以及服務器的性能。 而HTML 5視頻讓您有機會以盡可能多的格式對視頻進行編碼，以確保最大數量的人可以查看它。 您的客戶不需要插件，或等到YouTube發布更新版本。

當然，HTML 5視頻提供了一些缺點

這些包括：

• 您必須至少使用三種不同的編解碼器編碼您的視頻
• 您必須包含一些JavaScript以確保不支持HTML 5的瀏覽器可以正常工作
• 您的服務器必須能夠處理託管視頻的帶寬需求

02之10

Web上的視頻支持快速概述

向網頁添加視頻一直是一個困難的過程。 有太多事情可能會出錯：

• 首先，您使用標籤將視頻嵌入到您的頁面中。 但是該標籤已被棄用而轉而使用另一個標籤。 無論如何，一些瀏覽器從來不支持它。
• 因此，您切換到