Nachhaltige Website erstellen: 10 Maßnahmen für weniger CO₂, bessere Performance und bessere UX

Eine nachhaltige Website ist keine Website mit grünem Logo und gut gemeinter Nachhaltigkeitsbehauptung. Sie ist eine Website, die mit Ressourcen bewusst umgeht: weniger unnötige Daten, weniger überflüssige Skripte, bessere Infrastruktur, klarere Nutzerführung und nachvollziehbare Messung.

Das ist nicht nur ein Umweltthema. Eine leichtere Website lädt oft schneller, funktioniert besser auf mobilen Geräten, erzeugt weniger Frust, ist einfacher zu warten und liefert bessere Signale für Suchmaschinen. Nachhaltiges Webdesign verbindet deshalb ökologische Verantwortung mit technischer Qualität und besserer User Experience.

Wichtig ist dabei eine nüchterne Sprache. Eine Website sollte im EU-Kontext nicht als "klimaneutral" beworben werden. Die neue EU-Verbraucherschutzregelung gegen Greenwashing verbietet ab dem 27. September 2026 insbesondere Claims, die auf Treibhausgas-Kompensation beruhen und behaupten, ein Produkt oder eine Dienstleistung habe eine neutrale, reduzierte oder positive Klima- bzw. Treibhausgaswirkung. In Deutschland gelten für solche Werbung schon jetzt strenge Anforderungen an Klarheit und Aufklärung. Der bessere Ausgangspunkt lautet deshalb: vermeiden und reduzieren, präzise messen, Fortschritt belegen und keine Neutralitätsbehauptung daraus machen.

Was ist eine nachhaltige Website?

Eine nachhaltige Website ist so geplant, gebaut und betrieben, dass sie ihren Zweck mit möglichst wenig digitalem Abfall erfüllt. Sie überträgt nur notwendige Daten, lädt Medien in passenden Größen, vermeidet unnötige Drittanbieter, nutzt effiziente Technik und läuft idealerweise auf verifiziert grüner Infrastruktur.

Dazu gehören mehrere Ebenen:

• Gestaltung: klare Seitenstruktur, keine dekorativen Medien ohne Nutzen, gute Lesbarkeit.
• Technik: schlanker Code, gute Caching-Strategie, moderne Bildformate, reduzierte Skripte.
• Infrastruktur: Hosting, CDN, Serverstandort, Strommix und Green-Hosting-Nachweis.
• Betrieb: regelmäßige Checks, Verantwortlichkeiten und transparente Dokumentation.
• Nutzererlebnis: schnelle Ladezeiten, stabile Darstellung, gute Interaktion und Barrierearmut.

Nachhaltigkeit entsteht also nicht durch eine einzelne Maßnahme. Green Hosting hilft, ersetzt aber keine effiziente Website. Ein komprimiertes Bild hilft, ersetzt aber keine saubere Medienstrategie. Ein CO₂-Wert hilft, ersetzt aber keine wiederkehrende Verbesserung.

Warum nachhaltige Websites relevant sind

Jeder Seitenaufruf löst Datenübertragung und Rechenarbeit aus: im Rechenzentrum, im Netzwerk, im CDN, im Browser und auf dem Endgerät. Bei einer einzelnen Pageview kann die geschätzte CO₂-Menge klein wirken. Bei vielen Besuchen, schweren Landingpages, Videos, Tracking-Skripten und externen Tools wird daraus ein reales Betriebsthema.

Der Nutzen nachhaltiger Websites geht aber über CO₂ hinaus.

Für Nutzer bedeutet eine schlankere Website häufig schnellere Ladezeiten, weniger Datenverbrauch und bessere Bedienbarkeit auf mobilen Geräten. Für Marketing-Teams bedeutet sie weniger Abbruchrisiko und bessere Kampagnenseiten. Für SEO-Teams bedeutet sie bessere technische Grundlagen, weil viele Nachhaltigkeitsmaßnahmen auch Performance, Crawling und Core Web Vitals unterstützen. Für Sustainability-Teams bedeutet sie, dass digitale Kanäle nicht außerhalb der eigenen Nachhaltigkeitskommunikation stehen.

