Prüfpunkt co2.video.autoplayDatenmenge je Aufruf
Was kostet ein Video, das von selbst startet?
Ein Hintergrundvideo im Kopf der Startseite ist meist die größte Datei der ganzen Seite. Startet es von selbst, lädt es bei jedem Besuch, auch für Besucher, die gleich weiterscrollen. Die Prüfung meldet jedes Video mit autoplay, auch mit preload="none", mit Adresse, übertragenen KB und der Angabe, ob ein Stylesheet der Seite reduzierte Bewegung berücksichtigt.
Warum ein Hintergrundvideo stumm sein muss, um von selbst zu starten
Browser lassen Videos nur unter Bedingungen von selbst starten. Safari auf dem iPhone erlaubt es seit iOS 10, angekündigt im Juli 2016, für Videos ohne Tonspur oder mit dem Attribut muted und hält sie an, sobald sie aus dem sichtbaren Bereich gescrollt werden. Chrome hat seine Regeln im April 2018 mit Version 66 verschärft: Stumme Videos dürfen immer von selbst starten, Videos mit Ton erst, wenn der Besucher etwa auf der Website geklickt oder getippt hat. Google begründet das unter anderem damit, den Datenverbrauch in teuren oder knappen Netzen zu senken. Ein Hintergrundvideo, das von selbst laufen soll, braucht deshalb muted oder eine Datei ohne Tonspur. Der Ton bleibt damit aus, die Videodatei lädt trotzdem.
Fast jedes vierte Video im Web startet von selbst
Im Web Almanac 2024 des HTTP Archive enthielten 6,7 % der Seiten am Telefon mindestens ein video-Element, am Desktop 7,7 %. Von den video-Elementen am Telefon hatten 23 % das Attribut autoplay, drei Prozentpunkte mehr als 2022. Die meisten Videos sind kurz: Mehr als die Hälfte läuft unter 30 Sekunden, neun von zehn unter zwei Minuten. Startet eine solche Schleife von selbst, lädt sie für jeden Besucher, auch für den, der nur Ihre Telefonnummer sucht und gleich weiterscrollt. Die Web Sustainability Guidelines, ein Entwurf der Sustainable Web Interest Group des W3C, empfehlen, Autoplay für Audio und Video standardmäßig abzuschalten.
Ein Vorschaubild zeigt Ihr Motiv sofort
Mit dem Attribut poster zeigt der Browser ein Standbild, bis das Video läuft. Ohne poster bleibt die Fläche leer, bis das erste Einzelbild des Videos angekommen ist. Ein Vorschaubild als WebP oder AVIF in der angezeigten Breite ist eine einzelne Bilddatei: Der Besucher sieht Ihr Motiv, sobald die Seite steht, und wer das Video sehen will, startet es mit einem Klick. Die Daten des Videos fließen dann nur zu den Besuchern, die es ansehen. Mit festen Angaben für width und height steht der Platz des Videos schon beim Laden fest, und der Text darunter springt nicht.
Was die Prüfung liest
Sie sucht video-Elemente mit dem Attribut autoplay und zählt die übertragenen KB der Videodatei beim Aufruf. Steht dabei preload="none", nennt der Befund das ausdrücklich („trotz preload="none"“). Außerdem sieht sie nach, ob ein Stylesheet der Seite eine Regel für prefers-reduced-motion enthält; Stylesheets fremder Server zählen mit, wenn deren Server das Lesen per CORS erlaubt. Der Befund nennt das als „beachtet“ oder „ignoriert“. „beachtet“ heißt, dass eine solche Regel im Stylesheet steht; ob sie das Video betrifft, zeigt ein Blick in die Regel.
Bewegung und Barrierefreiheit
Menschen, die in ihrem System „Bewegung reduzieren“ eingestellt haben, reagieren auf bewegte Hintergründe oft mit Schwindel oder können sich schlecht konzentrieren. Eine Seite kann ihnen ein Standbild zeigen und die Videodatei ganz sparen: Ein kleines Skript startet das Video nur bei normaler Bewegungseinstellung. Läuft bewegter Inhalt länger als fünf Sekunden von selbst, verlangt WCAG 2.2 außerdem eine Möglichkeit, ihn anzuhalten (Kriterium 2.2.2).
Was autoplay mit preload macht
preload="none" bittet den Browser, mit dem Laden bis zum Abspielen zu warten. Steht zugleich autoplay da, beginnt das Abspielen sofort, und der Browser lädt. Sparsam ist ein Video deshalb erst, wenn es auf einen Klick startet: mit controls, preload="none" und einem Vorschaubild (poster).
Beispiele
Hintergrundvideo
<video autoplay muted loop src="/medien/hintergrund.mp4"></video><video controls preload="none"
poster="/medien/hintergrund-standbild.webp">
<source src="/medien/hintergrund.mp4" type="video/mp4">
</video>So gehen Sie es an
- Klären Sie, ob das Video eine Information zeigt oder Stimmung macht. Für Stimmung genügt oft ein Standbild.
- Starten Sie das Video auf Klick: autoplay entfernen, controls und preload="none" setzen, ein Vorschaubild als poster angeben.
- Bleibt ein Hintergrundvideo mit autoplay, bleibt auch der Befund. Halten Sie die Datei dann klein (kurze Schleife, geringe Auflösung, Tonspur entfernt) und zeigen Sie unter prefers-reduced-motion ein Standbild.
- Bestellen Sie danach eine Nachmessung, um das neue Seitengewicht zu sehen.
Tipps aus der Praxis
- autoplay="false" schaltet Autoplay nicht ab. Steht das Attribut im Tag, startet das Video, ganz gleich mit welchem Wert; entfernen Sie es vollständig. Bei muted ist es genauso: muted="false" lässt den Ton aus.
- Für eine kurze Schleife ist ein stummes Video sparsamer als ein animiertes GIF. WebKit, die Grundlage von Safari, nennt GIFs bis zu zwölfmal so teuer in der Bandbreite und doppelt so teuer im Energieverbrauch wie Video.
- Ein Video weiter unten auf der Seite gehört erst recht hinter einen Klick. Mit autoplay beginnt der Browser beim Aufruf mit dem Laden, auch wenn der Besucher nie bis dorthin scrollt.
Weiter im Prüfbereich CO₂ & EmpCo
- Was darf meine Website seit dem 27. September 2026 über die Umwelt sagen?Seit 27.09.2026 gelten in Deutschland und Österreich die EmpCo-Regeln im UWG: was unzulässig ist, was erlaubt bleibt, warum Übergangsregeln nur Waren betreffen.
- Spart eine schlanke Website Geld, und was sagt der CO₂-Wert wirklich?Was eine schwere Website kostet: beim Hoster Cent, beim Kunden Wartezeit. Was der CO₂-Wert je Aufruf bedeutet, wo das Modell endet, wie KI-Anfragen dazu stehen.
- Was bedeutet es, wenn Bilder mehr als die Hälfte der Übertragung ausmachen?Machen Bilder mehr als 50 % der übertragenen Bytes aus, meldet die Prüfung den Befund. Wo die meisten Bytes stecken und wie Sie sie einsparen.
- Warum sollen große Bilder als WebP oder AVIF statt als JPEG oder PNG kommen?JPEG- und PNG-Dateien ab 100 KB meldet die Prüfung, weil der Browser WebP und AVIF annimmt. So stellen Sie Ihr CMS auf die modernen Formate um.
Dieser Prüfpunkt gehört zum Prüfbereich CO₂ & EmpCo; dort stehen alle Prüfpunkte im Überblick. Was die Prüfung insgesamt leistet, zeigt die Leistungsseite; wie ein Ergebnis zustande kommt, erklärt das Prüfverfahren. Alle Prüfbereiche im Überblick: Wissensbasis.
