Was ist grünes (UX/UI) Webdesign?

Wäre das Internet ein Land wäre es an dritter Stelle des globalen Energieverbrauchs. An dritter Stelle! Als ich das das erste Mal gehört habe, war es für mich unvorstellbar, aber dann doch ziemlich klar. In diesem Artikel gebe ich einen kleinen Einstieg in die Thematik des nachhaltigen Webdesigns und was wir tun können, um das Web grüner zu machen.

Was ist denn bitte so ungrün an Webseiten?

Mit jedem Klick auf einer Webseite wird ein Dialog mit Datenservern gestartet. Die sitzen irgendwo in der Welt, werden mit wahnsinnig viel Strom gespeist und mit Unmengen an (oft trinkbarem) Wasser gekühlt. Das führt zu CO2-Emissionen und das nicht zu wenig. Eine einzelne Webseite verbraucht im Schnitt 1,76g CO2 pro Page View. Und jetzt rechne‘ mal, wie viele Page Views man im Monat so hat… Jep, das sind ganz schön viele.

Sind wir alle Heuchler?

Wir fahren mit dem Fahrrad zur Arbeit, trennen brav unseren Müll, kaufen so wenig Lebensmittel in Plastik wie möglich, knallen dann aber unsere Webseiten und Social Media Kanäle mit Bildern, Videos, Tracking/Analyse-Tools, verrückten Schriftarten und fancy Animationen voll. Kann man machen, macht uns aber definitiv nicht grüner.

Was heißt denn jetzt genau nachhaltiges Webdesign?

#1 Dein Hoster

Dein Hoster bezieht Ökostrom und ist energieeffizient. Meine Lieblinge sind derzeit Petricore, Biohost und greensta. Wenn man bedenkt, dass mit Standard-Strom 475g CO2e/kWh emittiert werden und mit Strom aus erneuerbaren Ressourcen nur 33,4g CO2e/kWh, finde ich das schon ziemlich dufte (natürlich mit einigen Abhängigkeiten).*

#2 Dein technisches Setup

Dein technisches Setup ist so datensparsam wie möglich. Dazu gehört die Komprimierung von CSS und JavaScript, aber auch die Nutzung von Caching oder das Weglassen von Cookies und vielen Requests und Redirects. Wenn du WordPress benutzt, gibt es dafür viele coole Plugins und Themes mit super Performance.

#3 Dein Content

Dein Content ist genauso datensparsam. Du setzt Bilder und Videos ganz gezielt ein, komprimierst sie und lässt die Videos nicht per Autoplay spielen. Du benutzt Systemschriften (#arialforreal) und optimierst deine Klickpfade. Wir sind ja nicht im Supermarkt, wo die Regale so stehen, dass du eigentlich durch alle laufen musst, um deinen Einkauf zu erledigen. Wie gesagt, jeder Klick sorgt für mehr CO2. Und das versuchst du ja vielleicht schon mit anderen Teilen deines Businesses oder deiner Produkte zu reduzieren. Dann sprich auch genau darüber und lass das in deine Inhalte mit einfließen.

#4 Deine E-Mails

Deine E-Mail-Signatur ist nur Text (nix mit Bildern) und deine Newsletter bestehen hauptsächlich aus Text (wenig Bilder). Die meisten Empfänger haben eh das automatische Anzeigen von Bildern ausgestellt und sehen nur weiße Kästen. Einige Empfänger löschen deine E-Mails auch nur noch oder markieren sie als Spam, weil sie zu faul sind den Newsletter abzubestellen oder keine Möglichkeit dafür gefunden haben. Schmeiß sie raus. Die drücken nur deine Öffnungsrate und damit in „intelligenten“ Postfächern die Anzeige deiner E-Mails.

#5 Deine Partner

Du schaust mal, was deine Lieferant:innen und Kooperationspartner:innen so machen. Sind sie nachhaltig? Was tun sie für’s Klima? Schaffe Bewusstsein oder finde andere Partner:innen. Auch in deinem direkten Umfeld.

#6 Dein digitales Office

Du checkst mal, wie nachhaltig dein digitales Office ist. Wie grün ist deine Cloud gehostet (Tipp: Dropbox und Adobe sind es nicht)? Nutzt du Ecosia als Suchmaschine? Wie oft sortierst du E-Mails und deine Dateien aus? Brauchst du so viele Dateiversionen im Archiv? Wie sieht’s bei digitalen To Do-Listen aus? Nimmst du unseren schönen blauen Planeten Erde in deine Designprozesse mit rein? Zum Beispiel als Persona oder Zielkunde? Falls nicht, probier’s gerne mal aus. Für mich war das echt ein riesiger Shift.

Was sind denn Benefits des nachhaltigen Webdesigns?

Weil wir vor allem versuchen die Datenmengen klein zu kriegen, springen für deine Website super minimale Ladezeiten raus, dadurch eine schnellere Seite, happy Nutzer, mehr Käufe, ein besseres Ranking in Suchmaschinen (weil sie uns für die niedrigen Ladezeiten belohnen) und bessere Findability. Also ich find das ziemlich knorke.

Resumé

Ich find’s toll und ich hoffe, du auch. Wenn wir alle etwas grünere Webseiten bauen, dann können wir viel bewegen. Und das muss auch gar nicht öde aussehen, farblos und ohne Bilder. Es geht nur darum, die Sachen komprimiert und gezielt einzusetzen, statt alles vollzuknallen.

Und jetzt?

Falls dir der Beitrag gefallen hat, dann teile ihn doch gerne mit Kolleg:innen, Mitarbeiter:innen und Freund:innen. Das würde mir wahnsinnig helfen, das Thema bekannter zu machen und inspiriert hoffentlich mehr Designer:innen grünere Webseiten zu gestalten.

Hab noch einen wunderschönen Tag!

Deine Sandy

Share this article

Hi, ich bin Sandy, die Autorin dieses Blogs und UX/UI-Designerin mit 10+ Jahren Erfahrung. 2019 hab ich Green the Web gegründet, um meine Leidenschaft, Ideen und Visionen für ein nachhaltiges Web mit Changemakern wie dir zu teilen. Lass uns auf LinkedIn oder auf Instagram @greentheweb connecten, diskutieren und Ideen auszutauschen.

Abonniere den Newsletter

Erhalte die neuesten nachhaltigen Web-Hacks, Business Insights und News direkt in deinen Posteingang. Normalerweise einmal im Monat.

Nachhaltige Best Practices

Werde inspiriert durch leichtgewichtige, nutzerfreundliche, ästhetische und nachhaltige UX/UI Designs des Webs.

Meine Lieblings-Ressourcen

Scroll durch meine liebsten Artikel, Studien, Podcasts, Vorträge, Communities, Bücher und Tools über nachhaltiges Webdesign.