Nachhaltigkeit geht auch digital! Wir verraten dir Grundprinzipien, praktische Tipps und grüne Technologien, die dir dabei helfen, den Energieverbrauch deiner Website zu reduzieren und gleichzeitig deine Usability zu verbessern.
Was ist nachhaltiges Webdesign?
Nachhaltiges Webdesign befasst sich mit der Gestaltung und Entwicklung von Websites, die sowohl ökologisch als auch ökonomisch effizient sind. Hierbei steht die Minimierung des Energieverbrauchs sowie die Maximierung der Lebensdauer digitaler Produkte im Vordergrund. Zum Beispiel kann eine Website ökonomisch nachhaltig sein, wenn sie für Entwickler*innen leichter erweiterbar ist. Zum Aspekt Ökologie zählt unter anderem die Ladezeit, die dank einiger Tricks verkürzt werden kann und Ressourcen spart.
Durch die Verfolgung dieser Ziele soll und kann der ökologische Fußabdruck des Internets reduziert werden.
Warum ist nachhaltiges Webdesign wichtig?
Serverfarmen, die Websites und andere Online-Dienste betreiben, benötigen enorme Mengen an Energie, meist aus fossilen Brennstoffen, und tragen somit zu einem erheblichen CO2-Ausstoß bei. Laut einer Studie gleicht sich der CO2-Ausstoß fast mit dem des gesamten globalen Flugverkehrs. Durch nachhaltiges Webdesign können wir dazu beisteuern die CO2-Emissionen zu reduzieren.
Aber nicht nur der Umwelt tut nachhaltiges Webdesign gut: Sorgfältig angewendet, kann diese Methode für Nutzer*innen zu einer positiveren Erfahrung im Internet führen. User*innen freuen sich über kürzere Ladezeiten und performantere Websites, was wiederum das Erlebnis auf der Website erheblich verbessert und so zu einer positiven Nutzungserfahrung beiträgt.
Grundprinzipien des nachhaltigen Webdesigns
Das World Wide Web Consortium (W3C) hat mit ihrer „Sustainable Web Design community group“ einige Empfehlungen, die Web Sustainability Guidelines, entwickelt, die Unternehmen dabei helfen sollen, ihre Produkte und Services nachhaltiger anzubieten.
Effizienz
Um die Effizienz beim Programmieren zu erhöhen, Fehler zu vermeiden und so für eine nachhaltigere Erfahrung zu sorgen, gibt es einige Möglichkeiten für Entwickler*innen.
Zunächst gilt es darauf achten, den Gebrauch von externen Bibliotheken wie jQuery zu reduzieren, wenn möglich. Natürlich ist es einfacher und schneller, Funktionalität in Form von vorhandenen Bibliotheken hinzuzufügen. Jedoch kann die Nutzung die Menge an Code vergrößern, die Enduser*innen bei der Nutzung herunterladen müssen, was dazu führt, das sich Verarbeitungszeiten erhöhen. Entwickler*innenteams, die kritische Anwendungen bauen und mehrmals am Tag neue Versionen ihres Codes veröffentlichen, können dadurch einiges an Rechenleistung sparen.
Eine sauber geführte Dokumentation eigener Software kann ebenso zu einem reduzierten Aufwand auf der Seite der Entwickler*innen sowie zu einem ökonomisch nachhaltigerem Ergebnis für Unternehmen führen. Die Entwickler*innen können nämlich dann effizienter arbeiten, wenn sie Fehler und Sachverstände anhand einer Dokumentation schneller verstehen, anstatt zunächst die Funktionsweise des Codes über mehrere Dateien hinweg nachvollziehen zu müssen. Das spart wertvolle Zeit und hochwertige Ressourcen.
Langlebigkeit
Websites sollten so gestaltet werden, dass sie einfach aktualisiert und gewartet werden können, um ihre Lebensdauer zu verlängern und den Bedarf an häufigen Neuentwicklungen zu reduzieren.
Beispielsweise kann beim Erstellen einer Website auf ein komplett individualisiertes System verzichtet und stattdessen eine fertige Content-Management-Lösung wie TYPO3 oder WordPress genutzt werden. Das spart Einarbeitungszeit für neue Mitarbeiter*innen und ermöglicht kontinuierliche Updates, die bei fertigen Content-Management-Systemen (CMS) in der Regel mit einem Klick durchgeführt werden können.
Ein weiterer wichtiger Faktor kann das Design einer Website sein. Heutzutage setzen die meisten Websites auf einen Schalter, mit dem sich zwischen hellem und dunklem Farbschema wechseln lässt (Light Mode und Dark Mode). Durch eine dunklere Darstellung der Website sparen Monitore und Smartphones Energie, was die Lebensdauer der Geräte erhöhen kann.
Barrierefreiheit
Eine Website sollte barrierefrei sein. Das bedeutet, dass alle Nutzer*innen, unabhängig von ihren technischen Möglichkeiten oder körperlichen Einschränkungen, auf die Inhalte zugreifen können.
Beispiele zur Herstellung der Barrierefreiheit beinhalten Einstellungen zur Farbanpassung auf der Website für Menschen mit Sehschwäche oder Farbenblindheit, grundlegende Unterstützung für Screenreader (zum Beispiel durch Definieren von alt-Texten für Bilder) und das Vermeiden von Anti-Patterns, wie zum Beispiel das Deaktivieren von Rechtsklick oder Hinderung am Kopieren von Texten.
Übrigens: Ab Sommer 2025 tritt ein Gesetz zur Stärkung der Barrierefreiheit (Barrierefreiheitsstärkungsgesetzt, BFSG) in Kraft und gilt für alle Produkte, die nach dem 28.06.2025 in den Verkehr gebracht werden. Mehr zum Gesetz in unserem Blogartikel.
Um dich besser auf die neue Verordnung vorzubereiten, schau gerne in unseren Blogartikel über Barrierefreiheit.
Bereitstellung der Website
Während der Entwicklung sollten Serverressourcen gespart werden. Oft benötigt man nicht nur einen Server, auf dem später die fertige Website laufen soll. Um Fehler in der Produktionsumgebung zu vermeiden, laden Entwickler*innen ihren Code nicht selten auf Testserver, um die Funktionalität unter ähnlichen Gegebenheiten zu überprüfen. Um den Energieverbrauch und Ressourccennutzung gering zu halten, sollte man Testserver bewusst und sparsam einsetzen.
Wenn es um die Veröffentlichung einer Website geht, ist es wichtig zu wissen, dass man einen Server von angemessener Kapazität und Performance wählt und die Infrastruktur dem Bedarf der Website anpasst. Ein kleiner Blog benötigt keinen Hochleistungsserver, wenn die Website die Leistung nicht voll ausschöpfen kann.
Ebenso überflüssig ist in vielen Fällen die beliebte „Edge“ Infrastruktur, bei der eine Seite auf verschiedene Server weltweit verteilt wird, um den Weg zwischen User*innen und Server und damit die Ladezeiten gering zu halten. Eine kleine Website im deutschsprachigen Raum zum Beispiel wird das nicht benötigen. In dem Fall reicht es, wenn man einen einzigen Server in Deutschland nutzt.
Komprimierung & Caching
Jede Datei auf einem Server nutzt Speicherplatz und diese werden bei jedem Websitebesuch an die User*innen übertragen. Bei größeren Dateien müssen entsprechend mehr Daten gesendet werden. Das dauert nicht nur länger, sondern zu viele speicherintensive Dateien füllen schnell den Server, sodass zusätzlicher Speicherplatz konfiguriert und mehr Ressourcen genutzt werden müssen.
Man sollte darauf achten Bilder, Videos und andere Dateien vor dem Hochladen zu komprimieren. Eventuell nutzt man ein Content-Management-System, welches diese Aufgabe automatisch übernimmt. Durch die Bereitstellung von komprimierten Medien können auch Menschen mit schlechterer Internetverbindung ohne Schwierigkeiten die Inhalte laden.
Für alle Dateien sollte außerdem Caching implementiert werden, wenn nicht schon vorhanden. Caching bewirkt, dass unveränderte Dateien nicht erneut vom Enduser heruntergeladen werden müssen. Das führt unter Anderem zu schnelleren Ladezeiten bei wiederholten Website-Besuchen und dazu, dass Websites auch in Gebieten mit unzureichender Internetverbindung funktionieren können. Für ein Unternehmen bedeutet das weniger Datentransfer und damit eine Kostensenkung beim Hostinganbieter.
Unsere Tipps zur nachhaltigen Gestaltung von Websites
Du hast nun erkannt, welche Vorteile nachhaltiges Webdesign mit sich bringt und möchtest deine Website dahingehend anpassen? Hier sind einige heiße Tipps, mit denen das sicher gelingt.
Optimierung von Medien
Eine einfache Methode zur nachhaltigen Verbesserung einer Website ist das Komprimieren von Bildern, Videos und anderen Medien. Dazu braucht man nicht einmal Programme wie Photoshop, sondern man kann dafür kostenlose Tools wie TinyPNG nutzen. Vor dem Komprimieren sollte man die Bilder erst mal in der Pixelgröße verkleinern – dies hilft am meisten, die Dateigröße zu verringern und die Ladezeiten zu verbessern. Lies dazu am besten unseren Artikel „Bildgrößen im Web“ und erfahre, welche Auflösungen deine Bilder haben sollten.
Reduzierung von http-Anfragen
Jede Anfrage an den Server kostet Energie. Durch das Zusammenfassen von CSS- und JavaScript-Dateien und die Nutzung von Caching-Techniken kann die Anzahl der Anfragen reduziert werden. Durch Caching von Dateien müssen diese bei weiteren Website-Besuchen nicht erneut vom Server angefragt werden.
Wenn du ein Content-Management-System nutzt, ist es wahrscheinlich, dass dort bereits Caching eingerichtet ist und du nichts weiter tun musst. In den meisten Fällen gibt es auch Erweiterungen für dein CMS, die mit einem Klick installiert werden können. Wende dich im Notfall an die IT-Abteilung.
Effiziente Programmierung
Halte dich an moderne und bewährte Coding-Standards und -Techniken und achte auf verständlichen und modularen Code. Das reduziert nicht nur den Aufwand der Einarbeitung neuer Mitarbeiter*innen, sondern verbessert auch die Pflegbarkeit der Website und ermöglicht eine schnellere und unkomplizierte Erweiterung dieser.
Bei größeren Anwendungen sollten Entwickler*innenteams in Betracht ziehen, Tests für ihren Code zu schreiben, um Fehlern bei häufigen Veröffentlichungszyklen vorzubeugen.
Grünes Hosting
Wähle einen Hosting-Anbieter, der auf erneuerbare Energien setzt und seine Ressourcen nachhaltig verwendet. Du kannst ganz einfach unter The Green Web Foundation nachschauen, ob ein Hosting-Anbieter erneuerbare Energien nutzt, oder ob eine Website bei einem nachhaltigen Anbieter gehostet wird.
Umweltbewusste Hosting-Anbieter haben ihren Strom- und Wasserverbrauch ständig im Auge, recyclen Hardware und Wärme und achten generell auf eine Langlebigkeit der Server, um Kosten und Ressourcen einer Neuanschaffung zu sparen. Ein zertifiziert nachhaltiger Hoster ist zum Beispiel Hetzner. Das Gute ist, dass es keine Unterschiede im Preis und bei den Features im Vergleich zu anderen Hosting-Anbietern gibt.
Viele Konzerne, darunter auch Google und Microsoft, setzen auf nachhaltiges Hosting und agieren umweltbewusst.
Fazit und Ausblick
Nachhaltiges Webdesign ist nicht nur ein Trend, sondern eine Notwendigkeit in unserer zunehmend digitalisierten Welt. Es bietet eine Möglichkeit, den ökologischen Fußabdruck des Internets zu verringern und gleichzeitig die Benutzungsfreundlichkeit und Effizienz von Webseiten zu verbessern. Unternehmen und Entwickler*innen, die sich auf nachhaltiges Webdesign konzentrieren, können nicht nur Kosten sparen, sondern auch einen positiven Beitrag zum Umweltschutz leisten.
In der Zukunft wird nachhaltiges Webdesign eine immer größere Rolle spielen, da sich die Technologie weiterentwickelt und das Bewusstsein für Umweltthemen wächst. Die Integration von Nachhaltigkeitsprinzipien in den Entwicklungsprozess wird zur Norm werden und hoffentlich dazu beitragen, eine umweltfreundlichere digitale Landschaft zu schaffen.
