HTML5 Medya Etiketleri
- HTML5,herhangi bir eklentiye gerek duymadan görüntü ve ses çalabilir.Henüz bu konuda flash teknolojisininkullanılabilirliğine ve kabiliyetine ulaşmış değildir.
- Öncelikle yeni gelen medya etiketlerini listeleyip sonra onlar hakkında bilgi verelim.
- <audio>
- <video>
- <source> <embed> <track>
<audio>
• Ses ve müzik dosyalarının çalmasını sağlayanetikettir.
• MP3,WAV ve Ogg formatlarını desteklemektedir. Örn:
<video width=“320” height=“240” controls src=“video.mp4”> Tarayıcınız video etiketini desteklemiyor.
</video>
<source>
- source etiketi audio veya video gibi etiketlerin içeriinde kullanılır.
- Amacı aynı dosyanın farklı formatlarını listleyiptarayıcının desteklediği formatı seçmesini sağlamaktır.<audio controls>
<source src=“ses.ogg” type=“audio/ogg”><source src=“ses.mp3” type=“audio/mpeg”></audio> - Yukarıdaki örnek tarayıcı iki tane seçenek sunuyor.
- Aynı dosyanın bir MP3 formatındaki hali birde Ogg formatındaki halibulunuyor.
- Tarayıcı hangi formatı destekliyorsa onu seçip çalacaktır.
<embed>
• embed etiketi harici bir uygulamanın veya bir eklentinin web sayfasına gömülmesini sağlar.
• Genişlik(width) ve yükseklik(height) özellikleri ile ekrandaki boyutu düzenlenebilir.
Örn:
<embed src=“helloworld.swf”>
• Yukarıdaki örnekte bir swf dosyasının web sayfasının içine gömülmesini sağlıyor.
<track>
- track etiketi bir noktada source etiketine benziyor.
- Yani audio ve video etiketleri içerisinde yer alıp ilgili dosya çalarken o dosya ile ilgili yazıların(altyazı,başlık,tanım) çıkmasını sağlar.Örn:<video width=“320” height=“240” controls><source src=“film.mp4” type=“video/mp4”>
<source src=“film.ogg” type=“video/ogg”>
<track src=“altyazi.vtt” kind=“subtitles” srclang=“en” label=“English”><track src=“altyazi.vtt” kind=“subtitles” srclang=“tr” label=“Türkçe”></video>
- Yukarıdaki örnekte video etiketi içerisinde bir filmin farklı iki formattaki hali verilmiştir.
- Tarayıcı bunlardan desteklediğini çalacaktır.
- Aynı zamanda iki tane alt yazı dökümanı verilmiş.
- Kullanıcı hangisini isterse o alt yazı gösterilecektir.
- kind özelliği ile bu yazının türü ayarlanabilmektedir.
- Değer olarakcaptions(başlık),descriptions(tanım),metadata(bilgi),su btitles(altyazı) gibi değerler alabilir.kind olarak subtitlekullanıldığında srclang özelliğinde dil belirtilmelidir.