HTML5 Ses Dosyası Nasıl Eklenir ?

HTML5 ile oluşturacağımız internet sitelerinde bazen bazı durumlarda bazı içeriklere ses dosyaları ekleyebilmemiz gerekebilir. Böyle durumlarda ise HTML5 ses dosyası ekleme işlemini en doğru şekilde yapabilmek kullanıcılara daha kolay bir deneyim yaşattıracaktır.

Bazen bazı içeriklere HTML ses dosyası ekleme işlemini gerçekleştirmemiz gerekecektir. Böyle durumlarda ister ses kaydı olsun istersek bir müzik dosyası olsun bunu kolay ve güzel bir şekilde sağlayabilmemiz gerekecektir. Ses dosyası eklemeden öncesinde ise temel olarak bilmemiz gereken şey ise hangi ses dosyalarının hangi tarayıcılarda çalışacağıdır.

HTML5 Ses Dosyası Ekleme

Yukarıda da bahsettiğimiz gibi eğer bir ses dosyası ekleyecek isek bilmemiz gereken tek şey hangi ses dosyalarının hangi tarayıcılarda çalıştığını ve ekleyeceğimiz dosyayı nasıl ekleyecek olduğumuzdur. Temel olarak bildiğimiz şey ise bizim internet sitemize ekleyeceğimiz ses dosyalarının bazı kişilerde çalışıp bazı kişilerde çalışmadığını görmek hiç hoş olmaz ve boş yere bizlere kullanıcı kaybettirecektir.

Yukarıda ki tabloya bir göz attığımız zaman mp3 uzantılı ses dosyası günümüzde ki tüm tarayıcılarda çalışmaktadır. Bu yüzden eğer sizlerde giren kullanıcıların hangi tarayıcı olursa olsun bir şeyleri dinleyebilmesini istiyor iseniz tercih etmemiz gereken dosya uzantısının mp3 olduğunun farkındasınızdır.

Artık ses dosya uzantılarının hangi tarayıcılar ile uyumlu olup olmadığına göz gezdirdikten sonrasında ise sıra geldi bunları nasıl ekleyecek olduğumuza. Bunun için ise aşağıda yer alan tabloya bir göz gezdirmemiz gerekmektedir.

Şimdi ekleyecek olduğumuz ses dosyasını tarayıcıya türünü tanıtabilmek için ise hangi tipi kullanacağımıza dosyanın uzantısına göre karar vermekteyiz. Bir HTML ile oluşturduğumuz internet sitesine ses dosyası eklemek için :

<audio controls>
<source src="su-sesi.mp3" type="audio/mpeg">
</audio>

Kodlarını kullanmalıyız. Bu sayede bir önce ki dersimizden de hatırlayacağınız şekilde HTML5 video ekleme işlemini gerçekleştirirken de video etiketini kullanmıştık. Bu sefer ise audio etiketini kullanarak ve bu ses dosyasında bazı ses açma, durdurma, başlatma gibi özellikleri kullanabilmek adına controls komutunu kullanıyoruz.

Aşağıda ise kaynak yolunu belirtip tarayıcıların daha iyi anlayabilmesi adına tipini de belirttikten sonrasında ise bu etiketi kapatıp artık bizim oluşturmuş olduğumuz internet sitesinde çalışmasını sağlayabiliriz.