Eine nachhaltige Website ist deshalb ein sichtbarer Qualitätsbeweis. Wer über Verantwortung, Effizienz oder Klimaschutz spricht, sollte nicht mit einer unnötig schweren, langsamen und unklar dokumentierten Website auftreten.

Warum "klimaneutrale Website" kein belastbarer Claim ist

Der Begriff "klimaneutrale Website" ist als Werbeaussage rechtlich und fachlich riskant. Eine Website verursacht nicht nur Emissionen auf dem eigenen Server. Auch Netzwerke, CDN, Endgeräte, Drittanbieter, eingebettete Medien und Nutzerkontexte spielen eine Rolle. Viele dieser Werte lassen sich nur schätzen.

Die EU-Richtlinie 2024/825 ergänzt die Liste der stets unlauteren Geschäftspraktiken. Verboten wird ein Claim, der auf der Kompensation von Treibhausgasemissionen beruht und behauptet, ein Produkt habe in Bezug auf Treibhausgasemissionen eine neutrale, reduzierte oder positive Umweltwirkung. Die Erwägungsgründe nennen unter anderem Beispiele wie "climate neutral", "CO2 neutral certified", "climate compensated" und "reduced climate impact". Für Websites ist das besonders relevant, weil eine Website als digitale Dienstleistung nicht durch den Kauf externer Zertifikate "neutral" wird.

Das bedeutet nicht, dass Unternehmen nicht über Reduktion, bessere Infrastruktur oder Klimaschutzinvestitionen sprechen dürfen. Sie sollten aber nicht den Eindruck erwecken, die Nutzung der Website habe keinen oder einen neutralisierten Klimaeffekt. Auch der Bundesgerichtshof hat für Deutschland 2024 klargestellt, dass mehrdeutige Umweltbegriffe wie "klimaneutral" regelmäßig in der Werbung selbst erklärt werden müssen; eine spätere Erklärung außerhalb der Werbung reicht nicht ohne Weiteres aus. Außerdem sind Reduktion und Kompensation nicht gleichwertig.

Für diesen Artikel heißt das: "klimaneutrale Website" ist kein Zielversprechen. Sinnvoller und belastbarer sind Aussagen wie "leichtere Website", "ressourcenschonender optimiert", "auf verifiziert grünem Hosting betrieben", "Page Weight reduziert" oder "Website-Emissionen nach transparenter Methodik geschätzt".

10 Maßnahmen für nachhaltigere Websites

1. Page Weight als Einstieg messen

Page Weight ist nicht dasselbe wie CO₂, aber es ist ein guter operativer Startpunkt. Wenn eine Seite viele Megabyte überträgt, gibt es fast immer Optimierungspotenzial. Messen Sie deshalb zuerst wichtige Templates: Startseite, Landingpages, Produktseiten, Blogartikel, Checkout, Kontakt und Kampagnenseiten.

Relevant sind nicht nur Gesamtwerte. Entscheidend ist der Asset-Mix: Wie viel entfällt auf Bilder, JavaScript, CSS, Fonts, Videos, HTML und Drittanbieter? Eine klare Aufteilung zeigt schneller, wo Arbeit Wirkung erzeugt.

2. Bilder konsequent optimieren

Bilder sind häufig der größte sichtbare Hebel. Typische Probleme sind zu große Abmessungen, alte Formate, fehlende responsive Varianten, unkomprimierte Dateien und Bilder, die geladen werden, obwohl sie nicht sichtbar sind.

Nutzen Sie moderne Formate wie WebP oder AVIF, liefern Sie passende Größen für mobile und Desktop-Geräte aus, komprimieren Sie ohne sichtbaren Qualitätsverlust und setzen Sie Lazy Loading für nicht-kritische Bilder ein. Besonders kritisch sind Hero-Bilder, Slider und große Hintergrundbilder, weil sie oft früh geladen werden und die wahrgenommene Geschwindigkeit prägen.

