HTML5'te çokluortam (multimedia) dosyalarını, Silverlight ya da Flash gibi eklentilere ihtiyaç duymadan web sayfanıza gömebilirsiniz.
<audio> etiketi
<audio> etiketi, ses içeriğini tanımlamak için kullanılır.
<video> etiketi
<video> etiketi, video ya da filmleri web sayfasına yerleştirmek için kullanılır.
<source> etiketi
<source> etiketi, çokluortam kaynaklarını tanımlamak için kullanılır.
<embed> etiketi
<embed> etiketi, bir dış uygulama ya da etkileşimli bir içerik (eklenti) taşıyıcıyı tanımlamak amacıyla kullanılır.
Bir videonun web sayfasına gömülmesi (embeding)
Bir videoyu web sayfanıza gömmek için <video> etiketini kullanabilirsiniz. Bu etikete aşağıdaki özellikleri (attribute) atamanız yararlı olur.
- src: Medya kaynağını (source) belirtmek için kullanılır.
- controls: Kullanıcı bunun sayesinde yüklediği çokluortam dosyasını harekete geçirir ya da durdurur.
- width ve height: Videonun genişlik ve yüksekliğidir. Yükleme sırasında çerçevenin değişmemesi için genişlik ve yükseklik özelliklerini önceden atayın.
HTML5 şu anda MP4, WebM ve OGG video dosya biçimlerini destekliyor.
Aşağıda web sayfasına video gömmenin bir örneğini bulabilirsiniz:
<!DOCTYPE html>
<html>
<body>
<video height="200" width="600" controls>
<source src="deneme.mp4" type="video/mp4">
</video>
</body>
</html>
Aşağıdaki tabloda hangi tarayıcıların hangi video formatlarını desteklediğini görebilirsiniz:
TARAYICI | MP4 | WebM | OGG |
Internet Explorer 10+ | EVET | ELLE KURULUM | ELLE KURULUM |
Chrome 46.0+ | EVET | EVET | EVET |
Firefox 40.0+ | EVET | EVET | EVET |
Safari 9+ | EVET | ELLE KURULUM | ELLE KURULUM |
Opera 10.6+ | EVET | EVET | EVET |
Bir ses dosyasının web sayfasına gömülmesi
Videoya benzer şekilde, <audio> etiketiyle de ses ve şarkılar web sayfasına gömülebilir. Desteklenen dosya biçimleri MP3, WAV ve OGG'dur.
<!DOCTYPE html>
<html>
<body>
<div>
<audio controls id="ses1" width="420">
<source src="deneme.mp4" type="audio/wav">
</audio>
</div>
</body>
</html>
Aşağıdaki tabloda hangi tarayıcıların hangi ses dosya biçimlerini desteklediğini görebilirsiniz:
TARAYICI | MP3 | WAV | OGG |
Internet Explorer 10+ | EVET | HAYIR | HAYIR |
Chrome 46.0+ | EVET | EVET | EVET |
Firefox 40.0+ | HAYIR | EVET | EVET |
Safari 9+ | EVET | HAYIR | HAYIR |
Opera 10.6+ | HAYIR | EVET | EVET |