Prej brskalniki niso imeli vgrajenih zmožnosti za podporo avdio in video vsebin, z razvojem interneta pa je podpora za večpredstavnostne elemente kot zmožnosti sodobnih brskalnikov postala nujna. V HTML5 so bili uvedeni novi elementi

Format zvočne datoteke določa strukturo in predstavitvene značilnosti zvočnih podatkov, ko so shranjeni na mediju (naprava za shranjevanje). Za odpravo redundance zvočnih podatkov se praviloma uporabljajo posebni zvočni kodeki, zahvaljujoč katerim se zvočni podatki stisnejo. Sodobni brskalniki podpirajo naslednje 3 zvočne formate:

Brskalnik	MP3	Wav	Ogg
DA	DA	DA
DA	DA	DA
Opera	DA	DA	DA
DA	DA	NE
IE	DA	NE	NE
Rob	DA	DA	NE

• MP3 format je kodek in vsebnik hkrati. Povsod se pogosto uporablja za gostovanje naložljive glasbe.
• format WAV- tudi kodek in vsebnik hkrati.
• Ogg vsebnik + avdio kodek Vorbis... Običajno se imenuje "Ogg Vorbis". Razvila ga je skupnost Xiph, da bi nadomestila patentirane MP3, AAC in WMA.

Vrste MIME za zvok:

Format

Vrste MIME
MP3	avdio / mpeg
Ogg	avdio / ogg
Wav	avdio/wav

Podpora za brskalnik

Oznaka			Opera		IExplorer	Rob
	4.0	3.5	10.5	4.0	9.0	12.0

Lastnosti

atribut	Pomen	Opis
samodejno predvajanje	samodejno predvajanje	Označuje, da se bo zvok samodejno začel, takoj ko bo pripravljen.
kontrole	kontrole	Prikaže vgrajene kontrole predstavnostnih datotek (gumb za predvajanje/pavza, drsnik za skok na določen posnetek in drsnik za glasnost).
zanka	zanka	Predvajanje datoteke zanke (naša pesem je dobra - začni znova) ..
utišan	utišan	Označuje, da bo zvok utišan (brez zvoka).
prednapetost	avto metapodatkov nobenega	Določa, kako naj se zvok naloži ob nalaganju strani. Atribut je prezrt, če je prisoten atribut samodejnega predvajanja.
src	URL	Določa URL zvočne datoteke.

Primer uporabe

Element

Zvok v HTML5

V tem primeru:

