HTML5 muudab selle elemendi veebisaitidega heli ja muusika hõlpsaks. Tegelikult on kõige raskem asi luua mitmesuguseid allikaid, mida peate tagama, et teie helifailid mängiksid kõige laias valikus brauseritega.
HTML5-i kasutamise eeliseks on see, et saate hõivata lihtsalt mõne silti abil. Seejärel mängivad brauserid heli nii, nagu oleks IMG- elemendi kasutamisel kuvatud pilt.
Kuidas lisada heli HTML5 veebilehele
Teil on vaja HTML-redaktorit , helifaili (eelistatavalt MP3-vormingus) ja helifailide muundurit.
- Esiteks, vajate helifaili. Parim on faili salvestamine MP3-vormingus ( .mp3 ), kuna see on kõrge helikvaliteediga ja seda toetavad enamik brauseritest (Android 2.3+, Chrome 6+, IE 9+, iOS 3+ ja Safari 5+).
- Teisenda faili Vorbis-vormingus ( .ogg ), et lisada Firefox 3.6+ ja Opera 10.5+ tuge. Võite kasutada konverterit nagu see, mida leidis Vorbis.com. Võite ka teisendada oma MP3 WAV-failivormingus ( .wav ), et saada Firefoxi ja Opera tugi. Soovitan postitada oma faili kõigis kolmes tüübis, turvalisuse huvides, kuid kõige rohkem vaja on MP3 ja veel üks tüüp.
- Laadige kõik helifailid oma veebiserverisse üles ja märkige kataloog, kuhu neid salvestasite. Hea mõte on asetada need alamkataloogi ainult helifaile, nagu enamik disainereid päästa pilte kataloogis.
- Lisage AUDIO elementi oma HTML-faili, kuhu soovite helifailide juhtelemendid kuvada.
- Asetage SOURCE elemendid iga AUDIO elemendi üles laaditud helifaili jaoks:
- Mis tahes AUDIO- elemendis olevat HTML-i kasutatakse tagasihoidlikena brauseritele, mis ei toeta AUDIO- elementi. Nii et lisa mõni HTML. Lihtsaim viis on HTML-i lisamine faili alla laadimiseks, kuid heli esitamiseks võite kasutada ka HTML 4.01 sisestamise meetodeid. Siin on lihtne tagavara:
Teie brauser ei toeta heli taasesitamist, laadige alla fail:
- Viimane asi, mida peate tegema, on sulgeda AUDIO elementi: audio>
- Kui oled valmis, peaks teie HTML välja nägema järgmiselt:
Lisateave
- Kasuta HTML5 doctype () kindlasti nii, et teie HTML valideeruks
- Vaadake üle elemendi jaoks kättesaadavad atribuudid, et näha, milliseid muid võimalusi saate oma elemendile lisada.
- Pange tähele, et me seadisime HTML-i, et lülitada juhtelemendid vaikimisi sisse ja automaatvideerimine välja lülitada. Muidugi saate seda muuta, kuid pidage meeles, et paljud inimesed leiavad heli, mis käivitub automaatselt / et nad ei saa enam parimal viisil häirivaks juhtida, ja jätavad sageli lihtsalt lehe, kui see juhtub.