HTML5 Video Oynatıcı
Yayınlanan: 2019-09-05Html5 oynatıcı özelliği, video öğesi veya içeriğinde belirtilen videoların oynatılmasına izin verecek şekilde tasarlanmıştır. HTML5 videosu, önceki fiili ve tescilli Adobe Flash eklentisini kullanmak yerine, onu web üzerinde yeni, modern veya standart bir şekilde biçimlendirmek için yaratıcılarından ilham almıştır, ancak, video kodlama formatlarının ve ses kodlama yapılandırmaları internet tarayıcılarında desteklenmelidir.
Html video öğesiyle ilgili bir örnek:
<video width="320" height="240" controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> </video>
<video src="movie. webm" poster="movie.jpg" controls> This is fallback content to display for user agents that do not support the video tag. </video>
Nasıl çalışır?
Kontroller özelliği, oynatma, duraklatma ve ses seviyesi gibi video kontrolleri ekler
Genişlik ve yükseklik özelliklerini dahil etmek her zaman birinci sınıf bir plandır. Yükseklik ve genişlik doğru değilse, videonun yüklenmesi sırasında sayfa sallanabilir.
<source> öğesi, tarayıcının seçebileceği alternatif video dosyalarını belirlemenize olanak tanır. Tarayıcı tercih ettiği formatı kullanacaktır.
<video> ve </video> etiketleri arasındaki içerik, <video> öğesini desteklemeyen programlarda görüntülenebilir.
HTML <video> Otomatik oynatma örneği:
<video width="320" height="240" autoplay> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> Your browser does not support the video tag. </video>
HTML Video - Biçimler, Özellikler ve Olaylar:
Html5, <video> öğesi için DOM biçimlerinin, özelliklerinin ve olaylarının işlevini veya özelliklerini netleştirir. Bu, uzunluk ve ses seviyesini ayarlamanın yanı sıra videoları yüklememize, oynatmamıza ve duraklatmamıza olanak tanır.
HTML Video-Tarayıcı Desteği:
HTML5'te desteklenen 3 video formatı vardır: MP4, WebM ve Ogg.
Farklı biçimler için tarayıcı desteği:
Tarayıcı | MP4 | WebM | Ogg |
---|---|---|---|
Internet Explorer | EVET | NUMARA | NUMARA |
Krom | EVET | EVET | EVET |
Firefox | EVET | EVET | EVET |
Safari | EVET | NUMARA | NUMARA |
Opera | EVET | EVET | EVET |
HTML5 Video Etiketleri veya Etiketleri:
Etiket | Tanım |
---|---|
<video> | Bir videoyu veya filmi açıklar |
<source> | Medya bileşenleri için çeşitli medya varlıklarını açıklar |
<track> | Medya oynatıcılardaki içerik parçalarını açıklar |
HTML Yardımcıları (Eklentiler)
HTML uygulamaları (modüller), bir internet tarayıcısının standart kullanımını genişleten PC programlarıdır.
Yaygın olarak modül olarak algılanan uygulamalardan bazıları aslında Java uygulamalarıdır.
Modüller veya eklentiler birkaç istisnai nedenden dolayı çalıştırılabilir: haritalar sergilemek, virüsleri incelemek, banka kimliğinizi kontrol etmek vb.
Video ve sesi göstermek için: <video> ve <audio> etiketlerini kullanın.
Desteklenen Video ve Ses Formatları:
HTML5 tanımı, tarayıcıların hangi ses ve video formatlarını veya yöntemlerini desteklemesi gerektiğini şart koşmaz. İstemci sahipleri, istemedikleri herhangi bir video biçimini desteklemek zorunda değildir, ancak içerik yazarları, herhangi bir videonun tüm istemci sahipleri tarafından elde edilebileceğini hesaba katamazlar, bu nedenle şu anda tüm istemci aracılarının bir simge kümesine sahip olduğu konusunda bir anlaşma yoktur. sağlamak için video ve ses formatları.
HTML5 Çalışan Sınıfı, tüm müşteri sahiplerinin (tarayıcıların) üstleneceği en az bir video formatının alıntılanmasının uygun olacağını düşündü. İlgili temel biçim veya yöntem şöyle olacaktır:
- Bir kodlama işlemine, yüksek görüntü kalibresine ve düşük kod çözme programcısı kullanımına sahip olmalıdır.
- Telif hakkı ücretsiz olun.
- Yazılım kod çözücülerine ek olarak, birçok gömülü işlemci video kodunu çözme özelliğine sahip olmadığından, yöntem için bir donanım video kod çözücüsü bulunmalıdır.
Kullanım ve Faydaları:
HTML5 video için tarayıcı desteği dünya çapında hızla büyüyor, Flash video aranabilir değil ve tüm istemcilerin hızlı veya yükseltilmiş bir tarayıcısı yok, HTML5 video Flash'a kıyasla çok daha modern. Programı elektronik cihazlarda ve modern tarayıcıda düzgün bir şekilde yürütür ve entegre etmek ve biçimlendirmek için zahmetsizdir. Eski tarayıcılarda yapılan küçük geliştirmelerle HTML5'i de destekler.
Videonuz için HTML5 kullanmak ve mobil cihazlarda oynatılabilmesini istemek hiç de akıllıca değil. Flash, her cep telefonu tarafından iyi desteklenmez. Bir ton video kullanan bir web sayfanız varsa, bu bilmeniz gereken bir şeydir, böyle bir durumda HTML5 kullanmaya başlamazsanız, bireyler web sayfanızı terk edebilir veya sitenizden kendi hücreleriyle işlevsel olmadığı için ayrılmaya başlayabilir. telefon.
HTML5, daha az kod kullanılarak bir siteye entegre edilebilir. Üzerinde özelleştirilebilir çok sayıda özellik ve etiketle doğrudan tarayıcıya video yerleştirme sağlar ve bu, video ve oynatıcı üzerinde daha fazla kontrol sunar. Bir döngü, otomatik oynatma, poster, kontroller ve paradoksal olarak önyükleme yapabilirsiniz ve HTML5 videonun yerleşik olarak sahip olduğu özel kontrolleri bir araya getirmek yerine, eskisi gibi özel bir oynatıcı oluşturmaya gerek yoktur, böylece video eklemek eskisinden daha hızlıdır. Eski flash sürümünü yeni HTML5 video gömme ile ayırt edersek, bu daha az koddur ve sitenize eklemeyi daha uygun hale getirir.
Aşağıdakiler, modernleştirilmiş işlevsellik sunan HTML5 etiketleri veya nitelikleridir.
HTML5 Video Özellikleri
Bağlanmak | Açıklama |
---|---|
Döngü | videonun sürekli oynatılmasını sağlar |
Otomatik oynatma | sayfa açıldığında video aynı anda oynatılacaktır |
Afiş | bir video yüklenirken gösterilecek resmi yapılandırır |
Kontroller | standart oynatma, duraklatma, ses kontrolleri |
ön yükleme | videonun oynatılıp oynatılmadığına bakılmaksızın videoyu indirmek için kullanılabilir |
HTML5 video, video etiketini veya etiketini biçimlendirmek için CSS ve CSS3'ü destekleyebilir. Kenarlığı, opaklığı, yansımaları, degradeleri, geçişleri, dönüşümleri ve hatta animasyonları değiştirebilirsiniz.
Dezavantajları:
HTML5 ile ilgili bir başka gerçek de, lisanslama veya yeterlilik sorunları nedeniyle, medyanın çoğu tarayıcıyla erişilebilir olması için çok sayıda formatta sağlanması gerektiğidir. Bu nedenle, WebKit tarayıcıları (safari, chrome) için mp3 ses ve tarayıcılar için Mozilla için Ogg (firefox) kullanılmalıdır.
Diğer bir komplikasyon ise, spesifikasyonun bazı bölümlerinin çok kararlı olmasına rağmen, dilin kendisinin devam eden bir çalışma olarak görülmesi, özellikle de herhangi bir öğenin herhangi bir zamanda değişebilmesidir. Dilin oldukça uzun bir süre stabilize olması planlanmadı, bu da işleri daha da engelliyor. Neyse ki, spesifikasyonun büyük bir kısmı kararlı ve kullanıma hazır olarak görülüyor.