PageSpeed und Videos:
Die häufigsten Fehler und wie du sie vermeidest

Nur blöd, wenn der Effekt auf euren PageSpeed-Score so ist, als hätte euer Handy nur 3G und alles würde ewig laden. Alles wird langsam. Richtig langsam. Wenn es euren Nutzer*innen auffällt, ist es einfach nur nervig. Manchmal fällt es gar nicht so auf, aber Google fällt es auf. Viele Seiten verlieren 20–40 Punkte bei Google PageSpeed Insights – nur wegen falsch eingebundener Videos. Das Problem dabei ist, dass die Besucher*innen erst gar nicht kommen, weil eure Seiten bei Google schlechter gelistet werden.

Die gute Nachricht: Es geht auch anders – ohne dass ihr auf euer Video verzichten oder ein Tech-Handbuch lesen müsst. In diesem Beitrag erklären wir euch zunächst, woran es liegen kann – okay, das wird ein bisschen technisch – und dann, was ihr dagegen tun könnt. Bei den Lösungen geht es ohne Technik leider auch nicht ganz. Sorry.

Warum Videos den PageSpeed killen (können)

Videos sind keine kleinen „Assets“, also Dateien. Schon ein einzelnes Video bringt oft mehrere Megabyte auf die Waage – vor allem, wenn ihr die Dateien einfach so auf eure Webseite packt. Das könnt ihr zwar optimieren, indem ihr das richtige Format für Videos im Web wählt und die Datei entsprechend komprimiert.

Aber nicht nur die Dateigrößen beeinflussen die Ladegeschwindigkeit von Videos. Weitere Ursachen sind:

