HTML ile Video, Ses ve Diğer Media Ortam Kullanımları

Merhaba sevgili Webkolog takipçileri,

Bugün sizlere web sayfalarımıza sadece metin ve resimden ibaret olmayan, çok daha zengin içerikler eklememizi sağlayan HTML 4.01 etiketlerinden bahsedeceğim: video, ses ve diğer harici ortam dosyalarını sayfalarımıza nasıl dahil edeceğiz? İnternetin sadece okumaktan ibaret olmadığını, izlemek ve dinlemek için de harika bir platform olduğunu hepimiz biliyoruz. İşte tam da bu noktada, <embed> ve <object> etiketleri devreye giriyor!

Şunu unutmayalım ki 2006 yılında henüz HTML5'in sunduğu kolaylıklar hayatımızda değil. Bu yüzden, şimdilik harici ortam dosyalarını sayfalarımıza eklemek için bu etiketlere ihtiyacımız var.

<embed> Etiketi: Hızlı ve Pratik Çözüm

<embed> etiketi, web sayfalarına medya dosyalarını, Flash animasyonlarını veya Java applet'lerini eklemek için kullanılan yaygın bir yöntemdir. Basit ve doğrudan bir kullanıma sahiptir.

<embed src="filmim.avi" width="320" height="240" autostart="false" loop="false"></embed>

• src: Gömülecek dosyanın yolunu veya URL'sini belirtir. Bu bir video (.avi, .mpeg, .mp4), ses (.mp3), Flash (.swf) veya başka bir medya dosyası olabilir.
• width ve height: Gömülü medyanın genişliğini ve yüksekliğini piksel cinsinden belirler.
• autostart: Medyanın sayfa yüklendiğinde otomatik olarak başlayıp başlamayacağını kontrol eder. "true" veya "false" değerlerini alabilir.
• loop: Medyanın bittikten sonra tekrar oynatılıp oynatılmayacağını kontrol eder. "true" veya "false" değerlerini alabilir.

Örneğin, bir MP4 video dosyasını sayfanıza eklemek için:

<embed src="videom.mp4" width="400" height="300" autostart="false" loop="false"></embed>

Bir MP3 ses dosyasını eklemek için:

<embed src="muziksarki.mp3" width="200" height="50" autostart="true" loop="true"></embed>

Bir Flash animasyonunu eklemek için:

<embed src="animasyon.swf" width="550" height="400"></embed>

<object> Etiketi: Daha Güçlü ve Esnek Seçenek

<object> etiketi, <embed>'den daha genel ve daha güçlü bir etikettir. Sadece medya dosyalarını değil, aynı zamanda Java applet'leri, PDF belgeleri gibi çeşitli harici nesneleri de sayfanıza gömmek için kullanılır. Tarayıcı uyumluluğu konusunda bazen daha iyi sonuçlar verebilir.

<object data="filmim.avi" width="320" height="240" type="video/x-msvideo">
  <param name="autostart" value="false">
  <param name="loop" value="false">
  <!-- Tarayıcı <object> etiketini desteklemezse gösterilecek metin -->
  Tarayıcınız video oynatmayı desteklemiyor.
</object>

• data: Gömülecek nesnenin yolunu veya URL'sini belirtir.
• width ve height: Gömülü nesnenin genişliğini ve yüksekliğini piksel cinsinden belirler.
• type: Gömülü nesnenin MIME türünü belirtir (örn. "video/x-msvideo" for AVI, "audio/mpeg" for MP3, "application/x-shockwave-flash" for SWF). Bu, tarayıcının doğru eklentiyi kullanmasına yardımcı olur.
• <param>: Bu etiket, gömülü nesneye özel parametreler geçirmek için kullanılır. name ve value özellikleri vardır. Örneğin, video oynatıcı için "autostart" veya "loop" gibi ayarları bu şekilde belirtebilirsiniz.
• <object> etiketinin içinde yer alan metin: Eğer tarayıcı <object> etiketini veya belirtilen medya türünü desteklemiyorsa, bu metin kullanıcılara gösterilir. Bu, erişilebilirlik açısından önemlidir.

Bir Java applet dosyasını sayfanıza eklemek için:

<object classid="java:MyApplet.class" width="300" height="200">
  <param name="param1" value="deger1">
  Tarayıcınız Java applet'lerini desteklemiyor.
</object>

Bu örnekte, classid özelliği Java applet'inin sınıf adını belirtir. Yine, <param> etiketleri ile applet'e özel parametreler gönderilebilir.

Hangisini Kullanmalıyız?

Günümüzde (yani 2006'da) <embed> etiketi genellikle daha basit olduğu için hızlı çözümlerde tercih edilebilirken, <object> etiketi daha esnek ve güçlüdür, özellikle farklı tarayıcılar ve eklentilerle daha iyi uyumluluk sağlamak istediğimizde faydalıdır. Tarayıcıların varsayılan video oynatma yetenekleri henüz sınırlı olduğu için, genellikle kullanıcıların sistemlerinde ilgili kodeklerin veya oynatıcıların yüklü olması gerektiğini unutmamalıyız.

Umarım bu makale, web sayfalarınıza ses, video ve diğer ortam dosyalarını ekleme konusunda sizlere yol göstermiştir. İçeriklerinizi zenginleştirerek ziyaretçilerinize daha keyifli bir deneyim sunmanız dileğiyle!

Webkolog'u takipte kalın!

Hepinize bol kodlu ve başarılı projeler dilerim!