3. Videos nur einsetzen, wenn sie wirklich helfen

Videos können erklären, verkaufen und Vertrauen aufbauen. Sie können aber auch der größte Emissionstreiber einer Seite sein, besonders wenn sie automatisch laden oder als dekoratives Hintergrundelement verwendet werden.

Vermeiden Sie Autoplay-Hintergrundvideos, wenn ein statisches Bild denselben Zweck erfüllt. Laden Sie Videos erst nach Interaktion, nutzen Sie Posterbilder, kurze Clips, effiziente Encodings und mobile Varianten. Wenn ein Video keine Entscheidung unterstützt, sollte es nicht automatisch übertragen werden.

4. JavaScript und Third Parties reduzieren

JavaScript erhöht nicht nur die Datenmenge. Es beansprucht auch CPU-Zeit auf Endgeräten und kann Interaktionen verzögern. Besonders problematisch sind historisch gewachsene Tag Manager, A/B-Testing-Skripte, Chat-Widgets, Heatmaps, Social Embeds, Werbenetzwerke und Personalisierungstools.

Erstellen Sie ein Inventar: Welche externen Domains werden geladen? Welches Skript hat welchen Zweck? Wer ist verantwortlich? Wird das Tool auf jeder Seite gebraucht? Entfernen Sie alte Tags, laden Sie Skripte nur dort, wo sie notwendig sind, und bevorzugen Sie datensparsame Alternativen.

5. Core Web Vitals mitdenken

Nachhaltige Websites überschneiden sich stark mit Performance-Arbeit. Relevante Core-Web-Vitals-Signale sind unter anderem Largest Contentful Paint (LCP), Interaction to Next Paint (INP) und Cumulative Layout Shift (CLS).

LCP leidet oft unter schweren Hero-Bildern, langsamer Serverantwort oder blockierenden Ressourcen. INP leidet häufig unter zu viel JavaScript und teuren Interaktionen. CLS entsteht durch instabile Layouts, nachladende Medien oder schlecht reservierte Flächen. Wer diese Ursachen reduziert, verbessert nicht nur Performance-Signale, sondern häufig auch die Ressourceneffizienz.

6. Fonts und CSS schlank halten

Webfonts wirken klein, können aber viele Requests und zusätzliche Daten verursachen. Prüfen Sie, wie viele Schriftfamilien, Schnitte und Stile wirklich gebraucht werden. Nutzen Sie WOFF2, Subsetting und eine saubere Font-Loading-Strategie. In manchen Fällen sind Systemfonts die bessere Wahl.

Auch CSS sollte nicht ungeprüft wachsen. Große Frameworks, ungenutzte Styles, blockierendes CSS und komplexe Animationen erhöhen Wartungsaufwand und Rendering-Kosten. Halten Sie Komponenten einfach, entfernen Sie ungenutzte Regeln und priorisieren Sie Layout-Stabilität.

7. Caching, Kompression und CDN sauber konfigurieren

Eine nachhaltige Website überträgt nicht bei jedem Besuch dieselben Daten neu. Browser-Caching, Server-Caching, Kompression und ein sinnvoll eingesetztes CDN können Datenübertragung, Serverlast und Ladezeit reduzieren.

Wichtig ist die passende Konfiguration. Statische Assets sollten lange cachebar sein, versionierte Dateien können aggressiver gecacht werden, HTML braucht vorsichtigere Regeln. Ein CDN kann helfen, Inhalte näher an Nutzern auszuliefern, muss aber in Bezug auf Datenschutz, Drittlandtransfer und Anbieterwahl bewusst bewertet werden.

8. Green Hosting verifizieren

Green Hosting ist ein wichtiger Infrastrukturhebel. Es reicht aber nicht, wenn ein Anbieter nur allgemein mit Nachhaltigkeit wirbt. Besser ist ein überprüfbarer Nachweis, zum Beispiel über öffentlich nachvollziehbare Green-Hosting-Daten oder klare Angaben zu Strombezug und Rechenzentrumsbetrieb.

