Ako pridať zvuk na webovú stránku HTML5

HTML5 uľahčuje pridávanie zvuku a hudby na vaše webové stránky elementom. V skutočnosti je najťažšia vec, ktorú musíte urobiť, aby ste vytvorili viac zdrojov, ktoré potrebujete, aby ste sa uistili, že vaše zvukové súbory budú prehrávať na najrôznejších prehliadačoch.

Výhodou používania HTML5 je, že môžete vložiť zvuk iba pomocou niekoľkých značiek. Prehliadače potom prehrávajú zvuk rovnako ako pri zobrazení prvku IMG .

Ako pridať zvuk na webovú stránku HTML5

Budete potrebovať editor HTML , zvukový súbor (najlepšie vo formáte MP3) a prevodník zvukových súborov.

  1. Najprv potrebujete zvukový súbor. Najlepšie je nahrávať súbor vo formáte MP3 ( .mp3 ), pretože má vysokú kvalitu zvuku a podporuje väčšinu prehliadačov (Android 2.3+, Chrome 6+, IE 9+, iOS 3+ a Safari 5+).
  2. Preveďte súbor do formátu Vorbis ( .ogg ) a pridajte ho do služby Firefox 3.6+ a Opera 10.5+. Môžete použiť konvertor, ako je ten, ktorý sa nachádza na stránke Vorbis.com. Môžete tiež previesť MP3 do formátu súboru WAV ( .wav ), aby ste získali podporu pre Firefox a Opera. Odporúčam vám uverejniť súbor vo všetkých troch typoch, len pre bezpečnosť, ale najviac, čo potrebujete, sú MP3 a jeden ďalší typ.
  3. Nahrajte všetky zvukové súbory na váš webový server a poznačte si adresár, v ktorom ste ich uložili. Je to dobrý nápad umiestniť ich do podadresára len pre zvukové súbory, podobne ako väčšina návrhárov ukladá obrázky v adresári obrázkov .
  4. Pridajte prvok AUDIO do súboru HTML, kde chcete zobraziť ovládacie prvky zvukových súborov.
  5. Položky SOURCE umiestnite pre každý zvukový súbor, ktorý odovzdáte vo vnútri prvku AUDIO :
  1. Akýkoľvek HTML vo vnútri prvku AUDIO sa použije ako záloha pre prehliadače, ktoré nepodporujú prvok AUDIO . Takže pridajte nejaký HTML. Najjednoduchším spôsobom je pridať HTML, aby ste mohli stiahnuť súbor, ale na prehrávanie zvuku môžete použiť aj metódy vkladania HTML 4.01. Tu je jednoduchá záloha:

    Váš prehliadač nepodporuje prehrávanie zvuku, stiahnite súbor:

    1. MP3 ,
    2. Vorbis , WAV
  2. Posledná vec, ktorú musíte urobiť, je zatvoriť prvok AUDIO :
  3. Keď skončíte, HTML by mal vyzerať takto:
    1. Váš prehliadač nepodporuje prehrávanie zvuku, stiahnite súbor:

    2. MP3 ,
    3. Vorbis ,
    4. WAV

Ďalšie tipy

  1. Uistite sa, že používate HTML5 doctype (), aby váš HTML overil
  2. Pozrite si atribúty, ktoré sú k dispozícii pre prvok, aby ste zistili, aké ďalšie možnosti môžete pridať do svojho prvku.
  3. Všimnite si, že sme HTML nastavili tak, aby predvolene obsahovali ovládacie prvky a vypínali automatické prehrávanie. Môžete to samozrejme zmeniť, ale nezabudnite, že veľa ľudí nájde zvuk, ktorý sa spustí automaticky /, že nemôžu kontrolovať, aby boli v najlepšom prípade nepríjemné a často sa v prípade, že sa to stane, často opustí stránku.