成都小程序開發(fā)通常認(rèn)為網(wǎng)頁主要是視覺體驗(yàn)，當(dāng)然這是事實(shí)。但是如果您想在網(wǎng)頁中添加聲音元素怎么辦？如果您不害怕一些簡單的HTML，HTML音頻標(biāo)簽是一種讓用戶在您的網(wǎng)站上播放音頻文件的簡單方法。
HTML音頻標(biāo)簽允許您在網(wǎng)頁上播放音頻文件，例如音樂、錄制的語音或聲音效果。該元素允許用戶控制音頻文件的播放，并支持MP3、WAV和OGG格式。
要?jiǎng)?chuàng)建HTML音頻標(biāo)簽，有幾種方法可以編寫音頻標(biāo)簽的語法。
該標(biāo)簽還包含controls屬性，該屬性顯示瀏覽器對音頻文件播放的默認(rèn)控件（如播放/暫停按鈕、時(shí)間調(diào)整、音量等）。如果刪除控件屬性，這些控件將不會(huì)顯示，用戶將無法與它們交互。僅當(dāng)您想創(chuàng)建自己的控制界面時(shí)才建議這樣做-但最簡單的方法是保持瀏覽器的默認(rèn)控件可見。
另外，文本“您的瀏覽器不支持音頻元素?！笔呛髠湮谋?，僅在音頻元素由于缺乏瀏覽器支持而無法加載時(shí)才會(huì)顯示。這種情況不太可能發(fā)生，因?yàn)閹缀跛鞋F(xiàn)代瀏覽器都支持HTML5音頻元素，并且不需要后備內(nèi)容，但以防萬一添加它也沒有什么壞處。
您還可以編寫音頻標(biāo)簽，并在其中嵌套一個(gè)或多個(gè)<source>標(biāo)簽。如果您想要包含多個(gè)音頻文件源作為后備，以防瀏覽器不支持列出的第一個(gè)文件源，這非常有用。如果列出了多個(gè)源，瀏覽器將播放它支持的第一個(gè)文件。
默認(rèn)情況下，HTML音頻元素不會(huì)播放音頻，直到用戶通過單擊播放按鈕控件（或發(fā)生JavaScript觸發(fā)器）來觸發(fā)它。但是，添加autoplay屬性將使音頻在元素加載后立即播放。
重要的是，自動(dòng)播放音頻（和視頻）會(huì)導(dǎo)致較差的用戶體驗(yàn)和較差的可訪問性，因?yàn)橥蝗坏穆曇魰?huì)擾亂用戶的流程，還會(huì)消耗大量的移動(dòng)數(shù)據(jù)。人們通常喜歡在沒有輸入的情況下突然播放聲音，這就是為什么Chromium瀏覽器（例如Chrome、Edge、Opera）不允許音頻自動(dòng)播放。
但是，如果還使用靜音屬性，音頻將自動(dòng)播放，我們將在接下來討論。
如果您想在頁面加載后自動(dòng)播放音頻，請使用muted屬性。這樣，音頻將自動(dòng)播放，用戶可以選擇打開它。
最后，循環(huán)屬性使音頻文件結(jié)束后重新開始，因此它會(huì)連續(xù)循環(huán)播放。例如，如果您想一遍又一遍地演奏甜美的鼓樂，它會(huì)很有用。
網(wǎng)站音頻是否方便用戶使用？
簡短的回答：是的，如果使用得當(dāng)，音頻是用戶友好的。
更長的答案：在我看來，正確使用音頻可以成就或破壞網(wǎng)站的用戶體驗(yàn)，并且是網(wǎng)絡(luò)開發(fā)和用戶體驗(yàn)交叉的一個(gè)很好的例子。
例如，如果用戶打開您的網(wǎng)站并聽到他們意想不到的聲音，這將立即影響他們對您的網(wǎng)站和品牌的印象。特別是當(dāng)他們在一家安靜的咖啡店里時(shí)，尤其是當(dāng)每個(gè)人都能聽到響亮的、具有破壞性的音效時(shí)。（是的，這發(fā)生在我身上。）
這就是為什么我認(rèn)為允許所有用戶控制其網(wǎng)站的音頻是最佳實(shí)踐。如果您要在頁面上展示音頻元素，請確保用戶能夠啟動(dòng)/停止它并靜音（如果這是他們的偏好）。出于這個(gè)原因，我通常不鼓勵(lì)在網(wǎng)站或網(wǎng)絡(luò)應(yīng)用程序上伴隨通知發(fā)出聲音，或者默認(rèn)將其關(guān)閉。
我能想到的一個(gè)例外是一個(gè)旨在流式傳輸視頻或音軌的頁面（例如YouTube視頻頁面）。當(dāng)用戶打開此頁面時(shí)，他們期望視頻或音頻自動(dòng)播放-但這是他規(guī)則的一個(gè)例外。
此外，在向頁面添加音頻時(shí)，請考慮是否真的有必要打造體驗(yàn)。它會(huì)增強(qiáng)體驗(yàn)還是分散體驗(yàn)？如果它是一個(gè)移動(dòng)網(wǎng)站，這聽起來是否證明加載時(shí)間和數(shù)據(jù)使用的額外成本是合理的？
通過成都小程序開發(fā)的總結(jié)您就了解了音頻在HTML頁面上如何工作的基礎(chǔ)知識(shí)。盡管從概念上講，此元素使用起來很簡單，但您可以利用它使您的網(wǎng)站更具活力和吸引力。只是盡量不要用意外的噪音嚇到任何人，好嗎？
