Einbinden von Videos

 

Im Zeitalter von Youtube und Co. sind eine ungezählte Zahl von Videos im Internet zu sehen. Lustige, Gute, und ganz schlechte.

 

Aber wie sieht es mit eigenen Videos aus.

Gewerbetreibende können diese Möglichkeit nutzen Ihr Unternehmen genauer und besser vorzustellen oder Produktionsabläufe näher erklären.

Privat-Personen können diese Möglichkeit nutzen um sich zu bewerben, damit man das Video nicht auf Youtube sehen kann oder sollte.

Wie immer fordern die Götter ein wenig Schweiß um diese Möglichkeit zu nutzen.Mit der Einführung von HTML5 ist allerdings erheblich leichter geworden.

Grundsätzlich genügen die neuen HTML-Tags <video und </video>.Zwischen diese beiden Tags wird dann noch der Name des Videos eingefügt und zwar wie folgt:

Hinweis :

Damit das Video auch responsiv ist, also auch mobilen Endgeräte im richtigen Format zu sehen ist, gehört in den Head-Bereich der HTML-Seite folgender Meta-Tag :

<meta name="viewport" content="width=device-width, initial-scale=1">

<source src="video.m4v" type="video/mp4">
<source src="video.webm" type="video/webm">
<source src="video.ogv" type="video/ogg">

Das bedingt allerdings das das Video auch 3 x auf dem Server sein muß. Verschönern kann den <video tag> mit den folgenden Attributen

Poster

=

schaltet ein Bild zur besseren Darstellung vor das Video

controls

=

schaltet die Steuerelement an

autoplay

=

Startet das Video sofort nach dem aufrufen der Seite

autobuffer

=

Buffert das Video zur schnelleren Wiedergabe

 

Das hier eingebaute Video stammt aus einer Beispieldatei von Adobe

 

Zum besseren Verständnis biete ich eine komplette Beispielseite mit allen Dateien zum Download an