• Autoplay und Preload: Das Video wird direkt geladen, egal, ob es angeschaut wird oder nicht. Autoplay an sich ist nicht schlecht. Ihr müsst es aber richtig einsetzen.
• Kein "Lazy Load": Das ist Tech-Sprech für: der Videoplayer wird sofort geladen, auch wenn er ganz unten auf der Seite steht und eure Besucher erst später dort hin scrollen. In Kombination mit dem Punkt direkt hier drüber. Doof.
• Core Web Vitals leiden: Besonders LCP (Largest Contentful Paint) und CLS (Cumulative Layout Shift) werden durch große Player negativ beeinflusst. Erklären wir im nächsten Abschnitt noch einmal etwas genauer.
• YouTube und Vimeo: Klingt bequem, ist aber nicht gerade „lightweight“, weil viele externe Skripte für Fonts, Tracking und Cookies geladen werden. Außerdem kommt in der Regel noch eine 2-Klick-Lösung dazu, damit die Vorgaben der DSGVO erfüllt werden. (Der Techie würde sagen: Lighthouse merkt hier beispielsweise „Eliminate render-blocking resources“ oder „Reduce JavaScript execution time“ an.
• „Normales“ Webhosting: Auch das führt zu Problemen. Zwar ist oft Traffic inklusive, aber die Bandbreite ist limitiert. Schon bei wenigen Besucher:innen, die gleichzeitig Videos aufrufen (Stichwort: Autoplay), kann die Webseite spürbar langsamer werden. (In diesem Interview greifen wir auf warum normales Webhosting zum Problem bei Videos wird)
• Mehrere Videos auf einer Seite: Wenn ihr das Ganze mit mehreren Videos auf einer Seite treibt, wird es richtig schlimm. Dann multiplizieren sich die Effekte.

Kurz gesagt:

Ein Video kann eurer Seite optisch helfen, besser verkaufen und Dinge besser erklären, aber technisch richtig wehtun.

Ein Schritt zurück:

Was der PageSpeed-Score eigentlich misst. Und warum es wichtig ist.

Wenn du schon einmal Google PageSpeed Insights oder Lighthouse benutzt hast, weißt du, dass am Ende eine Zahl zwischen 0 und 100 steht.

Je näher du an 100 kommst, desto besser ist laut Google die User Experience.

In den Score fließt deine gesamte Website ein, nicht nur die Videos. Einige Stichworte für Videos sind bereits gefallen. Wir schauen uns nun ein paar der wichtigsten Aspekte an.

1. LCP (Largest Contentful Paint):

Was wird hier gemessen?

Die Zeit, bis der größte sichtbare Inhalt geladen ist. Bei Seiten mit Video ist das oft der Player selbst oder ein großes Vorschaubild.

Warum ist das wichtig?

Google sieht den LCP als Indikator dafür, wie schnell Nutzer:innen etwas sehen können. Je länger das dauert, desto höher ist die Absprungrate.

2. CLS (Cumulative Layout Shift)

Was misst das?

Wie stark sich das Layout der Seite während des Ladens verschiebt.

Warum ist das wichtig?

Es gibt kaum etwas Nervigeres, als beim Scrollen plötzlich auf einen Link zu klicken, der wegrutscht, weil sich der Player lädt. Google straft das hart ab – zu Recht.

Typische Probleme:

• Video-Player, die erst nachträglich ins Layout springen
• kein fester Platzhalter im HTML vorgesehen.
• Dynamische Skripte von YouTube/Vimeo, die nachträglich UI-Elemente einfügen.

3. TBT (Total Blocking Time)

Was misst das?

Wie lange der Browser durch externe Skripte blockiert wird, bevor der Nutzer etwas tun kann (klicken, scrollen, abspielen).

Warum ist das wichtig?

Je länger diese Blockade dauert, desto weniger interaktiv ist deine Seite. Nutzer:innen springen ab, weil nichts passiert.

Typische Probleme:

• Externe Player laden massenweise JavaScript.
• Tracking-Skripte von Drittanbietern (Vimeo, YouTube)

4. FID (First Input Delay)

Was wird hier gemessen?

Die Verzögerung zwischen der ersten Nutzerinteraktion (z. B. ein Klick) und der Reaktion der Seite.

Warum ist das wichtig?

Wenn dein Video erst nach mehreren Sekunden reagiert, weil im Hintergrund noch Skripte ausgeführt werden, wirkt das träge und unprofessionell.

5. SI (Speed Index)

Was misst das?

Wie schnell der sichtbare Bereich der Seite geladen wird.

Warum ist das wichtig?

Wenn dein Video prominent im sichtbaren Bereich liegt und nicht optimiert ist, zieht das den kompletten Index runter.

Typische Probleme:

• Video lädt synchron statt asynchron
• Kein Lazy Load oder Vorschaubild

+ + + +

und, und, und. Wir stoppen hier mal. Ihr seht, es geht viel um Ladezeiten, schnelligkeiten und wann etwas passiert.

In der Praxis kann selbst ein optimiertes Video deinen Score von 90 Punkten auf unter 50 Punkte drücken und somit SEO, Ladezeit und UX beeinträchtigen - wenn es falsch eingebunden ist. Das wirkt sich nicht nur auf dein SEO, sondern oft auch auf die Performance deiner ganzen Kampagnen aus.

Längere Ladezeit = höhere Bounce-Rate = schlechteres Rating in den Kampagnen = schlechteres Ranking = geringere Effizienz = höhere Kosten = ...

Okay, okay.

Wie kann ich den Lighthouse-Score mit Videos auf der Webseite optimieren?

Leider spielen da sehr viele Faktoren hinein. Wir haben sehr viel Erfahrung mit Videos auf Webseiten und manchmal gibt es auch konkrete Lösungen für die oben genannten Probleme.

Zusätzlich sinnvoll:

• Ein „leichter“ Videoplayer statt 5 MB JavaScript. Viele Player haben unnötige Funktionen, tracken eure Besucher*innen und bringen viel mit, was ihr eigentlich nicht braucht.
• Bewusster Umgang mit Videos, die direkt laden: Wenn etwas außerhalb des ersten Blickfelds liegt, muss es nicht direkt geladen werden.
• Autoplay-Videos optimieren: Gerade Autoplay-Videos sind oft nur dekorativ. Das müssen keine minutenlangen Videos sein. Alles zwischen 5 und 15 Sekunden ist meist ein guter Wert.

Diese Maßnahmen allein können deinen PageSpeed Score um 20–30 Punkte verbessern. Ohne Qualitätseinbußen beim Video selbst.

Extra-Tipp: Eine Alternative zu YouTube, Vimeo & Co.

Google hat offensichtlich keine Probleme mit YouTube. Gleiche Firma. Die mögen sich.

Dennoch leidet die Performance des Players. Aber nicht nur das: Der Player kann nicht personalisiert werden, Autoplay ist nicht möglich, er ist unflexibel, was Formate angeht, und die Empfehlungen nach dem Video sind superkomisch. Wir könnten noch lange weitermachen.

Hinzu kommt noch der Datenschutz. Hier ist auch Vimeo ein Problem. Hier sind zwei Tutorials zu diesem Thema:

• YouTube DSGVO-konform einbetten
• YouTube NoCookie – was ist das und wie nutzt man es?
• Vimeo DSGVO-konform einbetten
• Vimeo: DoNotTrack – was ist das und wie nutzt man es?

Ihr könnt sie euch anschauen, werdet aber merken, dass ihr immer eine 2-Klick-Lösung braucht und nur ein Teil eurer Besucher die Videos wirklich sieht. Ihr braucht immer eine 2-Klick-Lösung. Shit.

Es gibt aber Alternativen:

Selbst hosten – aber ihr habt oben schon gelesen. Das ist nicht einfach unbedacht. Ihr braucht einen ordentlichen Player, Lazy Load, Vorschaubild usw., aber das lohnt sich nur bei wenigen Besuchern.

Oder ihr nutzt Lösungen, die für Europa und unsere Bedürfnisse entwickelt wurden. Ignite Video wurde genau dafür entwickelt. Einfach ein Video hochladen und den Player einbauen. Ihr müsst euch über die ganzen Punkte oben keine Gedanken machen. Es ist direkt DSGVO-konform, es werden keine Cookies verwendet, alles wird adaptiv gestreamt, der Player passt zu eurer Marke, es ist barrierefrei, die Server stehen in Deutschland und ihr unterstützt ein Unternehmen aus Deutschland und keinen Konzern. Alles super. Ok, fast keine Gedanken: Auf die Videolänge solltet ihr dann schon achten.

Fazit:
Videos sind gut – aber nur, wenn sie richtig eingesetzt werden.

Die sehr kurze Version lautet: Baut eure Videos nicht einfach so ein. Achtet auf die entscheidenden KPIs oben. Versucht nicht, alles auf einmal zu lösen. Optimiert zunächst die Formate und kümmert euch anschließend um einen anderen Player. Alternativ könnt ihr direkt auf einen professionellen Anbieter zurückgreifen. Ihr könnt alles selbst machen, das ist aber sehr komplex.