3.1 <audio> tag-ın əsasları
HTML5-də <audio>
tag-ı veb-səhifəyə audio fayllar əlavə etmək üçün istifadə olunur. Bu element müxtəlif audio formatlarını dəstəkləyir və istifadəçiyə daxil olan idarəetmə elementləri təqdim edir: səsləndirmək, dayandırmaq və səs səviyyəsini tənzimləmək.
Ən sadə nümunə
<audio>
tag-ı src atributu ilə istifadə olunur. src atributu audio fayla yol göstərir. Bundan əlavə, controls
atributunu əlavə etmək olar ki, bu da səsləndirmə, pauza və səs tənzimləmə kimi standart idarəetmə düymələrini göstərir.
<audio src="audiofile.mp3" controls></audio>
Çoxsaylı mənbələr ilə nümunə
Müxtəlif browserlərin dəstəyini təmin etmək üçün <source>
tag-ı vasitəsilə bəzi audio mənbələrini qeyd etmək olar. Bu brauzerə dəstək verilən audio formatını seçməyə imkan yaradır.
<audio controls>
<source src="audiofile.mp3" type="audio/mpeg">
<source src="audiofile.ogg" type="audio/ogg">
Sizin brauzer audio elementini dəstəkləmir.
</audio>
<audio> tag-ın atributları
src
: audio fayla yol göstərir.controls
: səsləndirilmənin idarəetmə elementlərini göstərir.autoplay
: səhifə yükləndikdən dərhal sonra avtomatik olaraq audio səsləndirir.loop
: audio tamamlandıqdan sonra təkrarlanır.muted
: səhifə yükləndikdə səsi söndürür.preload
: brauzerin audioyu necə yükləməsini təyin edir. Mümkün dəyərlər: none, metadata, auto
3.2 Atributların istifadəsi nümunələri
controls atributu
controls
atributu audio oynatma idarəetmə elementlərini əlavə edir, məsələn, "Play", "Pause" düymələri və səs səviyyəsi tənzimləyicisi. Bu atribut audio elementinin daha interaktiv və istifadəçi rahat olmasını təmin edir.
Nümunə:
<audio src="audiofile.mp3" controls></audio>
autoplay atributu
autoplay
atributu audio faylın səhifə yükləndikdən dərhal sonra avtomatik oynanmasına imkan verir. Bu atributu ehtiyatla istifadə etmək lazımdır, çünki gözlənilməyən audio səsləri istifadəçiləri narahat edə bilər.
Nümunə:
<audio src="audiofile.mp3" autoplay></audio>
loop atributu
loop
atributu audio faylın sonsuz şəkildə təkrar oynanmasını tələb edir. Bu, fon musiqisi və ya təkrarlanan səs effektləri üçün faydalıdır.
Nümunə:
<audio src="audiofile.mp3" autoplay loop></audio>
muted atributu
muted
atributu audio faylın səhifə yükləndikdə səsini söndürür. Bu, audio faylın başlanğıcda səssiz oynanmasını təmin etmək üçün faydalı ola bilər, istifadəçi lazım olduqda səsi açmaq imkanı əldə edir.
<audio src="audiofile.mp3" muted></audio>
preload atributu
preload atributu brauzerə audio faylın səhifə yüklənərkən necə yüklənməsi lazım olduğunu bildirir. Üç dəyər qəbul edə bilər:
none
: brauzer audio əvvəlcədən yükləməməlidirmetadata
: brauzer yalnız metadata yükləməlidir (məsələn, uzunluq, ölçü və s.)auto
: brauzer səhifə yükləndikdə tam audio faylı yükləməlidir
<audio src="audiofile.mp3" preload="auto"></audio>
3.3 Dəstəklənən audio formatları
Brauzerlər arasında uyğunluğu təmin etmək üçün bir neçə audio formatından istifadə etmək tövsiyə olunur. Ən çox yayılmış formatlar MP3, OGG və WAV-dır. Gəlin onları daha ətraflı nəzərdən keçirək.
MP3 formatı
MP3 (MPEG-1 Audio Layer III) — ən populyar audio formatlarından biridir. O, əksər brauzerlər və cihazlar tərəfindən dəstəklənir. MP3 itgili sıxılma istifadə edir, bu isə fayl ölçüsünü kiçiltməyə imkan verir, səs keyfiyyətini isə kifayət qədər yüksək səviyyədə saxlayır.
Nümunə:
<audio src="audiofile.mp3" type="audio/mpeg"></audio>
OGG formatı
OGG (Ogg Vorbis) — itgili sıxılma ilə açıq audio formatdır, əksər müasir brauzerlər tərəfindən dəstəklənir. Bu format yaxşı səs keyfiyyəti təqdim edir və çox vaxt MP3 üçün alternativ kimi istifadə olunur.
Nümunə:
<audio src="audiofile.ogg" type="audio/ogg"></audio>
WAV formatı
WAV (Waveform Audio File Format) — sıxılmamış audio formatıdır, yüksək səs keyfiyyəti təmin edir. Lakin WAV faylları MP3 və OGG ilə müqayisədə daha böyük ölçüyə malikdir, buna görə də onlar vebdə daha az istifadə olunur.
Nümunə:
<audio src="audiofile.wav" type="audio/wav"></audio>
3.4 Formatların Uyğunluğu
Bütün brauzerlər eyni audio formatlarını dəstəkləmir. Cross-browser uyğunluğu təmin etmək üçün MP3, OGG və WAV kimi bir neçə audio formatından istifadə etmək tövsiyə olunur.
Bir neçə formatın dəstəkləndiyi nümunə:
<audio controls>
<source src="audiofile.mp3" type="audio/mpeg">
<source src="audiofile.ogg" type="audio/ogg">
<source src="audiofile.wav" type="audio/wav">
Sənin brauzerin audio elementini dəstəkləmir.
</audio>
Keçidlilik
Keçidliliyi təmin etmək üçün brauzer <audio> elementi və ya audio fayllarını dəstəkləmədiyi hallarda yazılı alternativ təklif edilməlidir. Bu, açıq və bağlanış <audio> teqləri arasında mətn əlavə etməklə həyata keçirilə bilər.
Keçidliyin təmin edilməsi nümunəsi:
<audio controls>
<source src="audiofile.mp3" type="audio/mpeg">
<source src="audiofile.ogg" type="audio/ogg">
<source src="audiofile.wav" type="audio/wav">
Sənin brauzerin audio elementini dəstəkləmir.
Səs faylını <a href="audiofile.mp3">buradan</a> yükləyə bilərsən.
</audio>
<audio> teqinin imkanlarını və onun API-sini başa düşmək daha interaktiv və keçidli veb səhifələrin yaradılmasına kömək edir.
GO TO FULL VERSION