處理網頁內容中的媒體支援問題
網頁上音訊和影片呈現和操作的一個現實情況是，存在許多媒體格式，其流行程度和功能各不相同。對於使用者來說，選擇眾多是件好事，因為他們可以選擇最適合其需求的格式。然而，也存在一個缺點：由於可供選擇的格式太多，並且涉及許多不同型別的許可證和設計原則，因此每個網頁瀏覽器開發者在決定支援哪些媒體檔案型別和編解碼器時都只能依靠自身。
這給網頁開發者帶來了一點負擔，但相當容易克服：在使用者瀏覽器無法處理特定型別的媒體時，正確處理這種情況。本指南介紹了可用於開發滿足媒體需求並提供儘可能廣泛相容體驗的網頁內容的技術。我們將探討的主題包括回退、基線媒體格式和錯誤處理實踐，這些實踐將使您的內容在儘可能多的情況下都能正常工作。
使用海報幀
**海報幀**是指代表影片內容的靜態影像。這可能是影片的第一幀；但是，在許多情況下，第一幀是空白的，或者只包含企業徽標或其他不向讀者提供影片內容上下文的一些影像。
好的海報幀要麼代表影片內容，要麼是並非來自影片本身的影像，但包含向讀者提供影片內容有用資訊的影像和/或文字。例如，對於動作片，海報幀可能是電影最著名場景之一的標誌性示例影像。
類似的概念可以應用於靜態影像；如果您要呈現的影像非常大，並且可能需要時間下載（尤其對於速度較慢的裝置或連線），您可以提供一個低解析度或替代版本，該版本將在完整質量版本可用顯示之前顯示。
我們將介紹這兩種情況以及如何實現它們。
影片的海報幀
漸進式影像
影像（無論是使用 <img> 還是 <picture> 嵌入）都不支援類似於海報幀的概念。但是，有一些方法可以在影像仍在載入時以低質量呈現影像。這需要使用**漸進式**格式（如漸進式 JPEG 或隔行掃描 PNG）建立影像。
將影像轉換為漸進式格式後，您可以照常使用它。
<img
src="/images/staff-photo-huge-progressive.jpg"
alt="Staff Photo, taken in January of 1972" />
使用漸進式影像時，資料以這樣一種方式儲存，即瀏覽器能夠儘快呈現影像的低質量表示，然後在載入影像時或載入完成後更新影像以呈現完整質量的影像。
注意：漸進式（或隔行掃描）影像本質上比相同影像的非漸進式版本略大。是否進行隔行掃描以使您的使用者受益，取決於您自己決定。