Na stran je dodana zvočna vsebina (oznaka

Ena najbolj izjemnih lastnosti HTML5 pretaka zvok.

Če se ukvarjate s področjem spletnega razvoja, potem izbira 10 neverjetnih zvočnih predvajalnikov HTML5 zelo koristno za vas.

- avdio in video predvajalnik, ki je napisan v čistem HTML5 in CSS... Podpora za starejše brskalnike je končana Bliskavica in Srebrna svetloba igralci, ki posnemajo HTML5 MediaElement API.
MediaElement ima številne preobleke in podporo za priljubljene platforme: WordPress, Drupal, Joomla itd.

Ta predvajalnik je precej minimalističen, vendar funkcionalen. Odlično, ko potrebujete sezname predvajanja in trendovske učinke!

Še en odličen igralec, verjetno najboljši na tem seznamu. prednosti ker je zelo enostaven za prilagajanje in je dovolj prilagodljiv po velikosti in prilagodljiv za neomejeno število barv.
Imeti podpora za več brskalnikov, za starejše brskalnike pa obstaja Bliskavica- analogno.

Uporabljate Mootools na vaši spletni strani? Če je odgovor pritrdilen, vam bo morda všeč ta predvajalnik HTML5 in Mootools JavaScript okvir. Predvajalnik deluje odlično v vseh sodobnih brskalnikih.

Ta igralec je edini s seznama, ki je plačan. On je vreden vsega $5 ampak deluje odlično. Predvajalnik ima številne uporabne funkcije, kot je zaščita vašega zvoka pred prisluškovanjem s prekrivanjem, kar je zelo dobro za komercialno uporabo.

vir: http://codecanyon.net/item/universal-html5-audio-player

V vključene tehnologije HTML5 in Bliskavica zaradi česar je zelo lahek ( 10 Kb) zanesljiva rešitev med brskalniki za predvajanje pretočnega zvoka.
Želite vedeti, kaj lahko storite Upravitelj zvoka 2? Obiščite, da si ogledate demo!

Opis

Dodaja, predvaja in upravlja nastavitve snemanja zvoka na spletni strani. Pot datoteke je podana prek atributa src ali ugnezdene oznake. V notranjosti posode

Seznam kodekov, ki jih podpirajo brskalniki, je omejen in je prikazan v tabeli. 1.

Tab. 1. Kodeki in brskalniki

kodek	internet Explorer	Chrome	Opera	Safari	Firefox
ogg / vorbis
wav
mp3
AAC

Za univerzalno predvajanje v določenih brskalnikih se zvok kodira z različnimi kodeki, datoteke pa se hkrati dodajo prek oznake .

Sintaksa

Lastnosti

Zvok se začne predvajati takoj, ko se stran naloži. Zvočni datoteki doda nadzorno vrstico. Ponavlja zvok od začetka po koncu. Uporablja se za nalaganje datoteke skupaj z nalaganjem spletne strani. Določa pot do datoteke, ki se predvaja.

Končna oznaka

Obvezno.

HTML5 IE 8 IE 9+ Cr Op Sa Fx

Aleksander Klimenkov - Štirinajst

Rezultat primera v brskalniku Opera je prikazan na sl. 1.

riž. 1. Predvajanje zvočne datoteke

Brskalniki

Kontrole za predvajanje zvoka se razlikujejo po videzu med brskalniki, vendar so osnovni elementi enaki. To so gumb za predvajanje/pavza, dolžina skladbe, pretečeni in skupni čas predvajanja ter raven glasnosti.

S prihodom razmeroma hitrih internetnih povezav je bil Flash edino orodje za predvajanje zvokov na spletnih mestih. Toda HTML5 bo bistveno spremenil način predvajanja zvokov na internetu. V tem članku vam želim podrobno povedati, kako uporabljati oznako na vaših spletnih mestih.

Uporabljamo

Spodaj je najenostavnejši primer uporabe oznake, prenese datoteko mp3 in jo predvaja. Bodite pozorni na atribut avtopalija ki se uporablja za samodejno predvajanje zvoka. Vendar ne bi smeli samodejno predvajati zvokov na spletnem mestu, ker to moti uporabnike.

Predvajajte zvok v zanki

Želite zankati zvok? Pri tem vam bo pomagal atribut zanke. Ampak še enkrat, ne zlorabljajte samodejnega predvajanja in zanke, če ne želite, da uporabnik predčasno zapusti spletno mesto.

Prikaz kontrolnikov

Namesto samodejnega predvajanja zvokov, kar je vsekakor slaba praksa, bi morali brskalniku pustiti, da prikaže nekatere kontrole, kot so gumbi za glasnost in predvajanje (pavza). To je enostavno narediti tako, da preprosto dodate atribut kontrole.

Različne oblike datotek

Oznako podpira večina sodobnih brskalnikov, vendar je težava v tem, da različni brskalniki podpirajo različne oblike datotek. Safari, na primer, lahko predvaja datoteke MP3, Firefox pa ne, in namesto tega predvaja datoteke OGG. Rešitev tega problema je uporaba obeh formatov, tako da lahko vsak obiskovalec sliši zvok, ne glede na to, kateri brskalnik uporablja.

Določanje vrste datotek MIME

Pri uporabi različnih formatov datotek je dobra praksa, da določite vrsto MIME za vsako datoteko, da brskalniku pomagate lokalizirati datoteko, ki jo podpira. To je mogoče enostavno narediti z uporabo atributa tip.

Za starejše brskalnike

Kaj pa, če obiskovalec uporablja IE6 ali kakšen drug prazgodovinski brskalnik, ki ne podpira oznake? Vse je preprosto: spodaj je koda, ki bo prikazala sporočilo za brskalnike, ki ne podpirajo oznake.

Medpomnjenje datotek

Pri predvajanju velikih datotek se lahko uporabi medpomnjenje datotek. Za to lahko uporabite atribut prednapetost... Lahko ima 3 vrednosti:

• nobenega- če ne želite uporabiti medpomnilnika datotek;
• avto- če želite, da brskalnik medpomni celotno datoteko;
• metapodatkov- za prenos samo informacij o storitvi (trajanje zvoka itd.).

Nadzor predvajanja JavaScript

Zvočni predvajalnik HTML5 je zelo enostavno nadzorovati prek JavaScripta. Naslednji primer prikazuje, kako lahko z JavaScriptom zgradite svoje osnovne kontrole predvajalnika zvoka:

To je vse za danes.
Upamo, da vam je ta članek pomagal razumeti osnovne zmogljivosti oznak HTML5. .

To vprašanje se pojavlja zelo pogosto, zato sem se odločil, da mu v pouku posvetim ločen članek. Ker HTML nima univerzalne tehnologije za predvajanje zvoka za vse brskalnike, za rešitev te težave predlagam, da prenesete datoteko avdio predvajalnika, kot je to storjeno na večini spletnih mest. Vse naredimo po korakih:

1. Na gostovanju, kjer se nahaja vaše spletno mesto, v korenskem imeniku (mapa, kjer je indeksna datoteka), ustvarite zvočno mapo. V prihodnosti boste vanj postavili vse zvočne datoteke.

3. Zdaj izberite datoteke, ki jih želite, po možnosti v formatu mp3. Ustvarite mapo zvok v korenu spletnega mesta in jih naložite.

4. Vse kar ostane je, da vstavite kodo za povezavo predvajalnika. Primeren je za katero koli spletno mesto. Na pravem mestu morate samo določiti pot do datoteke predvajalnika in zvočne datoteke ter ustrezno zamenjati besede vaša_domena in ime_avdio_datoteke:

In končali ste! Ogledate si lahko tudi delo primer.

Kako nastaviti glasbo v ozadju v html

S pomočjo zmožnosti HTML in brskalnika lahko na stran vstavite tudi glasbo v ozadju. Potrebovali boste zvočno datoteko pravilne oblike: WAV, AU, MIDI ali MP3. Za primer lahko uporabite katero koli datoteko z določeno pripono.

Prvi način je vdelana oznaka. Element embed se uporablja za nalaganje in prikaz predmetov (na primer video datotek, flash filmov, nekaterih zvočnih datotek itd.), ki jih brskalnik izvorno ne razume.

Sintaksa je precej preprosta:

Zaključna oznaka ni potrebna.

Zdaj pa si poglejmo primer zapisa z atributi in spodaj z njihovim dekodiranjem:

Vdelajte atribute oznake za predvajanje zvoka v html
širina - širina plošče v slikovnih pikah (ali odstotkih)
višina - višina plošče v slikovnih pikah (ali odstotkih)
poravnaj - položaj plošče glede na besedilo, možne vrednosti so levo, desno, sredinsko
hidden - omogoča vam, da skrijete ploščo, vrednosti atributov: true - plošča je skrita, false - plošča je vidna (privzeta vrednost)
autostart - vrednost true - predvajalnik se samodejno zažene, ko se stran naloži, false - počaka, da se pritisne gumb za predvajanje
loop - zanka, true - skladba se predvaja v krogu, in če je napačna - samo enkrat

Drugi način. Zelo staro, a tudi praktično) Dodajte melodijo v isto mapo (imenik), kjer je vaša datoteka, in v telo vpišite naslednjo kodo:

