Makalede, ses ve video kabının yapısı HTML5, video, ses, kaynak, parça etiketleri ve bunların özniteliklerini olası değerlerle açıklanmaktadır. HTML şablonları ve tarayıcıya yerleştirilmiş yerleşik özelliklere dayanan multimedya dosyalarının oynatılmasını uygulama örnekleri. Altyazıların metin yolunun bir videosunu, başlıkları, içerik tablosu WebVTT formatı dosyalarını örneklerle birlikte. Mikro-Boyutlu Schema.org ile HTML5 kod şablonları Ses ve video için sunulur. Video ve video dosyalarının bu formatlara dönüştürme için MIME tipleri ve araçları ile web formatları için temel, belirtilir.
İÇİNDE Html5. Üçüncü taraf programları kullanmadan ses ve video dosyalarını doğrudan tarayıcıya oynatmanıza izin veren yeni özellikler vardır. Şimdiye kadar, gerçeğine rağmen Html5. Artık haber yok, tarayıcıların etiketleri nasıl yönettiği konusunda anlaşmazlık var. video. ve ses. Ve oyuncunun kendisi nasıl görüntüler. Bazıları her yeni sürümle daha iyi, diğerleri hala geride kalıyor. Küresel olarak, eğilimi, tarayıcıların multimedya dosyalarını çalmak için daha fazla ve daha işlev sağlayabilmelerini sağlamaktır.
Ekran: Şablonları kullanma örneği
Video indir
Skrinkast: Maddeden şablonları kullanma örnekleri - Site
Html5. Video ve ses geliştirme standardı ve herhangi bir ses veya video formatıyla ilişkili değildir, bu nedenle tarayıcılar arasında desteklenen farklılıklar vardır. biçim Ses ve video dosyaları. Bu fark şimdi, orijinal dosyayı birkaç farklı kodekle kodladığınız ve tüm bu dosyaların tüm bu sürümlerini etiketlere bağladığınız gerçeğiyle telafi edilir. veya Yuvalanmış etiketler aracılığıyla <
kaynaksrc \u003d "URL "\u003e. Bununla birlikte, tarayıcılar tarafından desteklenen ses ve video dosyaları arasında, liderler planlanır. Video için, tabii ki format mp4 (H.264.) ve bu formatı ses için mp3 ve m4A.. Şimdi, muhtemelen tüm tarayıcılar bu formatların dosyalarını oynatabilir. Ayrıca tarayıcılar Firefox., Krom. ve Opera. WebM Standard'ı genel bir video formatı olarak desteklemeyi kabul etti. Benim bakış açımdan, şimdilik kullanımı için optimum Html5. Video ve ses, bir multimedya dosyasını formatta kullanmaya dayalı bir şema olacaktır. mp4(H.264.) video için ve m4A. Ses için I. Js.Html5. Oyuncu. Belirtilen formattaki yalnızca bir dosya ses veya video kabına bağlanır. Şimdi çoğu tarayıcı MP4 formatını çalabiliyor. Bağlı JS kütüphanesi, tarayıcıya yerleştirilen oynatıcıyı stilize eder. Tarayıcı formatı desteklemiyorsa mp4/m4A.T. Js. Oyuncu, bu durumda, Multimedya dosyasını çalmak için Flash Player'ın bağlantısını uygular. MP4 formatının çok popüler hale geldiğini göz önüne alarak, tarayıcılardaki üremesiyle ilgili düşük bir sorun olasılığını umabilirsiniz. Böyle bir şema, dosyaları işleme için disk alanı ve kaynakları kaydeden belirtilen biçimde yalnızca bir multimedya dosyası gerektirir. Ayrıca, böyle bir şema stratejik olarak doğru olacaktır, çünkü trend tarayıcıların giderek daha fazla uygulamayı yerine getirmediğine tabidir. Html5. Video ve ses.
HTML5'i belirtmek için, dosyanın çalışkanına, dosyanın dosyasına ek olarak, transfer ve MIME. Dosya türü, hangi tarayıcı hangi kodekin kullanılması gerektiğini anlama. Tabloda, en yaygın dosya biçimlerini ve bunları netleştirin MIME. Türleri.
Dosya formatları ve MIME türleri
Multimedya dosyaları
Uzantılar
MIME Tipi
Ses mp3
mp3
ses / MPEG.
Ses mp4
m4A.
ses / MP4.
Ses Webm.
webm.
ses / Webm.
Ses ogg.
ogg
ses / OGG.
Video MP4 (H.264)
mp4
video / MP4.
Video Webm.
webm.
video / Webm.
Video Ogg.
oGV.
video / Ogg.
Ses ve video dosyası kodlama araçları
Video ve ses dosyalarını yukarıdaki Web formatlarına kodlamak için, ses ve video dosyalarının dönüştürülmesini destekleyen Açık Programı, Web için ortak ana formatlara dönüştürür. Mp4., Webm., Ogg theora., Mp3 vb.). Miro Video Converter. Farklı işletim sistemleri için kullanılabilir - pencereler, MAC. ve Linux. Ve konsol yardımcı programları için grafik bir kabuktur ve bu, indirilen videoyu ve sesi otomatik modda işlemek için bir Web sunucusunda kullanımı uygun.
HTML5 Kod Örnek Mikro Boyutlu Schema.org ile Ses:
Ses başlığı
Bu, yukarıda açıklanan ses şablonunun kodundan çıkarılan mikro boyutlu verilere benzeyecektir.
AudioObject Itemtype \u003d http://schema.org/audioObject Name \u003d Audio Header Açıklama \u003d Ses Açıklama ... iSFamilyFriendly \u003d True EncodingFormat \u003d MP3 Süresi \u003d PT04M59S Uploaddate \u003d 2015-12-31 Image \u003d Image.jpg AlternateName \u003d Alternative Başlık Audio Contenturl HREF \u003d File.mp3 Text \u003d URL.mp3 Text \u003d Ses Yazar Kişiyi İndir
Minimum işaretleme sesi schema.org. İçermelidir İtemprop.\u003d "İsim", İtemprop.\u003d "Açıklama", İtemprop.\u003d "Contenturl". Kalan özellikler zorunlu değildir.
Standart Kullanım Örneği HTML5 etiketini kullanın
Gösterinde etikete başvurdum öznitelikten sınıfCSS. Ekranın boyutuna bağlı olarak video dinamik alanın genişliğini yapan stiller. Kendisini ayarlamak için oyuncunun yüksekliğinde. Nasıl çalıştığını görmek için tarayıcı penceresi boyutunu değiştirmeyi deneyin. Bu nedenle, bu gösterinin kodunun kaynağında özellik yoktur. genişlik. ve yükseklik Etiket için Değiştirilirler CSS. stilleri. Ancak şablonun kodunun listesinde, bu gösterilmeyecek, çünkü Zaten özel.
HTML5 Mikro Boyutlu Schema.org ile Örnek Kod Videosu:
Video başlığı
YouTube'da izleyin
Bu, yukarıda açıklanan video şablonun kodundan çıkarılan mikro boyutlu verilere benzeyecektir.
Videobject itemtype \u003d http://schema.org/videoObject ad \u003d video başlığı thumbnail ImageObject itemtype \u003d http://schema.org/imageObject Contenturl \u003d Video-thombnail.jpg için URL | PNG genişliği \u003d 100 yükseklik \u003d 100 süresi \u003d pt14m59s isfamilyfriendly \u003d Gerçek uploaddate \u003d 2015-12-31 Açıklama \u003d Video için Kısa Açıklama ... URL HREF \u003d FILE.MP4 için URL \u003d Video Başlığı Yazar kişi Itemtype \u003d http://schema.org/person URL HREF \u003d URL Yazar Web Sayfa Metin \u003d Yazar Adı Adı \u003d Yazar adı Image \u003d Author.jpg thumbnailurl \u003d File.jpg için URL.JPG | PNG
Minimum gereksiz Arama motorları için video işaretleme schema.org. Tüm özellikleri kodda içermelidir İtemprop. Blok hariç İtemprop.\u003d "Yazar", arama motorları için zorunlu olmayan ve doldurulacak veri yoksa silinebilir. İçin video-thumbnail Yandex, için bir mikrodalga olduğunu belirtin schema.org. gibi İtemprop.\u003d "thumbnail" şeklinde ImageObject., fakat Google belirtilmesini gerektirir İtemprop.\u003d "thumbnailurl", bu yüzden eklemelisin video-thumbnail iki kez ve dolayısıyla ikinci etiket dosyası img stil var görüntü yokTarayıcıda ne görüntülenmez. Kullanım yerine olabilir img Tag S. görüntü yok Bu emlak etiketini iletmek link. öznitelikten hREF.. Ayrıca, mikro boyutun kullanıcı tarafından gösterilmeyen meta etiketlerden iletilebilmesi gerçeğine rağmen link.Kullanıcıya bir mikrodalga eklemek için çoğunlukla etiketlerde bir mikrodalga eklenmesi önerilir. Dağ doğrulaması schema.org. Bu bağlantılarda yapabilirsiniz:, Mikrografi kullanmanın temel avantajı, arama robotları ve sosyal ağ robotları için bu tür içeriğin rahatlığındadır. Bu robotlar işaretli verileri yeniden kazandırır ve bunları toplayın. Bu nedenle, mikro boyutlu kullanımı iyileştirir Seo. Site ve sosyal ağlardaki verilerin otomatik dağılımını teşvik eder. Mikrodalga Schema.org'un programın işaretli olduğu video için ayrıntılı açıklaması VideoObjec.sitede t. Ayrıca, sitenize bir ekleme yaptığınızda, video doğrudan değil, video barındırma widget'larını kullanmak olduğunu belirtmeye değer. Yandex.Videos veya Youtube.HTML kod bloğunuzu, videonun bir açıklaması ile widget'ın blok kodu altında ekleyebilir ve bir mikrofon Schema.org. Bu video için. Aynı zamanda, bir URL parametresi olarak - bir videoya bağlar, statik bir dosyaya doğrudan bir bağlantı belirleyin ve video barındırma işleminden alınan bağlantıyı ayarlayın. Schema.org spesifikasyonunda olmasına rağmen, bağlantının doğrudan bir dosyada olması gerektiği, ancak arama motorları ve video hosting'den videoya bağlar. webmaster bölümündeki Yandex web sitesinde örnekleri görün), bu bağlantıda dosyayı indiremeyiz ve doğrudan video barındırma widget'ında, doğrudan HTML5 Media Player'ınıza görüntüleyemezsiniz.
Multimedya ses ve video dosyalarını yüklemek için hangi barındırmanın bir sorunuz varsa, medya dosyalarını Yandex diskinden web sayfasına ekleme seçeneğinin açıklandığı makaleye bakın.
Öznitellikler ve Etiket:
Öznitellikler src, Önyükleme., otomatik oynatma, mediaGroup, döngü., mUED., kontroller. Etiketler için de dahil olmak üzere tüm medya elemanları için ortak özelliklerdir. ve .
Diablo III başlamıyor mu?
Bilgisayarı casus yazılımlara nasıl kontrol edilir
Bilgisayardaki casus yazılım