HTML track Etiketi Nedir ve Nasıl Kullanılır?
HTML track elementi; video veya ses dosyalarınıza alt yazı, açıklama, başlık vb. gibi içerikler eklemek için kullanılan bir elementtir. Örneğin farklı bir dildeki videoyu web sayfanıza ekleyip, bu video için Türkçe dil paketleri hazırlayıp, bu dil paketini track elementi ile videonuza ekleyebilirsiniz. Zaten track elementi video ve ses dosyalarıyla birlikte çalışan bir elementtir.
track elementi henüz çoğu tarayıcı tarafından desteklenmemektedir.
track etiketinin kullanımı aşağıdaki gibidir.
<track src=”content_path” kind=”content_type” srclang=”tr” label=”Turkish”>
Yukarıdaki track elementinin kullanımını açıklamaya çalışalım. src parametresinde ekleyeceğimiz içerik dosyasının yolunu vermeliyiz. kind parametresinde ise bu eklediğimiz dosyanın tipini belirtmeliyiz. Örneğin bir alt yazı dosyası ekleyeceğimiz zaman kind parametresine subtitles yazmamız gerekiyor. srclang parametresinde ise eklediğimiz dosyamızın dili ve label parametresinde de eklediğimiz içeriğin kısaca dilini belirtmek için kullanılan özelliklerdir.
track elementi ile bir örnek yapalım. Örneğimiz aşağıdaki gibi olacaktır.
<!DOCTYPE html> <head> <title> track Örnek </title> <meta charset="utf-8"> </head> <body> <!-- video elementi --> <video width="500" height="375" controls="controls"> <!-- icerik ekleyelim --> <source src="3 Idiots.mp4" type="video/mp4" /> <!-- track elementi ile ekledigimiz icerige alt yazi ekleyelim --> <track src="subtitles_en.vtt" kind="subtitles" srclang="tr" label="Turkish"> </video> </body> </html>
Yukarıdaki örneğimizde video elementini kullandık. Bunun yerine audio elementini de kullanabilirdik.
HTML track etiketi konusunu bu yazımızda gördük. Konu ile ilgili soru, görüş ya da fikirlerinizi aşağıda bulunan yorumlar kısmı ile bizlere ulaştırabilirsiniz. Aşağıdaki linke tıklayarak HTML ile ilgili diğer yazılarımıza da ulaşabilirsiniz. Ayrıca Instagram ve Twitter linklerine de tıklayarak bizi Instagram ve Twitter üzerinden takip ederek destek olabilirsiniz.
https://yazilimdelisi.com/category/web-gelistirme/html/
Sosyal Medya Hesaplarımız
