Video wird erst geladen und dann abgespielt
Alexandru
- software
- video
Hallo,
ich habe eine Hintergrund-Video auf der Homepage, dass beim laden der Webseite sofort anfangen sollte zu spielen.
Das video ist so eingebunden:
<video loop autoplay preload="auto">
<source src="/video/V5.mp4" type="video/mp4">
<source src="video/V5.ogg" type="video/ogg"> Ihr Browser unterstützt das Video-Tag nicht.
</video>
In Firefox und Chrome spielt das video sofort ab. In IE und Edge wird das Video erst komplett geladen und dann abgespielt, was nicht gewollt ist.
Woran kann das liegen? Was ich auch beobachtet habe: Das Video wird nicht gecached. Ich drücke F5 und sehe eine hohe Last im Taskmanager im Bereich Ethernet.
Danke und Gruß Alexandru
---response begin---
HTTP/1.1 200 OK
Date: Wed, 01 Aug 2018 16:17:05 GMT
Server: Apache
Last-Modified: Wed, 24 Jan 2018 08:40:36 GMT
ETag: "34ba729-563819dfba900"
Accept-Ranges: bytes
Content-Length: 55289641
Cache-Control: max-age=86400
Expires: Thu, 02 Aug 2018 16:17:05 GMT
Vary: Accept-Encoding,User-Agent
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: video/mp4
53 Megabyte Sofortdownload auf der Startseite. Da werden Leute mit Mobilgeräten (oder der 200 MB/Tag-Flatrate im ICE) "hoch erfreut" sein und sich "sehr herzlich" bedanken. In dem die diese Seite auf jede erreichbare schwarze Liste setzen.
Eigentlich sollte man als jemand, der auf eine solche Seite gelockt wird, den Betreiber auf Zahlung von 2,95 € verklagen.
Mach das weg!
Zu Deinem Startproblem fand ich:
This video will works on all browsers that support MPEG4, except IE9. To add support for IE9, you have to move the file info to the file header, so the browser can start playing it as soon as it starts to download it. THIS IS THE KEY FOR IE9!!!
qt-faststart pre_out.mp4 out.mp4
qt-faststart is a Quicktime utilities that also support H.264/ACC file format. It is part of libav-tools package.
hallo
53 Megabyte Sofortdownload auf der Startseite.
Ach das bisschen Video kann gar nicht ins Gewicht fallen!
Danke für den Tipp bzgl. der Filegröße. Das Video ist nun nur noch 7MB groß. Für die sfortige Wiedergabe brauche ich also ein Tool zum Bearbeiten des Videos. Ich schaue es mir an. Der Beitrag ist allerdings von 2013! Ist das überhaupt noch aktuell?
Moin,
„nur noch 7 MB“ ist gut. In der Werbesprache sind das 56 MBit, mit anderen Worten: Für Festnetzanschlüsse mehrere Sekunden, für Mobilfunkübertragung zum Teil deutlich länger.
Viele Grüße
Robert
Nein, das Video wird ja gestreamt und startet sofort nach dem Laden des HTML/CSS/JS-Inhalts.
Moin Alexandru,
auch wenn das Video gestreamt wird, müssen die Daten beim Nutzer ankommen. Und ich sage mal so: Wenn das Video 5 Sekunden lang ist, und ich muss deutlich länger als 5 Sekunden warten, dann muss ich das Video schon bewusst gewollt haben, bevor ich genervt bin.
BTW: Du kannst auch wie bei Videoplattformen üblich unterschiedliche Qualitäten für die passende Internetverbindung anbieten.
Viele Grüße
Robert
Und genau das Streamen klappt in IE/Edge nicht. Firefox/Chorme packen das schon.
klappt in IE/Edge nicht.
Vielleicht ist ja der IE/Edg hier vorbildlich...
Hej Alexandru,
Danke für den Tipp bzgl. der Filegröße. Das Video ist nun nur noch 7MB groß.
Wenn alle Daten für eine Seite zusammengenommen (CSS, JS, HTML, Icons, Bilder, Fonts usw), die ohne Zutun des Anwenders geladen werden, größer als 1MByte sind, ist das schlecht (Faustregel) - je weiter du von dieser 1MByte-Grenze weg bleibst (also darunter, nicht darüber!), umso besser.
Marc
https://www.w3schools.com/tags/att_video_preload.asp
Probier es mal mit preload="metadata".
Danke, aber leider hat dies nichts gebracht. IE/Edge laden erstmal das Video komplett und dann wird's abgespielt. Bin ich eigentlich der Einzige mit der Problem? Kann es am Video-Codec liegen?
Hallo Alexandru,
Danke, aber leider hat dies nichts gebracht. IE/Edge laden erstmal das Video komplett und dann wird's abgespielt. Bin ich eigentlich der Einzige mit der Problem? Kann es am Video-Codec liegen?
Ich finde es keine gute Idee, deinern Nutzern große Datenmengen aufzuzwingen.
Google macht das so:
<video autoplay="" class="video-ambient-youtube video-wide" loop="loop" poster="/adsense/start/images/home/hero-poster_1x.jpg" preload="none">
<source src="../../adsense/start/videos/home-hero.mp4" type="video/mp4">
<source src="../../adsense/start/videos/home-hero.webm" type="video/webm">
<source src="../../adsense/start/videos/home-hero.ogv" type="video/ogg">
</video>
Für mich sieht es so aus, als ob es auch im IE sofort startet.
Bis demnächst
Matthias
Danke für den Tip mit dem "poster" Tag. Das funktioniert jedoch überhaupt nicht. Der Browser schient den Tag "poster" zu ignorieren.
<video loop autoplay="" preload="none" width="100%" height="100%" poster="/video/V6.png">
Korrektur: Der poster-Tag funktioniert doch. Das ist gut, denn dadurch ist das urpsüngliche Problem mit dem Sofortabspielen weniger schlimm.
Mich würde es trotzdem interessieren, warum IE nicht sofort abspielt.
Übrigens, die tags autoplay="" preload="none" bringen auch keinen Unterschied. Das Video sollte doch nicht mehr automatisch laufen, oder? Bei mir startet das Video immer noch automatisch.
Moin Alexandru,
Danke für den Tip mit dem "poster" Tag.
poster
ist kein Tag, sondern ein Attribut.
Viele Grüße
Robert
Hallo Alexandru,
Bin ich eigentlich der Einzige mit der Problem?
offensichtlich. Bei mir läufts(LEIDER) direkt IE11. (Warum Browserhersteller da keine Sperroption bieten, bleibt mir eh ein Rätsel)
Aber dein Problem könntest du sowieso leicht umgehen, wenn du bessere Techniken für die paar Textanimationen anbieten würdest. Das geht leicht mit JS und/oder CSS und ist wesentlich flexibler, was Änderungen betrifft.
Gruss
Henry
Die Textanimationen sind echter Text, nicht Teil vom Video. Das Problem mit dem automatischen Abspielen des Videos kann ich nicht umgehen, in dem ich das Video weglasse. Ausserdem sind solche Hintergrundvideos immer beliebter. Man schaut sich heute stundenlang Videos auf YouTube, auch mobil an. Die 7MB sind kaum der Rede wert. Auch wenn ich das Video 2MB klein mache, bleibt immer noch die Frage, warum es nicht sofort abspielt.
Hallo Alexandru,
Ausserdem sind solche Hintergrundvideos immer beliebter.
Ich denke nicht. Welchen Mehrwert liefert dein Video? Nutzer sind auf der Suche nach Informationen und möchten kein (für sie ggf. teures) und nutzloses Video sehen.
Man schaut sich heute stundenlang Videos auf YouTube, auch mobil an.
Das macht man aber ganz bewusst. Bei deiner Seite kann sich Otto-Normalnutzer nicht gegen das Video wehren.
Die 7MB sind kaum der Rede wert.
Das sehe ich anders.
Bis demnächst
Matthias
Über Geschmack lässt sich ja bekantlich streiten, auch wenn das nicht das Thema hier sein soll... bedanke ich mich für die unterschiedlichen Sichtweisen und hoffe, dass ich irgendwann mein eigentliches Problem lösen werde. Momentan bin ich halb zufrieden mit der poster-Lösung.
Viele Grüße Alexandru
Hallo Alexandru,
Über Geschmack lässt sich ja bekantlich streiten, auch wenn das nicht das Thema hier sein soll...
Das ist keine Frage des Geschmacks.
Bis demnächst
Matthias
Hallo
Mal unabhängig von deinem Problem, dass das Video in einigen Browsern erst nach dem vollständigen Herunterladen startet.
Die Textanimationen sind echter Text, nicht Teil vom Video. Das Problem mit dem automatischen Abspielen des Videos kann ich nicht umgehen, in dem ich das Video weglasse.
Genaugenommen und mit einem gerüttelt Maß Wortklauberei: Doch, kannst du. Ein Video, dass nicht da ist, muss nicht heruntergeladen werden, bevor es startet.
Ausserdem sind solche Hintergrundvideos immer beliebter. Man schaut sich heute stundenlang Videos auf YouTube, auch mobil an.
Ich glaube hier vermischtst du fröhlich unterschiedliche Dinge, um deine Argumentation zu stützen. Das tun sie aber nicht.
Wenn ich heute stundenlang Videos auf Youtube schaue, dann starte ich mindestens das erste dieser Videos händisch. Es läuft nicht automatisch los, bloß, weil ich die Seite öffne. Erst die folgenden Videos werden ohne mein Zutun automatisch abgespielt, wenn ich es nicht unterbinde, was ich auch tun kann. Zudem entscheide ich mich bewusst dazu, Videos anzuschauen, mitsamt den Folgen für ein eventuell zu beachtendes Datenvolumen. Das heißt eben auch, dass ich in bestimmten Situationen, zum Beispiel wegen des Datenvolumens oder auch wegen langsamer Internetverbindung, auch bewusst darauf verzichte.
Diese Chance habe ich als Besucher einer Seite bei einem automatisch startenden Video nicht. Daher solltest du vorsichtshalber davon ausgehen, dass automatisch startende Videos bei den Besuchern von Webseiten nicht so beliebt sind, wie du als Gestalter oder Betreiber einer Seite annimmst. Langsame Internetverbindungen und Verträge mit schlechten Konditionen bezüglich des enthaltenen Datenvolumens sind in Deutschland leider durchaus üblich.
Die 7MB sind kaum der Rede wert.
Wenn mir beim surfen Seiten mit automatisch startenden Videos x Male im Monat unterkommen, knabbert das auch die x Mal an meinem Datenvolumen, egal, ob ich das/die Videos ansehen will oder nicht. Wenn der Traffic nicht nur mir als Nutzer in Rechnung gestellt würde, sondern auch allen Betreibern von Websites, würden diese dem Umstand bei der Gestaltung ihrer Seiten auch eher Rechnung tragen müssen. Solange aber der auf Websites auftretende Traffic in vielen Fällen augenscheinlich nichts kostet, kann es den Websitebetreibern auch egal sein, ob zumindest einige ihrer Nutzer durch den Besuch der Seiten finanziell belastet werden.
Tschö, Auge
Man schaut sich heute stundenlang Videos auf YouTube, auch mobil an.
Die meisten Teilnehmer dieses Forums sind aus Deutschland. Und hier ist es so, dass immer noch die von den Telkos einst für Frequenzen bezahlten 50 Milliarden Euro "zurückverdient" werden müssen - was zu absurd hohen Preisen für das mobile Internet führt. In Litauen, Italien, Portugal oder unter Apothekertöchtern (die Geld so sehr verachten, dass sie es mit beiden Händen zum Fenster rauswerfen) mag Deine schöne Theorie gelten. Nicht hier und jetzt.
Die Animation gänge - sogar besser - auch mit SVG, JS und CSS.
Die Animation wurder direkt von unserer Software mit Hilfe eines Desktop-Aufnahmetools aufgenommen. Wie kann ich das durch SVG, JS und CSS ersetzen?
Die Animation wurder direkt von unserer Software mit Hilfe eines Desktop-Aufnahmetools aufgenommen. Wie kann ich das durch SVG, JS und CSS ersetzen?
Naja. Da kommt vor dem Erfolg der Fleiß. Aber ohne diesen kann man sowas auch nicht anbieten.
Ich habe das Gefühl, dass wir über unterschiedliche Sachen reden. Wir können nicht ein Video, welches die Bedienung unserer Software darstellt, durch SVG-Animationen ersetzten. Würden Sie das Arbeiten in bspw. Excel durch SVG-Mockups ersetzen (können)?
Hallo Alexandru,
Wir können nicht ein Video, welches die Bedienung unserer Software darstellt
Gerade ein solches Video sollte erst auf Anforderung gestartet werden.
Bis demnächst
Matthias
Wir können nicht ein Video, welches die Bedienung unserer Software darstellt
Gerade ein solches Video sollte erst auf Anforderung gestartet werden.
Es ist aber gerade kein Lehr- oder Informationsvideo sondern nur grafisches Beiwerk. Der automatische Start ist hier volle Absicht und dient der vermeintlichen Schönheit - und nicht etwa einem Informationszweck - denn der Informationswert des Videos liegt ganz klar genau bei NULL. Es lenkt sogar von den Informationen ab.
Wenn man jetzt und dort gegen jeden guten Rat partout "was Wackelndes" haben will, dann wäre allenfalls eine SVG-Animation (meinetwegen ein "Wackelgif") das angemessene Mittel.
Derlei grafisches Beiwerk gehört in die "Kilobit-Gruppe", denn mehr als ein paar Kilobyte sollte man denen, die Informationen suchen, für derartige Effekte nicht zumuten. Ich weiß, das ist "sowas von 1990" - aber manche Erkenntnisse gelten schon deutlich länger.
Richtig. Ich habe auch nie bahauptet, das Video soll irgendwelche nütlzlichen Informationen übertragen. Es soll nur Aufmerksamkeit und Interesse erregen. SVG-Animationen sind auch eine interessante Alternative. Sobald wir da was konkretes in der Hand haben, könnten wir überlgen das Video dadurch zu ersetzen.
Hej Alexandru,
Richtig. Ich habe auch nie bahauptet, das Video soll irgendwelche nütlzlichen Informationen übertragen. Es soll nur Aufmerksamkeit und Interesse erregen. SVG-Animationen sind auch eine interessante Alternative. Sobald wir da was konkretes in der Hand haben, könnten wir überlgen das Video dadurch zu ersetzen.
Dann kann es schon zu spät sein…
Besser ein hübsches Bild, meinetwegen ein Slider mit ein paar komprimierten Bildern (mit Anhalte-Option!!!) bis zur Realisierung des animierten SVGs.
Marc
Hallo Alexandru,
Wir können nicht ein Video, welches die Bedienung unserer Software darstellt, durch SVG-Animationen ersetzten. Würden Sie das Arbeiten in bspw. Excel durch SVG-Mockups ersetzen (können)?
Gutes Argument und ich bin verwirrt. Tatsächlich sehe ich jetzt wohl erst mal das Video. Dachte bisher es wäre nur die CAD-Zeichnung und die Schriften. Der IE spielt's auch auch komplett ab, wenn ich "rechte Maus" Wiedergabe aktiviere, der FF genauso erst dann. Das ist dann schon mal gut, nur bezweifle ich, dass die Masse meine Browsereinstellungen teilt. Hinzu kommt, auch wenns nicht abgespielt wird, läd es trotzdem im Hintergrund, glaube ich zumindest, denn es hakelt bereits bei den Schriften.
Aber du hast natürlich recht. Wenn es darum geht zu zeigen, was eure Animationen leisten kann und damit ein Video erzeugt wird, ist es nur logisch, auch ein solchen Video zu zeigen. Aber… die Zwangsbesichtigung ist nach wie vor eine sehr schlechte Lösung. Nimm doch lediglich ein paar von den Videoframes und lass die als Appetitanreger in kleiner Form scriptgesteuert oder per GIF ablaufen und wer dann wirklich Interesse hat kriegt erst das komplette Video zu sehen.
Wenn du allerdings deinen Standpunkt beibehältst, dann wäre es vielleicht eh sinnvoller das bei Youtube zu hosten und darüber einzubinden, weil 1. läufts dann(leider) von alleine und 2. die mögliche Netwerksynergie von Youtube. Obendrein passt sich dort die Ausgabegröße der Usernetzanbindung an.
Gruss
Henry
Danke für den konstruktiven Beitrag, dachte schon, ich bin in einer "Kilobit-Gruppe" gelandet:) Die YouTube-Anbindung macht Sinn.
Moin Alexandru,
dachte schon, ich bin in einer "Kilobit-Gruppe" gelandet:)
Wir sprechen uns wieder, wenn du unterwegs jemandem deine Seite zeigen willst und EDGE hast 😝
Viele Grüße
Robert
Hej Alexandru,
Wir können nicht ein Video, welches die Bedienung unserer Software darstellt, durch SVG-Animationen ersetzten. Würden Sie das Arbeiten in bspw. Excel durch SVG-Mockups ersetzen (können)?
Also ich sehe da keine Anleitung, nur animierte 3D-Gitter. Welche Knöpfe gedrückt oder Befehle eingegeben werden müssen, damit die so wie gezeigt animiert werden, sehe ich in dem Video nicht.
Insofern weiß ich nicht, wo da etwas wie Bedienung dargestellt würde.
Übrigens eignen sich echte Erklärvideos wohl kaum für den Zweck, den du auf der Startseite anstrebst.
Auch wenn es schwer fällt. Nimm dir die Kritik und die Verbesserungsvoschläge zu Herzen. Es mag beschwerlicher sein, als einen Screencast hochzuladen, wird sich aber sicher auszahlen!
Marc
Hej Alexandru,
Das Problem mit dem automatischen Abspielen des Videos kann ich nicht umgehen, in dem ich das Video weglasse. Ausserdem sind solche Hintergrundvideos immer beliebter.
Bei Seitenbetreibern oder bei Nutzern oder bei Agenturen? Bei Designern? Antwort bitte mit Beleg. Würde mich sehr interessieren, wenn es dafür Hinweise gibt (oder dagegen)…
Marc
Hej Alexandru,
Das Problem mit dem automatischen Abspielen des Videos kann ich nicht umgehen, in dem ich das Video weglasse. Ausserdem sind solche Hintergrundvideos immer beliebter. Man schaut sich heute stundenlang Videos auf YouTube, auch mobil an. Die 7MB sind kaum der Rede wert.
Doch. Streams von Youtube und Amazon Prime sind in meinem Vertrag inklusive, Streams von Dir nicht. Da ich Videos nur bei Youtube oder Prime gucken möchte, habe ich einen entsprechend niedriges Datenvolumen in meinem Vertrag. Deine Seite und deine Einstellung zu dem, was du mir aufbürdest, finde ich unverschämt!
Bitte nimm solche Kritik ernst. — Es mag sich dennoch lohnen für dich. Vielleicht werden solche Videos bei der Mehrzahl der Nutzer immer beliebter. An Deiner Stelle würde ich das aber unbedingt überprüfen, sonst geht das nach hinten los…
Davon abgesehen: kann man das Video anhalten? - Für viele Menschen ist das nötig, weil sie sonst den Text drum herum nicht lesen können. Bewegte Inhalte lenken maximal ab.
Das kann ich übrigens belegen, falls du es wünschst…
Marc
Hi,
ich habe eine Hintergrund-Video auf der Homepage, dass beim laden der Webseite sofort anfangen sollte zu spielen.
Willst Du nicht, daß die Inhalte wahrgenommen werden?
Hintergrund-Gezappel lenkt massiv ab.
OK, gucken wir mal auf Deine Seite ...
Das Video auf Deiner Seite wird bei mir (Firefox 61.0.1, auf Windows-Desktop, DSL-Verbindung) zwar sofort beginnend, aber sehr ruckelig abgespielt, das verstärkt den Ablenkungseffekt auch noch.
Und noch schlimmer wird's, weil die Texte, die man ja vermutlich lesen sollte, auch noch ständig wechseln.
Also bewegter/verschwindender Text auf zappeligem Hintergrund - nicht wirklich gut.
cu,
Andreas a/k/a MudGuard
Bis auf wenige Ausnahmen, versuchen alle hier mich von der Lösung aus ästhetischen/usability Gründen abzubringen. Angenommen ich hätte ein Play-Button, dann wären alle glücklich damit, aber das Video würde vermutlich immer noch erst laden und dann abspielen. Also lasst uns doch beim technischen Problem bleiben.
Hi,
Bis auf wenige Ausnahmen, versuchen alle hier mich von der Lösung aus ästhetischen/usability Gründen abzubringen.
Und das bringt Dich nicht zum Nachdenken darüber, ob das Video als Hintergrund wirklich sinnvoll ist? Egal ob es sofort, verzögert oder per Play-Button startet?
cu,
Andreas a/k/a MudGuard
Moin MudGuard,
Bis auf wenige Ausnahmen, versuchen alle hier mich von der Lösung aus ästhetischen/usability Gründen abzubringen.
Und das bringt Dich nicht zum Nachdenken darüber, ob das Video als Hintergrund wirklich sinnvoll ist? Egal ob es sofort, verzögert oder per Play-Button startet?
„Ein Geisterfahrer? Hunderte!“
Viele Grüße
Robert
Doch, schon ein wenig. Tatsache ist, die Meinungen sind je nach Quelle unterschiedlich. Hero Videos werden oft als neue Trends genannt.
Ich wollte wissen, ob andere Sites auch mein Problem haben und bin auf dies hier gestoßen:
https://stripe.com/gb/sigma
Das Video startet auf IE auch nicht automatisch, gleiches Problem.
Mitlerweile habe ich das Format webm hinzugefügt, das Video ist nur noch 4MB statt 7MB. Aber IE nimmt webm nicht. Kann einfach nicht abspielen, obwohl es sollte.
Noch eine Idee: Man könnte ein "Cancel play" button hinzufügen. Das Video würde verzögert laden und starten und nur dann, wenn der Besucher nicht auf "Cancel" gedrückt hat. Das wäre ein Kompromiss.
Hallo Alexandru,
Mitlerweile habe ich das Format webm hinzugefügt, das Video ist nur noch 4MB statt 7MB. Aber IE nimmt webm nicht. Kann einfach nicht abspielen, obwohl es sollte.
laut Can I use kann der IE kein Webm: https://caniuse.com/#feat=webm
Bis bald!
Meowsalot (Bernd)
Oh, danke. Ich war auch schon auf "Can I use" und war kurzzeitig Farbenblind. Habe die Farbenlegenden übersehen und habe das so interpretiert, wenn bei IE die 11 steht, dann wird nur IE 11 webm unterstützen.
Hallo Alexandru,
Also lasst uns doch beim technischen Problem bleiben.
Früher hieß das Attribut autobuffer
, heute preload
. Die MDN schreibt dazu:
none
, metadata
bzw. auto
, die beiden ersten sind selbsterklärend, zu auto
heißt es: die Bedürfnisse des Benutzers haben PrioritätWenn ich dich aber richtig verstehe, wird das Video erst vollständig geladen und dann beginnt der Browser es abzuspielen. Das kann ich für meinen Browser nicht bestätigen (und ist mir auch noch nicht begegnet). Ich vermute deshalb, dass es an den Browsereinstellungen liegt.
Bis demnächst
Matthias
Hmm, ich habe es auf unterschiedlichen Rechnern ausprobiert, alle Win 10, und das Verhalten ist immer gleich....