Was ist nachhaltiges Webdesign?

Die Umweltbelastung einer durchschnittlichen Website

Du surfst im Internet und öffnest eine Website. Es wird ein Video abgespielt, Google Analytics, ein Facebook-Pixel, ein Instagram-Feed, und 20 Bilder geladen. Kennt man, oder? Das ist nicht nur nervig, sondern es werden beim Laden einer durchschnittlichen Website auch etwa 0,8 Gramm CO2-Äquivalente pro Seitenaufruf ausgestoßen. Bei einer Website mit 10.000 monatlichen Aufrufen summiert sich das auf jährlich etwa 102 kg CO2e, wie der Website Carbon Calculator v3 schätzt.

Um dir einen Vergleich zu geben, wie viel 102 kg CO2e in anderen Alltagskontexten entsprechen, sind hier ein paar Beispiele:

1. Autofahrt: Um 102 kg CO2 zu emittieren, müsstest du etwa 565 km mit einem Dieselauto mit einem durchschnittlichen Verbrauch von 5,5 l/100 km fahren. Das entspricht in etwa einer Fahrt von Wien nach Caorle.
2. Bio-Rindfleisch-Produktion: Das Produzieren von 4,7kg Bio-Rindfleisch emittiert etwa 102 kg CO2e.
3. Flug: Ein einfacher Flug von Wien (VIE) nach München (MUC) in der Economy Class über eine Distanz von etwa 400 km verursacht für einen Reisenden ungefähr 161 kg CO2 (also knapp 59 kg mehr).

Wenn das Internet, ein Land wäre, wäre es der viertgrößte Umweltverschmutzer weltweit.

Mehr als du gedacht hättest, oder? Aber woran liegt das?

Neben video-basierten Plattformen wie TikTok oder Instagram haben sich auch klassische statische Websites im Laufe der Zeit stark weiterentwickelt. Was früher mit reinem HTML, CSS und JavaScript programmiert wurde, ist heute häufig durch CMS-Systeme und Pagebuilder wie WordPress, Squarespace oder Wix abgelöst worden.

Diese Pagebuilder bieten einfache Lösungen, mit denen du schnell und ohne Webentwickler*in Änderungen vornehmen kannst – das klingt erstmal praktisch. Doch diese Bequemlichkeit hat ihren Preis. Ein zentrales Problem sind die unzähligen vorgefertigten Features: Mit einem Klick lässt sich eine Slideshow einfügen, mit dem nächsten ein Instagram-Feed oder ein Video. Was nach Flexibilität klingt, bringt aber oft einen Berg an unnötigem Code mit sich – und das bleibt nicht ohne Folgen.

Viele dieser Funktionen werden von Nutzer*innen (oft ohne tiefere technische Kenntnisse) eingebunden, ohne dabei zu bedenken, welche Auswirkungen sie auf die Ladegeschwindigkeit der Website haben. Zu viele Features führen schnell zu langsamen Ladezeiten und einem aufgeblähten Seitengewicht – was nicht nur die Nutzererfahrung verschlechtert, sondern auch den Energieverbrauch in die Höhe treibt.

Warum ist das wichtig für dein Unternehmen?

Nachhaltiges Webdesign – auch als „Green Web Design“ bekannt – zielt darauf ab, den Energieverbrauch und die CO2-Emissionen deiner Website zu reduzieren. Durch die bewusste Auswahl an Funktionen, das gezielte Optimieren von Bildern und den Einsatz von Techniken wie Lazy Loading können wir das Gewicht der Seite drastisch senken. Verzichten wir zusätzlich auf unnötige Einbettungen wie Social-Media-Feeds, reduziert sich der Datenverbrauch und die Performance steigt.

Möchtest du wissen, wie nachhaltig diese Website wirklich ist? Scroll einfach nach unten! Am Ende der Seite findest du den Website-Carbon-Score, der dir zeigt, wie viel CO2 pro Seitenaufruf ausgestoßen wird. 🌿

