Alternatif kaynaklar
<source> ve type özniteliğiyle farklı medya biçimleri sağlarsın.
source öğesi
Farklı tarayıcılar farklı medya biçimlerini destekler. Tek bir src yazarsan bazı kullanıcılar videoyu açamaz. Çözüm: <source> öğesiyle birden çok kaynak sunmaktır.
audio ya da video içine art arda source öğeleri koyulur. Tarayıcı listeden ilk desteklediği kaynağı seçer, gerisini atlar. Bu yüzden daha verimli biçimi (genelde webm) başta, daha uyumlu yedeği (mp4) sonra yazmak iyi bir alışkanlıktır.
type özniteliği
Her <source> öğesine type özniteliği yazmak tarayıcıya yardım eder. type, dosyanın biçimini MIME tipiyle söyler: type="video/mp4" ya da type="audio/ogg" gibi.
type olmadan tarayıcı dosyayı indirip bakarak anlamaya çalışır; type yazarsan gereksiz indirmeyi atlar ve daha hızlı karar verir. Bu yüzden her source'a type eklemek iyi bir uygulamadır.
Uygulama Çok kaynaklı video ekle
Body içindeki <video> zaten controls ile duruyor. İçine en az iki <source> öğesi koy; her birine src ve type yaz.
Örnek çözümü göster
<body>
<video controls>
<source src="https://example.com/film/fragman.mp4" type="video/mp4">
<source src="https://example.com/film/fragman.webm" type="video/webm">
</video>
</body>Kendini test et
-
Birden çok source öğesi neden kullanılır?
- Videoyu daha hızlı yüklemek için
- Farklı tarayıcıların desteklediği biçimleri karşılamak için
- Altyazı eklemek için
- Videoyu otomatik oynatmak için
Cevabı göster
Farklı tarayıcıların desteklediği biçimleri karşılamak için — Doğru. source ile birden çok biçim sunulur; tarayıcı desteklediğini seçer.
-
source öğesine type değerini yaz
<source src="https://example.com/film/fragman.mp4" type="____">Cevabı göster
<source src="https://example.com/film/fragman.mp4" type="video/mp4"> -
Biçim ve MIME eşleştir
- video/mp4
- MP4 video
- video/webm
- WebM video
- audio/mpeg
- MP3 ses
- audio/ogg
- Ogg ses