HTML 5 - Videoeinbindung Grundlagen der Programmierung Sebastian Ottowitz
HTML 5 Nachfolger von HTML 4 Ähnlicher Aufbau Neue Möglichkeit der Dateieinbindung Vorteil: Keine Plugins wie Flash nötig, bessere Unterstützung von Audio, Video und Grafiken
Einbindung Videotag: <video> </video> Angabe der Quelle: <video src= " testvideo.mp4" > Your browser does not support the video tag. </video> Einbindung der beiden Formatalternativen: <video> <source src="testvideo.mp4" type="video/mp4" /> <source src="testvideo.ogg" type="video/ogg" /> Your browser does not support the video tag. </video>
Attribute width = Breite (in px) height = Höhe (in px) Wie z.B bei image-Tag können dem Video-Tag diverse Attribute übergeben werden: width = Breite (in px) height = Höhe (in px) poster = URL eines Titelbildes, das vor Abspielen angezeigt wird autoplay = Wiedergabe wird automatisch gestartet autobuffer = Video wird sofort bei Seitenaufruf geladen muted = Das Video wird stumm abgespielt controls = Normale Bedienelemente werden angezeigt
Codecs Theora: h.264: Freier Videocodec Verlustebehaftete Videodatenkompression Container .ogg h.264: Hohe Qualität bei Kompression Container .mp4
Browserkompatibilität Firefox: Theora in Ogg-Container (Ton: Vorbis) Safari: h.264 in mp4-Container (Ton: AAC) auch für I-Phone einsetzbar Google Chrome: Theora und h.264 Internet Explorer: h.264