Posledično se bo po nalaganju strani oglasila melodija, ki ste jo določili v oznaki bgsound. Zdaj pa si pobliže oglejmo atribute oznake. :

src- pot do vaše zvočne datoteke
zanka- kolikokrat ponoviti melodijo (če -1, potem se ponavlja neskončno)
ravnovesje- vrednost stereo ravnotežja (od -10000 do 10000)
glasnost- glasnost predvajanja melodije, kjer je 0 največja, -10000 pa najmanjša.

Predvajalnika pa nikakor ne bo mogoče nadzorovati - vsakič, ko se stran osveži, se bo skladba znova predvajala.

Po opisu načina vstavljanja glasbe v ozadju vas želim od tega odvrniti, saj večina uporabnikov ob obisku različnih spletnih mest praviloma že posluša glasbo. Zato ga lahko spremljajoča glasba le prisili, da zapre zavihek s stranjo.

Vstavite zvok in glasbo v HTML5 - zvočno oznako

zvok- seznanjena oznaka, ki določa zvok v ozadju, glasbo ali drug zvočni tok na spletnem mestu.

Atributi zvočne oznake

samodejno predvajanje- datoteka se predvaja takoj, ko se stran naloži (podobno kot glasba v ozadju bgsound)
kontrole- prikaže nadzorno ploščo predvajalnika v brskalniku
zanka- ponovno predvaja datoteko po koncu
prednapetost- prenos zvočne datoteke se bo zgodil skupaj z nalaganjem strani
src- pot do zvočne datoteke (mp3 ali ogg)

Vzorec kode z zvočno oznako

Zvok v HTML 5