Ein Video kann auf einer Seite viel erklären, aber es kann sie auch spürbar langsamer machen. Ein eingebetteter YouTube-Player lädt beim Aufruf der Seite eine Menge Code und Daten, auch wenn niemand das Video startet. Eine große Videodatei, die automatisch lädt, kostet Bandbreite und verzögert andere Inhalte. Diese Seite zeigt, wie du Videos so einbindest, dass die Seite schnell bleibt, und was dabei für Plattformvideos und selbst gehostete Videos gilt.
Warum Videos Seiten bremsen
Ein eingebettetes Video von einer Plattform kommt in einem iframe, das eine eigene kleine Webseite mit Player, Skripten und Schriftarten lädt. Die Chrome-Dokumentation zu Lighthouse nennt ein Beispiel, in dem eine leichte Vorschau von etwa 3 KB einen Player von rund 540 KB ersetzt, bis jemand mit dem Video interagiert [1]. Diese Daten werden geladen, ob das Video gesehen wird oder nicht.
Bei selbst gehosteten Videos hängt viel davon ab, was der Browser vorab lädt. Lädt er die ganze Datei, belastet das vor allem Besucher mit langsamer Verbindung. Dazu kommt das Layout: Hat das Video keine festen Abmessungen, verschiebt sich der Inhalt, sobald es geladen ist. web.dev rät, bei Bildern und Videos immer die Attribute width und height anzugeben [2].
Plattformvideos: erst die Vorschau, dann der Player
Die wirksamste Methode für YouTube und ähnliche Dienste ist eine sogenannte Fassade. Die Chrome-Dokumentation beschreibt sie als statisches Element, das wie das eingebettete Video aussieht, aber erst beim Klick das echte Einbettungselement lädt [1]. Typisch ist ein Vorschaubild mit Abspielknopf. Fährt die Maus darüber, kann die Seite schon eine Verbindung zum Videodienst aufbauen, und erst beim Klick wird der Player geladen [1]. Für YouTube nennt die Dokumentation mehrere frei verfügbare Umsetzungen, darunter lite-youtube-embed [1].
Fassaden haben Grenzen. Nach der Chrome-Dokumentation kann zum Beispiel automatisches Abspielen uneinheitlich funktionieren, weil der echte Player erst nach dem Klick da ist [1]. Für ein Video, das ohnehin jemand bewusst starten soll, ist das kein Nachteil. Für ein stummes Hintergrundvideo ist eine Fassade nicht geeignet.
Video zu deinem Thema? Jan macht das.
Schreib Jan, worum es gehen soll. Die Anfrage geht an 301@seo-manager.info, die Abstimmung läuft über SEO NW.
Lazy Loading für iframes
Wer keine Fassade nutzen will, kann das iframe zumindest verzögert laden. Mit dem Attribut loading="lazy" lädt der Browser das iframe erst, wenn es in die Nähe des sichtbaren Bereichs kommt. Laut web.dev unterstützen Chrome und Edge das für iframes, Firefox ab Version 121 und Safari ab Version 16.4 [3]. Browser ohne Unterstützung ignorieren das Attribut [3]. Steht das Video weit oben auf der Seite, bringt das wenig, weil es dann sofort sichtbar ist. Dort ist eine Fassade die bessere Lösung.
Eigene Videos mit dem video-Element
Für selbst gehostete Videos bietet das HTML-Element video die nötigen Stellschrauben. Mit dem Attribut poster legst du ein Vorschaubild fest, das angezeigt wird, bis das Video lädt [4]. Ohne poster zeigt der Browser nichts, bis das erste Bild verfügbar ist [4]. Das Attribut preload steuert, was vorab geladen wird: none lädt nichts, metadata nur Angaben wie die Dauer, auto erlaubt dem Browser, die ganze Datei zu laden [4]. Für Videos weiter unten auf der Seite ist preload="none" oder "metadata" meist die richtige Wahl.
Wichtig: Das Attribut autoplay hat Vorrang vor preload [4]. Ein automatisch abspielendes Video wird also geladen, egal was in preload steht. Setze autoplay deshalb nur dort ein, wo es einen Grund gibt, und dann zusammen mit muted, weil Browser automatisches Abspielen mit Ton blockieren [4].
Das Video als größtes Element
Steht ein Video ganz oben auf der Seite, kann es das größte sichtbare Element sein und damit den Largest Contentful Paint bestimmen. Bei video-Elementen zählt laut web.dev das Vorschaubild oder das erste Bild des Videos, je nachdem, was früher erscheint [5]. Als gut gilt ein LCP von 2,5 Sekunden oder weniger [5]. Ein kleines, gut komprimiertes Vorschaubild hilft hier mehr als jede Einstellung am Video selbst.
Datei und Format
Bei eigenen Videos zählt die Datei. Komprimiere Videos für das Web, statt die Originaldatei aus dem Schnittprogramm hochzuladen. Für die meisten Zwecke reicht eine Auflösung, die zur Anzeigegröße passt. Ein Video, das in einer Lesespalte läuft, braucht keine 4K-Auflösung. Kurze Hintergrundvideos ohne Ton können oft deutlich kleiner sein als Videos mit wichtigem Bildinhalt. Lass bei stummen Videos die Tonspur ganz weg, sie macht die Datei nur größer.
Für längere Videos und viele Aufrufe kann ein Videodienst oder ein Content Delivery Network sinnvoller sein als der eigene Webserver.
Datenschutz bei eingebetteten Videos
Eingebettete Videos von Plattformen laden Inhalte von fremden Servern. YouTube bietet dafür einen erweiterten Datenschutzmodus an, den du aktivierst, indem du in der Einbettungsadresse youtube.com durch youtube-nocookie.com ersetzt [6]. Laut YouTube wird die Wiedergabe in diesem Modus nicht zur Personalisierung des Surfens auf YouTube verwendet, und Anzeigen im Video sind nicht personalisiert [6]. Ob das für deine Datenschutzanforderungen reicht, ist eine eigene Frage. Eine Fassade, die den Player erst nach dem Klick lädt, überträgt beim ersten Aufruf weniger Daten. Baut sie schon beim Überfahren mit der Maus eine Verbindung zum Videodienst auf, findet vor dem Klick bereits eine Übertragung statt.
Die Wirkung prüfen
Ob die Einbindung gelungen ist, zeigt ein Vergleich vorher und nachher. Miss die Seite mit PageSpeed Insights oder den Entwicklerwerkzeugen im Browser einmal mit dem bisherigen Player und einmal mit der neuen Einbindung. Achte vor allem auf die übertragene Datenmenge beim ersten Aufruf, auf den Largest Contentful Paint und darauf, ob sich beim Laden etwas verschiebt. Teste auch auf dem Smartphone mit gedrosselter Verbindung, denn dort fallen Unterschiede am stärksten auf.
Prüfe danach, ob das Video noch so funktioniert wie gewünscht: Startet es mit einem Klick, läuft es im Vollbild, erscheinen die Untertitel? Bei Fassaden kommt es vor, dass ein zweiter Klick nötig ist, bis das Video wirklich spielt. Das sollte vor dem Veröffentlichen auffallen, nicht erst durch Rückmeldungen von Besuchern.
Video und Suche zusammen denken
Eine schnelle Einbindung sollte nicht dazu führen, dass Google das Video nicht mehr findet. Ergänze strukturierte Daten und, wenn Videos in der Suche erscheinen sollen, eine Video-Sitemap. Wie das geht, steht in den Ratgebern VideoObject: strukturierte Daten für Videos und Video SEO. Wie Bilder auf derselben Seite schnell laden, beschreibt der Ratgeber Bilder für Websites optimieren. Mehr zu Ladezeit und Core Web Vitals steht auf unserer Hauptseite unter Core Web Vitals verbessern.
Du hast ein Video und willst es einbinden, ohne dass deine Seite langsamer wird? Frag bei Jan an. Er liefert Videos in passenden Formaten mit Vorschaubild und stimmt die Einbindung mit dir ab.
- Organisation Lazy load third-party resources with facades. Chrome for Developers, Lighthouse. Stand 01.12.2020. abgerufen am 30.10.2026
- Organisation Optimize Cumulative Layout Shift. web.dev, Google. Stand 07.02.2025. abgerufen am 30.10.2026
- Organisation Browser-level image lazy loading for the web. web.dev, Google. Stand 13.08.2024. abgerufen am 30.10.2026
- Organisation video: Das Video-Einbettungs-Element. MDN Web Docs. Stand 30.10.2026. abgerufen am 30.10.2026
- Organisation Largest Contentful Paint (LCP). web.dev, Google. Stand 04.09.2025. abgerufen am 30.10.2026
- Organisation Videos und Playlists einbetten. YouTube-Hilfe. Stand 2026. abgerufen am 30.10.2026
Häufige Fragen
Warum macht ein YouTube-Video meine Seite langsam?
Weil der eingebettete Player beim Aufruf der Seite viel Code lädt, auch wenn niemand das Video startet. Eine Vorschau, die den Player erst nach dem Klick lädt, verhindert das.
Was ist eine Fassade für Videos?
Ein statisches Vorschaubild mit Abspielknopf, das wie der Player aussieht. Erst beim Klick wird das echte Video geladen.
Welchen preload-Wert soll ich für eigene Videos nehmen?
Für Videos weiter unten auf der Seite none oder metadata. Mit auto darf der Browser die ganze Datei laden. autoplay hat Vorrang vor preload.
Hilft loading="lazy" bei Videos?
Bei iframes ja, wenn das Video nicht gleich oben sichtbar ist. Alle großen Browser unterstützen das Attribut für iframes inzwischen.
Was bringt youtube-nocookie.com?
Laut YouTube wird die Wiedergabe im erweiterten Datenschutzmodus nicht zur Personalisierung auf YouTube genutzt, und Anzeigen im Video sind nicht personalisiert.
Video anfragen bei Jan
Schreib Jan, worum es gehen soll. Die Anfrage geht an 301@seo-manager.info, die Abstimmung läuft über SEO NW.
Zuletzt geprüft am 03.11.2026, nächste Prüfung spätestens im November 2027. Fehler entdeckt? Schreib uns.