CO2-Fußabdruck unseres digitalen Lebens

Websites sind aber nur ein Teil des Big Pictures. Unsere Online-Aktivitäten verursachen erhebliche CO2-Emissionen. Wir können unseren digitalen Fußabdruck verringern, indem wir auf erneuerbare Energien setzen, die Streaming-Qualität anpassen und ältere Geräte länger nutzen. Schau dir die Infografik von Statista an, um zu sehen, wie viel CO2 durch Online-Aktivitäten entsteht.

Mehr Infografiken finden Sie bei Statista

Die Rolle von Unternehmen und Selbstständigen in der Schaffung nachhaltiger Websites

Unternehmen und Selbstständige spielen eine entscheidende Rolle bei der Reduktion von CO2-Emissionen im Web. Unternehmen verfügen oft über größere Ressourcen und Kapazitäten, um ihre Webpräsenzen gezielt umweltfreundlicher zu gestalten. Dazu gehört die Wahl eines Hosting-Anbieters, der auf erneuerbare Energien setzt, sowie die Optimierung der Website, um den Energieverbrauch und das Datenvolumen zu reduzieren.

Für Selbstständige mag es vielleicht herausfordernder erscheinen, ähnliche Maßnahmen zu ergreifen, aber auch hier können schon kleine Schritte, wie die Optimierung von Bildern oder der Verzicht auf unnötige Funktionen, einen großen Unterschied machen.

Praktische Schritte zu einem grüneren Web

Ob du als Selbstständige*r oder Unternehmen agierst – hier sind einige konkrete Schritte, die du ergreifen kannst, um deine Website nachhaltiger zu gestalten:

Praktische Schritte zu einem grüneren Web

Wie sieht das in der Praxis aus? Hier sind einige Schritte, die du oder dein Unternehmen ergreifen können:

Vorschläge für umweltfreundlicheres Webhosting und Webdesign

• Umweltfreundliches Hosting: Wähle einen Webhost, der erneuerbare Energien nutzt, um die Umweltbelastung deiner Website zu minimieren.
• Optimierte Inhalte: Stelle sicher, dass alle eingebetteten Elemente auf deiner Website notwendig sind. Überprüfe regelmäßig Texte, Skripte und Mediendateien auf ihre Relevanz und reduziere die Dateigrößen von Bildern und Videos, um die Ladezeiten zu verbessern.
• Bildoptimierung und -resizing: Zusätzlich kannst du Bilder vor dem Hochladen durch den Einsatz moderner Formate wie WebP und AVIF optimieren. Verwende srcsets, um verschiedene Bildgrößen für unterschiedliche Gerätegrößen bereitzustellen und die Datenmenge zu verringern.
• Schlanker Code: Verbessere die Benutzererfahrung und spare Energie durch die Verwendung von klar strukturiertem und effiziente Code und entferne ungenutzte Code-Segmente.
• Vermeidung von eingebetteten Social Media-Feeds und externen Tools: Reduziere die Datenlast durch das Vermeiden unnötiger externer Einbindungen.
• Lazy Loading: Implementiere Techniken wie Lazy Loading, um Bilder nur dann zu laden, wenn sie benötigt werden.
• Website Carbon Badge: Integriere ein Tool, das den CO2-Verbrauch pro Seitenaufruf berechnet, um das Bewusstsein für die Umweltauswirkungen zu schärfen und den CO2-Fußabdruck über den Lebenszyklus der Seite zu verfolgen.
• Dunkle Farbschemata: Nutze dunkle Farbschemata, die auf OLED-Bildschirmen weniger Energie verbrauchen.

Interessiert an einer nachhaltigeren Website?

Lass uns deine Website gemeinsam unter die Lupe nehmen und herausfinden, wie deine Website nachhaltiger werden kann. Für eine individuelle Beratung besuche meine Kontaktseite – ich freue mich darauf, von dir zu hören!