Nachhaltigkeit bei digitalen Entwicklungen auf dem Prüfstand
Durch die Entwicklung moderner Technologien entstehen fortlaufend zahlreiche neue Digitalisierungs-Möglichkeiten. Der digitale Wandel vereinfacht viele Prozesse in Wirtschaft und Gesellschaft. Bei allen entstehenden Vorteilen bleibt jedoch oft unbeachtet, dass die Nutzung digitaler Technologien auch negative Einflüsse haben kann (Rebound-Effekt). Besonders die Auswirkungen auf unsere Umwelt bleiben bislang häufig gänzlich unberücksichtigt.
Digitale Technologien sind aktuell bereits für 3.8 % der globalen Treibhausgasemissionen verantwortlich. Diese Menge ist vergleichbar mit der Menge an Treibhausgasemission, die durch den Flugverkehr verursacht wird (3,5 %). Zukünftig werden die durch digitale Technologien verursachten Treibhausgasemissionen weiter steigen. Darüber hinaus wird der Energiebedarf des Internets jährlich um 9 % wachsen.
Vor diesem Hintergrund muss Digitalisierung und nachhaltige Entwicklung dringend zusammengeführt werden. Die Verschmelzung ist notwendig, um eine digitale, nachhaltige Zukunft zu ermöglichen.
Insbesondere das Internet spielt in diesem Zusammenhang eine wesentliche Rolle. Die durchschnittliche Größe einer Website im Jahr 2020 betrug 2 Megabyte. Dieser Wert stieg durchschnittlich von 2017 bis 2020 um 37,0 %.
Der einmalige Aufruf einer Webseite mit der Größe von 2 Megabyte erzeugt ca .2 g CO2. Dies ist für sich genommen ein niedriger Wert. Wird die Seite jedoch 10.000-mal aufgerufen, entspricht die produzierte Menge an CO2 ungefähr der Menge, die sieben Bäume in einem Jahr absorbieren können. Ein Elektroauto könnte mit dieser Energie 1,8 km fahren.
Im November 2020 wurde allein die Seite amazon.de, eine Seite mit ca. 3 Megabyte, 609 Millionen mal aufgerufen. Dies entspricht ca. 26,726 Tonnen CO2.
Die Summe aller Webseiten-Besuche sowie die Größe der Webseiten haben große Auswirkungen auf den CO2-Ausstoß. Die Anzahl der Webseiten-Aufrufe möglichst gering zu halten, widerspricht in aller Regel jedoch dem vorrangigen Zweck einer Website. Die Webseiten-Größe lässt sich hingegen gut beeinflussen, ohne geschäftsschädigend zu sein. Aber wird das Thema Nachhaltigkeit von Webseiten in Unternehmen schon berücksichtigt? Hierzu habe ich eine Analyse mit stichprobenartig ausgewählten Unternehmen in meinem Umfeld durchgeführt.
Nachhaltigkeitsanalyse von Unternehmen
In meiner Zeit als Berater für digitale nachhaltige Entwicklung habe ich viele Webseiten auf Geschwindigkeit und Nachhaltigkeit untersucht. Dabei habe ich die Erfahrung gemacht, dass das Bewusstsein für die Bedeutung einer nachhaltigen und schnellen Webseite in kleinen und mittelständigen Unternehmen (KMU) noch kaum vorhanden ist. Schnelligkeit und Nachhaltigkeit werden bei der Realisierung von Web-Projekten häufig noch nicht als Software-Qualitätsmerkmal angewandt. Dass Unternehmen aber mit einer schnellen und nachhaltigen Seite sogar ihr Online-Geschäft ankurbeln könnten, ist vielen nicht bewusst. Darüber, wie dies gelingt, habe ich einen Blogbeitrag mit dem Thema “Wie kann die Webseiten-Geschwindigkeit die Abschlussrate verbessern?” geschrieben.
In meiner Analyse für diesen Blogbeitrag habe ich vier Unternehmen und drei Behörden hinsichtlich ihres CO2-Fußabdrucks und der Webseiten-Geschwindigkeit untersucht. Ich möchte diese Unternehmen und Behörden keineswegs an den Pranger stellen. Ziel ist es, Potenziale und Möglichkeiten für die Geschwindigkeit und die Nachhaltigkeit der Seiten sichtbar zu machen.
CO2-Testergebnisse
Alle Daten für meine Analyse des CO2-Fußabdrucks der untersuchten Webseiten habe ich mithilfe von websitecarbon und den Chrome DevTools ausgewertet. Die Angaben können variieren, wenn die Tests wiederholt werden, da die Werte immer den aktuellen Stand widerspiegeln.
| Website | Seitengröße mit Tracking-/Werbeblocker (unkomprimiert) | Seitengröße ohne Tracking-/Werbeblocker (unkomprimiert) | Seitengröße mit Tracking-/Werbeblocker (komprimiert) | Seitengröße ohne Tracking-/Werbeblocker (komprimiert) | g CO2 / Seitenaufruf | Anzahl der Bäume (1) | e-Kilometer (2) |
|---|---|---|---|---|---|---|---|
| https://www.bmu.de/ | 4,8 MB | 4,8 MB | 2,3 MB | 3 MB | 1,68g | 10 Bäume | 2,716 km (424 kWh) |
| https://bayern.de/ | 4,7 MB | 4,7 MB | 3,4 MB | 3,9 MB | 2,11g | 12 Bäume | 3,419 km (534 kWh) |
| https://www.kempten.de/ | 4,3 MB | 4,3 MB | 3,2 MB | 3,2 MB | 2,28g | 13 Bäume | 3,684 km (576 kWh) |
| https://auew.de/ | 7,2 MB | 7,8 MB | 5,1 MB | 5,3 MB | 2,68g | 15 Bäume | 4,782 km (747 kWh) |
| https://www.feneberg.de/ | 5,9 MB | 6,6 MB | 5,4 MB | 5,6 MB | 3,40g | 19 Bäume | 5,504 km (860 kWh) |
| https://www.allgaeuer-zeitung.de/ | 7,8 MB | 14,5 MB | 6,7 MB | 10,4 MB | 0,81g | 5 Bäume | 1,307 km (204 kWh) |
| https://www.soloplan.com/ | 27,2 MB | 27,4 MB | 24,3 MB | 24,3 MB | 14,52g | 80 Bäume | 23,475 km (3.668 kWh) |
1 Die Menge an Kohlenstoff, die X Bäume in einem Jahr absorbieren (10.000 Seitenaufrufe).
2 Die Menge an Strom, die benötigt wird, um ein Elektroauto X km weit zu fahren (10.000 Seitenaufrufe).
Der Blick auf die Analyseergebnisse zeigt, dass alle Unternehmen die durchschnittliche Seitengröße von 2 MB weit übersteigen. Selbst die am besten bewertete Seite ist mit 5,4 MB sehr groß und weit davon entfernt nachhaltig zu sein. Dies lässt annehmen, dass nachhaltige Webentwicklung in den Unternehmen bislang noch kein Schwerpunkt ist.
CO2-Emission pro Seitenaufruf in Gramm
Die einzige Website, die von websitecarbon.com eine gute (grüne) Bewertung erhält, ist https://www.allgaeuer-zeitung.de/. Ich habe sie nicht grün markiert, weil sich die Menge an Daten, die nach der Cookie-Zustimmung geladen werden um fast 40 % vergrößert. Dies berücksichtigt webseitecarbon.com nicht, obwohl sich das Nachladen der Daten erheblich auf die Nachhaltigkeit einer Webseite auswirkt. Die nachfolgende Grafik macht dies deutlich.
Seitengröße mit/ohne Adblocker
Während die Nutzung eines Adblockers bei allen anderen Unternehmen keinen großen Unterschied für das geladene Datenvolumen macht, verdoppelt sich der Wert bei www.allgaeuer-zeitung.de fast.
Webseiten-Geschwindigkeit / Web Performance / Page Speed Ergebnisse
Die Daten für die Analyse der Webseiten-Geschwindigkeit habe ich mithilfe von webpagetest.org, PageSpeed Insights, web.dev/measure ausgewertet.
| Webseite | LCP | Kritischer Rendering-Pfad CSS/JS | FCP | Geschwindigkeitsindex | Kosten |
|---|---|---|---|---|---|
| https://www.bmu.de/ | 5.365s | 255 KB JS + 74 KB CSS = 329 KB | 1.3s | 3.889s | $$$$$ |
| https://bayern.de/ | 3.5s | 371 KB JS + 83 KB CSS = 454 KB | 2.7s | 1.697s | $$$$$ |
| https://www.kempten.de/ | 2.6s | 703 KB JS + 51 KB CSS = 754 KB | 1.9s | 3.718s | $$$$$ |
| https://auew.de/ | 3,7s | 1,1 MB JS + 116 KB CSS = 1,2 MB | 3s | 4,720s | $$$$$ |
| https://www.feneberg.de/ | 2,8s | 292 KB JS + 51 KB CSS = 343 KB | 1,5s | 7,0s | $$$$$ |
| https://www.allgaeuer-zeitung.de/ | 3.1s | 1.7 MB JS + 131 KB CSS = 2,1 MB | 2.2s | 2.776s | $$$– |
| https://www.soloplan.com/ | 8.8s | 909 KB JS + 209 KB CSS = 1,1 MB | 8.4s | 13.123s | $$$$$ |
Die Metriken Largest Contentful Paint und First Contentful Paint sind Indikatoren für große Elemente auf der Webseite. Fast alle Seiten haben einen hohen LCP-Wert. Dies lässt vermuten, dass die Unternehmen Bilder mit großen Datenmengen auf ihren Webseiten nutzen.
Nebenbei ist der LCP für Unternehmen interessant. Da er zu den Core Web Vital von Google zählt, hat er einen Einfluss auf das Ranking in der Googlesuche.
Newsletter
Hey, du bist dabei, meinen kostenlosen Newsletter direkt in deine Mailbox zu bekommen. Ich schreibe hauptsächlich über Tipps und Trends zur Webleistung. Gelegentlich erhältst du eine E-Mail über meine Workshops, den Datenschutz und die Barrierefreiheit im Internet.
Der kritische Rendering-Pfad beschreibt den Prozess, den der Browser braucht, um alle nötigen Daten zu laden, bevor er das erste Pixel anzeigen kann. Sind die geladenen Daten groß, dauert der Prozess lange. Die Seite ist dadurch nicht schnell und weniger nachhaltig. Ein guter Wert für alle kritischen Ressourcen (insbesondere CSS, JS) ist 170 KB. Die Werte für den kritischen Rendering-Pfad sind bei allen untersuchten Webseiten zu groß.
Die typischen Probleme großer Webseiten
Es gibt viele Faktoren, die zu einer großen Webseite führen. Einige kommen besonders häufig vor. So werden auf Webseiten häufig Daten übertragen, die nicht benötigt werden sowie Daten, die nicht komprimiert sind. Zudem handelt es sich bei den meisten besonders großen Datenmengen um Bilder, insbesondere Hero-Bilder. Diese sollen die Aufmerksamkeit der Seitenbesucher auf sich ziehen und sie zu einer bestimmten Aktion bewegen. Letztlich tragen externe Schriften, CSS und JavaScript ihren Teil dazu bei, dass die Webseite größer, langsamer und weniger nachhaltig ist.
Die Ursachen für die genannten Problemstellen sind unterschiedlich. Manchmal ist es mangelndes Wissen während der Entwicklung, manchmal lassen Webdesign, Inhalt und Layout dem Entwickler nicht die Wahl, vollständig nachhaltig zu arbeiten. Jeder, der an der Entwicklung der Seite beteiligt ist, hat auch einen Einfluss auf die Seitenladezeit und die Nachhaltigkeit.
Selbst wenn bei einem Webprojekt die Geschwindigkeit und die Größe der Webseite als wichtige Faktoren berücksichtigt werden, kann man nicht davon ausgehen, dass die Webseite auch in Zukunft schnell und nachhaltig bleibt. Jede Webseite, an der gearbeitet wird, ist grundsätzlich von Regression bedroht. Regressionen zu verhindern, kann manchmal wirkungsvoller und weniger aufwendig sein als die Optimierung von Geschwindigkeiten.
Wie kommt es zur Regression? Manchmal sind das Webdesign und die Entwicklung nachhaltig, aber der Content-Editor oder Website-Besitzer fügen ein großes Bild hinzu. Zusätzlich wird der Einfluss von Drittanbieter-Skripten weit unterschätzt.
Ich habe einen Blogbeitrag über Verwaltung von Drittanbieter-Skripten auf Webseiten geschrieben, wenn du mehr darüber wissen möchtest.
Strategien für schnelle und nachhaltige Webseiten
Die Nachhaltigkeit eines neuen Webprojekts muss bereits bei der Konzeption von Anfang an mitgedacht werden. Mach’ die Geschwindigkeit und die Nachhaltigkeit zu Abnahmekriterien für dich selbst, für den beauftragten Web-Entwickler oder die beauftragte Agentur.
Frage dich beispielsweise schon während des Designprozesses, ob du das große Hero-Bild wirklich brauchst. Ist es unverzichtbar, um Geschäftsziele zu erreichen, indem das Nutzerverhalten konkret beeinflusst wird oder sieht es nur gut aus?
Wenn deine Website bereits online ist, empfiehlt sich eine zuverlässige Geschwindigkeits- und Datenanalyse. Du kannst auch einen Experten damit beauftragen. Ausgehend von den Analyseergebnissen wird ein Konzept erstellt, in dem Optimierungen, Messungen, Geschwindigkeitsüberwachung, Infrastruktur oder Verantwortlichkeiten für Geschwindigkeit und Nachhaltigkeit beschrieben werden.
Überwache fortlaufend die Geschwindigkeit sowie die Größe deiner Webseite. Richte dir kontinuierliche Tests für deine Webseite ein. Zudem kannst du deinen eigenen Workflow für die Geschwindigkeitsüberwachung erstellen. Du kannst zum Beispiel tägliche, wöchentliche oder monatliche Berichte senden lassen oder einen Entwickler informieren, wenn ein Performance-Problem auf deiner Seite auftritt. Wenn du Hilfe bei der fortlaufenden Überwachung der Seitengeschwindigkeit benötigst, kannst du dich gerne bei mir melden.
Für die technische Umsetzung einer nachhaltigen Webseite habe ich eine Anleitung für 10 Quick-Wins, die du in 5 Minuten anwenden kannst, erstellt. Außerdem habe ich eine Blog-Serie geschrieben, um deine Webseite für ein schnelles erstes Anzeigen zu optimieren. Dort erfährst du beispielsweise, wie man den kritischen Rendering-Pfad so klein wie möglich halten kann.
Generell findest du viele Tipps und Tricks zu den Themen Geschwindigkeit und Nachhaltigkeit auf meinem Blog. Kontaktiere mich gerne, wenn du Hilfe brauchst.
Fazit
Die Auswirkungen des digitalen Wandels auf die Umwelt sind groß und werden in Zukunft weiter steigen. Bislang ist das Bewusstsein für die Bedeutung von Nachhaltigkeit bei digitalen Entwicklungen noch unzureichend vorhanden. Alle Professionen, die an der Entwicklung einer Webseite beteiligt sind, haben Einfluss auf die Nachhaltigkeit der Seite. Häufig sind es ähnliche Faktoren, die die Seitengröße unnötig erhöhen. Mit den skizzierten Strategien lässt sich eine nachhaltige Webseite leichter realisieren und pflegen.
Dein Marc