Videoların otomatik oynatılması Chrome 53 ve sonraki sürümlerinde Android için desteklenir. Hem autoplay hem de muted ayarlanmışsa bir video öğesi görünür hale geldiğinde oynatma otomatik olarak başlar ve sesi kapalı videoların oynatılması play() ile programatik olarak başlatılabilir. Daha önce, sessiz durumuna bakılmaksızın mobil cihazlarda oynatmanın bir kullanıcı hareketiyle başlatılması gerekiyordu.
<video playsinline autoplay muted>
<source src="video.webm" type="video/webm" />
<source src="video.mp4" type="video/mp4" />
</video>
Bu örneği ziyaret ederek bu özelliği kullanırken nasıl bir deneyim yaşayacağınızı görebilirsiniz. muted videosunun oynatılması, Chrome 53 veya sonraki sürümlerde otomatik olarak başlar.
Ayrıca, sessiz oynatma artık play() yöntemi kullanılarak da başlatılabilir. Daha önce play() yalnızca düğme tıklama gibi bir kullanıcı hareketinden geliyorsa oynatmayı başlatıyordu. Android'de aşağıdaki iki demoyu karşılaştırın. Önce Chrome 53'te, ardından daha eski bir sürümde deneyin:
Mümkün olan her durumda autoplay özelliğini, yalnızca gerekirse play() yöntemini kullanmanızı öneririz.
Bir videonun sesini, click gibi bir kullanıcı hareketiyle programatik olarak açmak mümkündür. Ancak bir videonun sesini kullanıcı hareketi olmadan programatik olarak açmaya çalışırsanız oynatma duraklatılır.
muted autoplay değişikliği, play() öğesinin DOM'da oluşturulmamış bir video öğesiyle (ör. WebGL oynatmayı etkinleştirmek için) kullanılmasını da mümkün kılacak.
play() yöntemi, bir söz de döndürür. Bu söz, sessize alınmış programatik oynatmanın etkin olup olmadığını kontrol etmek için kullanılabilir. Bu konuda bir örneği simpl.info/video/scripted adresinde bulabilirsiniz.
Bu değişiklik neden yapıldı?
Otomatik oynatma, Android'deki Chrome'un önceki sürümlerinde devre dışı bırakılmıştı. Bunun nedeni, otomatik oynatmanın rahatsız edici olması, çok fazla veri tüketmesi ve birçok kullanıcının bu özelliği beğenmemesiydi.
Otomatik oynatmayı devre dışı bırakmak, geliştiricileri animasyonlu GIF'ler, <canvas> ve <img> gibi alternatiflere yönlendirmek gibi istenmeyen bir etkiye neden oldu. Bu teknikler, güç tüketimi, performans, bant genişliği gereksinimleri, veri maliyeti ve bellek kullanımı açısından optimize edilmiş videodan çok daha kötüdür. Video, animasyonlu GIF'lerden çok daha iyi sıkıştırma oranıyla (ortalama 10 kat, en iyi durumda 100 kata kadar) daha yüksek kalite sunabilir. JavaScript'te video kod çözme mümkündür ancak bu işlem, pil gücünü çok fazla tüketir.
Aşağıdakileri karşılaştırın. İlk örnek video, ikinci örnek ise animasyonlu GIF'tir:
İkisi de oldukça benzer görünüyor ancak video 200 KB'tan küçük, animasyonlu GIF ise 900 KB'tan büyük.
Chrome ve diğer tarayıcı satıcıları, kullanıcı bant genişliği konusunda son derece dikkatlidir. Birçok bağlamda birçok kullanıcı için yüksek veri maliyeti, erişimin önünde zayıf bağlantıdan daha büyük bir engeldir. Geçici çözümlerin yaygınlığı göz önüne alındığında, otomatik oynatma özelliğinin sesi kapatılarak engellenmesi mümkün değildir. Bu nedenle, platformun yapabileceği en iyi şey iyi API'ler ve varsayılanlar sunmaktır.
Web, giderek daha fazla medya merkezli hale geliyor. Tasarımcılar ve geliştiriciler, videoyu kullanmanın yeni ve beklenmedik yollarını bulmaya devam ediyor. Örneğin, arka plan videosunu tasarım öğesi olarak kullanırken platformlar arasında tutarlı bir davranış istiyorlar. Sessize alınmış otomatik oynatma, hem mobil hem de masaüstü cihazlarda bu tür işlevlerin kullanılmasını sağlar.
İnce noktalar
- Otomatik oynatma, erişilebilirlik açısından özellikle sorunlu olabilir. Android'de Chrome 53 ve sonraki sürümlerde otomatik oynatmayı tamamen devre dışı bırakma ayarı bulunur: Medya ayarlarından Otomatik oynat'ı seçin.
- Bu değişiklik
audioöğesini etkilemez: Android'de Chrome'da otomatik oynatma, ses için sessiz otomatik oynatma pek mantıklı olmadığından devre dışı kalmaya devam eder. - Veri Tasarrufu modu etkinse otomatik oynatma özelliği kullanılamaz. Veri Tasarrufu modu etkinse medya ayarlarında otomatik oynatma devre dışı bırakılır.
- Sessiz otomatik oynatma, görünür herhangi bir dokümanda, iFrame'de veya başka bir yerde görünür olan tüm video öğelerinde çalışır.
- Yeni davranıştan yararlanmak için
mutedveautoplayeklemeniz gerektiğini unutmayın: simpl.info/video ile simpl.info/video/muted adreslerini karşılaştırın.
Destek
- Sessize alınmış otomatik oynatma, iOS 10 ve sonraki sürümlerde Safari tarafından desteklenir.
- Otomatik oynatma özelliği, sessiz olsun veya olmasın, Android'de Firefox ve UC Browser tarafından zaten destekleniyor. Bu tarayıcılar, otomatik oynatmanın hiçbir türünü engellemiyor.