Trotzdem macht Green Hosting eine Website nicht automatisch nachhaltig. Eine sehr schwere Website mit vielen unnötigen Skripten bleibt ineffizient. Die robuste Kombination lautet: verifizierbar bessere Infrastruktur plus schlanke Seiten.

9. Content und Nutzerreise fokussieren

Nachhaltiges Webdesign bedeutet auch: weniger Ablenkung. Jede zusätzliche Sektion, jedes Karussell, jedes Pop-up und jedes eingebettete Tool sollte eine klare Aufgabe haben. Wenn Inhalte Nutzern nicht helfen, erzeugen sie oft nur mehr Daten, mehr Komplexität und mehr Wartung.

Eine gute nachhaltige Website ist deshalb nicht leer oder langweilig. Sie ist präzise. Sie zeigt, was Nutzer brauchen, führt schneller zur Entscheidung und vermeidet dekorativen Ballast.

10. Wiederkehrend messen und berichten

Ein einzelner Audit ist nur eine Momentaufnahme. Websites verändern sich durch neue Kampagnen, neue Landingpages, neue Bilder, Plugin-Updates, Tracking-Tags und externe Tools. Nachhaltigkeit im Web braucht deshalb einen Betriebsrhythmus.

Definieren Sie eine Baseline für wichtige Seitentypen, prüfen Sie monatlich oder nach größeren Releases, dokumentieren Sie die größten Treiber und halten Sie fest, welche Maßnahmen umgesetzt wurden. Für Stakeholder ist ein nachvollziehbarer Trend oft wertvoller als eine scheinbar exakte Einzelzahl.

Messung, Grenzen und Reporting

CO₂-Schätzungen für Websites sind nützlich, aber nicht absolut. Unterschiedliche Tools können zu unterschiedlichen Ergebnissen kommen, weil sie verschiedene Systemgrenzen, Annahmen und Datenquellen verwenden. Das ist kein Grund, Messung zu vermeiden. Es ist ein Grund, Methodik offen zu erklären.

Gutes Reporting nennt mindestens URL, Zeitpunkt, Methode, Systemgrenzen, wichtigste Treiber, umgesetzte Maßnahmen und Veränderung über Zeit. Es vermeidet absolute Klimaaussagen. Insbesondere sollte ein Bericht nicht behaupten, eine Website sei "klimaneutral", wenn diese Aussage auf Offsetting beruht oder den Scope nicht unmittelbar, klar und überprüfbar erklärt.

Wer tiefer einsteigen möchte, findet im Artikel Website Carbon Footprint messen eine genauere Erklärung zu Page Weight, Emissionsschätzungen, Green Hosting und Asset-Treibern. Der Guide Web Carbon Measurement und Reporting beschreibt zusätzlich einen konservativen Workflow für Baseline, Reduktion, Verifikation und Reporting.

Praktische Checkliste

• Startseite und wichtigste Landingpages nach Page Weight prüfen.
• Größte Bilder, Videos, Skripte und Fonts identifizieren.
• Hero-Medien kritisch bewerten.
• Bilder in modernen Formaten und passenden Größen ausliefern.
• Autoplay-Videos vermeiden.
• Third-Party-Skripte inventarisieren und reduzieren.
• Core Web Vitals mit LCP, INP und CLS prüfen.
• Browser-Caching, Server-Caching, Kompression und CDN-Konfiguration kontrollieren.
• Green-Hosting-Status verifizieren.
• Carbon- und Performance-Checks regelmäßig wiederholen.

Fazit

Eine nachhaltige Website entsteht nicht durch einen einzelnen Badge und nicht durch eine einzelne CO₂-Zahl. Sie entsteht durch bessere Entscheidungen im Design, in der Technik, in der Infrastruktur und im laufenden Betrieb.

Der beste Weg ist pragmatisch: schwere Seiten finden, große Treiber reduzieren, Infrastruktur prüfen, Fortschritt dokumentieren und vorsichtig kommunizieren. So wird digitale Nachhaltigkeit konkret - und verbessert gleichzeitig Performance, Nutzererlebnis, Suchqualität und Vertrauen.