Während ich dies schreibe, versammeln sich Weltführer in Glasgow zur COP26, der internationalen Klimakonferenz, um den katastrophalen Klimawandel zu stoppen (oder zumindest zu verlangsamen), indem sie versprechen, die Abhängigkeit ihrer Länder von fossilen Brennstoffen zu beenden. Nur die Zeit wird zeigen, ob sie erfolgreich sein werden (Spoiler: es sieht nicht gut aus), aber eines ist immer klarer: Wir in der Tech-Industrie können die Köpfe nicht länger in den Sand stecken. Wir alle haben die Verantwortung, sicherzustellen, dass unser Planet für zukünftige Generationen bewohnbar bleibt.
Es ist nur zu leicht, den Klimawandel vom Web zu trennen. Schließlich sitzen die meisten von uns Tag für Tag an unseren Schreibtischen. Wir sehen die Emissionen, die das Web produziert, nicht physisch. Aber laut einem Bericht der BBC im Jahr 2020 ist das Internet für 3,7 % der weltweiten Kohlenstoffemissionen verantwortlich – Tendenz steigend. Das bringt unsere Branche auf eine Stufe mit der gesamten Flugverkehrsindustrie. Wenn ich also darüber nachdenke, was wir tun können, um unsere Websites „besser“ zu machen, denke ich sofort daran, wie wir sie für den Planeten besser machen können. Denn ob es uns gefällt oder nicht, die Kohlenstoffemissionen, die von unseren Websites produziert werden, beeinträchtigen nicht nur unsere eigenen Nutzer, sondern auch all die Menschen, die unsere Websites *nicht* nutzen. Wir haben zweifellos noch viel Arbeit vor uns.
Es ist kein Geheimnis, dass Webseiten immer aufgeblähter werden. Die durchschnittliche Größe einer Webseite beträgt inzwischen rund 2 MB. Das sind schlechte Nachrichten für Nutzer, deren Surferlebnis auf langsamen Verbindungen bei solch aufgeblähten Seiten sehr schlecht sein wird, aber es ist auch schlecht für den Planeten. Schlechte Leistung und Energieintensität gehen oft Hand in Hand. Glücklicherweise bedeutet dies, dass die Behebung des einen auch weit zur Behebung des anderen beiträgt – es ist ein Gewinn für beide Seiten. Was also ist eine Sache, die wir tun können, um die Umweltauswirkungen unserer Websites zu verbessern (und damit auch die Leistung für unsere Nutzer zu verbessern)?
Mein Vorschlag ist, dass wir unseren Websites ein Kohlenstoffbudget setzen müssen.
Performance-Budgets in der Webentwicklung sind keine neue Idee und gehen in vielerlei Hinsicht Hand in Hand mit Kohlenstoffbudgets. Die Optimierung der Leistung sollte sich im Allgemeinen positiv auf die Energieeffizienz Ihrer Website auswirken. Aber ein quantifizierbares Kohlenstoffbudget hilft uns auch, jeden Aspekt unserer Website durch die Linse der Nachhaltigkeit zu betrachten und kann uns helfen, Aspekte zu berücksichtigen, die ein reines Performance-Budget allein nicht abdecken würde.
Wie können wir beginnen, ein Kohlenstoffbudget für unsere Seite zu berechnen? Die Berechnung der Kohlenstoffmenge, die von einer Webseite erzeugt wird, ist schwierig, da viele Faktoren zu berücksichtigen sind: Es gibt den Energieverbrauch während der Entwicklung, die Rechenzentren, die unsere Dateien hosten, die Datenübertragung selbst, der Stromverbrauch der Geräte unserer Endnutzer und mehr. Es wäre praktisch unmöglich, jedes Mal eigene Berechnungen durchzuführen, wenn wir eine Website erstellen. Aber der Website Carbon Calculator von Wholegrain Digital, der den Kohlenstoff-Fußabdruck einer gegebenen Website schätzt, gibt uns einen guten Ausgangspunkt, um über diese Dinge nachzudenken.
Nehmen wir die COP26-Website als Beispiel. Wenn wir diese Seite durch den Carbon Calculator laufen lassen, erhalten wir einige ziemlich schockierende Ergebnisse: Die Seite ist schmutziger (d.h. kohlenstoffintensiver) als 94 % der vom Tool getesteten Webseiten. Bei der Inspektion der Startseite in DevTools sehen wir, dass die gesamte Seite rund 6,4 MB übertragene Daten wiegt – weit über dem Durchschnitt, aber leider nicht ungewöhnlich. Eine weitere Untersuchung zeigt, dass JavaScript von Social-Media-Einbettungen (einschließlich YouTube-Video-Einbettungen) zu den schlimmsten Übeltätern auf der Startseite gehört und erheblich zum Seitenumfang beiträgt. Fershad Irani hat diese detaillierte Analyse verfasst, in der die Bereiche aufgeführt sind, in denen die Seite Mängel aufweist und was dagegen getan werden kann. (Bis vor ein paar Tagen betrug die Gesamtgröße 8,8 MB, einschließlich eines 3-MB-PNG-Bildes. Dank Fershads Arbeit, der das COP26-Team darauf aufmerksam gemacht hat, wurde das Bild nun durch eine viel kleinere Version ersetzt.)
Indem wir verstehen, welche Elemente unseres Designs die größten Auswirkungen auf die Leistung haben, können wir verstehen, wo einige unserer größten Kohlenstoffeinsparungen liegen könnten, und beginnen, Kompromisse einzugehen. Das Kohlenstoffbudget muss für jede Seite anders sein – Seiten, die viel Bewegung und interaktive Inhalte erfordern, verbrauchen beispielsweise zwangsläufig mehr Ressourcen. Aber vielleicht könnten wir für eine einfache Webseite wie diese unter 1g Kohlenstoff pro Seitenaufruf anstreben? Wenn wir bedenken, wie viele Seitenaufrufe eine Seite wie COP26 während der Konferenz ansammeln würde, könnten dies erhebliche Einsparungen bedeuten.
Sobald wir identifizieren können, wo mögliche Kohlenstoffeinsparungen liegen, können wir etwas dagegen unternehmen. Der Artikel von Wholegrain Digital „17 Wege, Ihre Website energieeffizienter zu gestalten“ ist ein guter Ausgangspunkt. Ich empfehle auch, Sustainable Web Design von Tom Greenwood für einen praktischen Leitfaden zur ganzheitlichen Reduzierung der Umweltauswirkungen der von uns erstellten Seiten zu lesen. Die Webseite Sustainable Web Design bietet einige hervorragende Entwicklungsressourcen.
Um Kunden davon zu überzeugen, die Idee eines Kohlenstoffbudgets zu akzeptieren, ist es gut, mit den Core Web Vitals als Gesprächseinstieg zu beginnen. Mit Tools wie Lighthouse können wir sehen, welche Aspekte unserer Seite die größte Auswirkung auf die Leistung haben und wie sich die Core Web Vitals darauf auswirken. Die Auswirkung dieses Codes auf die Leistung Ihrer Kundenseite (die sich auf das Google-Suchranking auswirken kann) könnte ausreichen, um sie zu überzeugen.
Es wäre großartig, wenn Google (und andere branchenführende Unternehmen) hier die Führung übernehmen und Kohlenstoffberechnungen in Tools wie Lighthouse integrieren würden. Indem sie diese Informationen prominent platzieren, könnten sie eine wichtige Rolle dabei spielen, Entwicklern die Möglichkeit zu geben, umweltbewusstere Entscheidungen zu treffen – und zu zeigen, dass sie Taten folgen lassen. (Es gibt tatsächlich ein offenes GitHub-Issue dazu.) Vielleicht brauchen wir auch eine Art branchenweite Zertifizierung, wie in diesem Artikel von Mike Gifford untersucht wird.
Es gibt noch viel mehr, was wir tun können, um den Kohlenstoff-Fußabdruck unserer Seiten zu verbessern. Es ist an der Zeit, dass die Webindustrie diesen Weckruf beherzigt. In den Worten von Greta Thunberg
Niemand ist zu klein, um einen Unterschied zu machen.
Also, einverstanden, aber... macht meine Webseite, auch wenn sie so groß wie 2 MB ist (würde ich nie tun), einen großen Unterschied im Vergleich zu einem 4K-Video auf Netflix? Ich sage nicht, dass es sich nicht lohnt, aber ich vermute, dass Streaming (Video und zunehmend Gaming und Bildschirmfreigabe bei der Arbeit) den Löwenanteil dieser Zahl ausmacht.
Nach dieser Logik könnte man viele unzusammenhängende Dinge vergleichen und zu dem Schluss kommen, dass nichts es wert ist. Erstens: Kleine Aktionen addieren sich, wenn sie von einer großen Anzahl von Menschen durchgeführt werden. Zweitens: Es geht nicht nur um heruntergeladene Bytes, da nicht alle Bytes gleich sind – die Verarbeitung einer JS-Datei ist energieintensiver als die eines gleich großen Bildes. Ich habe keine Analyse darüber, wie eine einfache Webseite mit dem Streaming eines Videos vergleichbar ist, aber denken Sie andererseits an die Netflix-Homepage und wie viele Leute sie besuchen. Diese könnte viel effizienter gestaltet werden und einen großen Einfluss haben. Sie könnten auch (richtig) grünes Hosting wählen. Es gibt riesige Einsparungen zu erzielen, und die Diskussion darüber sowie die Demonstration dessen, was möglich ist (ja, auch mit einer kleinen Webseite), kann dazu beitragen, Druck auf Unternehmen auszuüben, die Umwelt in den Online-Diensten, die sie entwickeln, zu priorisieren.
Aber Netflix bemüht sich, seinen Stack CO2-neutral zu halten – https://about.netflix.com/en/sustainability
Warum sollten Sie das nicht auch tun?
Hallo Michelle, das habe ich für dich geschrieben. Du musst es nicht als Kommentar veröffentlichen. https://www.usecue.com/blog/the-website-carbon-calculator/
Vielen Dank für Ihren Artikel Joost, er ist sehr aufschlussreich. Ich denke, es ist wichtig, diese Gespräche zu führen und alle Behauptungen zu prüfen, während wir uns gleichzeitig nach Kräften bemühen, die Dinge zu tun, die wir kontrollieren können (wie Sie es offensichtlich mit Ihrer eigenen Seite tun).
Sie werden mehr sparen, wenn Sie keine Staffel einer TV-Sendung auf Netflix schauen, als Ihre Website zu optimieren. Wenn es Ihnen wirklich wichtig ist – wie wäre es damit?
Ich sage nicht, dass Webseiten nicht optimiert werden sollten, aber das ist kein gültiger Grund. Es gibt viele andere gültigere, reale Gründe.
Ein offensichtlicher Unterschied ist, dass jemand, der eine Show auf Netflix nicht schaut, auf etwas verzichtet. Die Optimierung Ihrer Website verbessert tatsächlich das Nutzererlebnis, sodass sie *weniger* verzichten muss – weniger Zeit.
Nicht, dass man nicht auf Dinge für die Umwelt verzichten sollte, aber wenn man eine positive Umweltauswirkung erzielen kann, ohne dass die Verbraucher auf etwas verzichten müssen, ist das ein No-Brainer.
Danke für diesen Artikel! Es ist ein wichtiges und interessantes Konzept, darüber nachzudenken, und ich freue mich darauf, mehr Diskussionen darüber zu verfolgen! Ich liebe auch die Idee von benutzerdefinierten Performance-Budgets, um unterschiedliche Prioritäten und Ziele zu integrieren.
Das ist jenseits von lächerlich. Genau wie das Greenwashing-Treffen COP26. Pflanzen Sie mehr Bäume, die diese Konzerne unendlich fällen und in diesen leeren Meetings mit keinem Wort erwähnen, aber bereitwillig mich und andere Durchschnittsbürger für Unsinn wie CO2 besteuern. Pflanzen nutzen CO2 und produzieren Sauerstoff. Wir atmen es aus. Kreis des Lebens! Jesus!
Ich stimme Ihnen vollkommen zu. Die Leute streben 2-MB-Websites an, wenn der Aufstieg des Streamings unglaublich ist und an einem Tag viel mehr Bandbreite verbraucht als Millionen von kleinen persönlichen oder Unternehmenswebsites in einem Jahr.
Immer auf kleine Entitäten drängen, anstatt die Giganten zu optimieren.
Ich stimme auch zu 100 % zu.
Letztendlich geht es bei der „grünen Bewegung“ mehr um geopolitische Macht und Geld, angetrieben von offensichtlicher Heuchelei, mit einer Fülle von Beispielen: Sehen Sie die Privatflugzeuge der Teilnehmer von jedem „Klimagipfel“, die Analyse dieser „Wholegrains“-App, geschrieben von Joost van der Schee in den obigen Kommentaren, ganz zu schweigen von der Lächerlichkeit der „Lösung“, ein Bild auf der Summit-Homepage auszutauschen.
Wie viele E-Mails/Telefonate/Texte/Nachrichten hat es gedauert, bis die Betreuer der Summit-Website dieses EINE Bild ausgetauscht haben? Oh bravo! Die haben Sie sicher erwischt! Wen kümmert es, wie viele „Kohlenstoffgramm“ Sie bei diesem Unterfangen produziert haben… es ist der „Gedanke“, der zählt! richtig?… Richtig?
Es sind Dinge wie diese, die die Kultur der Softwareentwicklungsbranche durchdringen, die mich fast dazu bringen, meinen Beruf zu verabscheuen.
Absolut einverstanden – das ist ökologische Hysterie vom Feinsten. Optimieren Sie für den Endbenutzer, und Sie werden eine effizientere Website haben. Vielleicht verbraucht sie weniger Energie, aber wen kümmert's? Abgesehen von den normalen Optimierungen für UX & Leistung lohnt sich der Aufwand nicht.
Sie sind auf Hacker News und machen einen Unterschied, tatsächlich meiner Meinung nach. https://news.ycombinator.com/item?id=29488456
Danke fürs Posten und dass Sie selbst eine schlanke Seite gemacht haben!
Ich stimme dem, was Sie geschrieben haben, vollkommen zu. Ich hoffe, dieser Beitrag erreicht mehr Menschen, da dies wirklich ein interessanter Beitrag war.
Leistung IST wichtig. Benutzererlebnis ebenfalls. Der Versuch, Ihre Website zu verbessern, ist also ein edles und tatsächlich nützliches Unterfangen, das ich nur von ganzem Herzen unterstützen kann, und WENN es tatsächlich einen kleinen Beitrag zur Umwelt leistet, umso besser.
Aber ein „Kohlenstoffbudget“ für eine Website ist nur Tugendsignalisierung, völlig nutzlos und – wage ich zu sagen – schädlich, da es den Leuten das Gefühl gibt, etwas Gutes zu tun und ihr kollektives Gewissen zu entlasten.
Vielleicht wären sie, wenn dies nicht der Fall wäre, eher bereit, Druck auf Politiker auszuüben – denn dort liegt das eigentliche Problem. Der Klimawandel erfordert kollektiven Druck auf Politiker und Regierungen.
Wir können alle unsere Seiten auf 1 KB reduzieren, nur mit dem Fahrrad pendeln und täglich einen Baum pflanzen – aber das wird immer noch völlig irrelevant sein (auch wenn es sich tatsächlich summiert, aber in einem vernachlässigbaren Ausmaß, erdweit), wenn man bedenkt, wie viele Treibhausgase China, Indien, Russland und die USA jede Sekunde ausstoßen.
Zusammenfassend lässt sich sagen: Ja, machen Sie Websites leistungsfähiger und benutzerfreundlicher. Aber wenn Sie behaupten, es sei für die Umwelt, signalisieren Sie nur Tugend und tun wahrscheinlich mehr Schaden als Nutzen; bitte, hören Sie auf.
Mir sind ein paar Websites bekannt, die versuchen, Kohlenstoffemissionen zu reduzieren.
https://solar.lowtechmagazine.com
Sein Server wird mit Solarenergie betrieben (mit der Benutzeroberfläche, die den verbleibenden Batteriestand anzeigt), Bilder sind von geringer Qualität (mit dem Retro-Gefühl einer Halbtontextur) und Schriften sind die Standardeinstellungen des Browsers. (Details finden Sie unter „Wie man eine Lowtech-Website erstellt“.)
Aber es liest sich immer noch angenehm, Artikel zu lesen (eigentlich angenehmer als viele Websites meiner Meinung nach).
https://formafantasma.com/
Diese verwendet Arial und Times New Roman, bietet einen Dunkelmodus und hat keine auffälligen Bilder oder Videos. (Details finden Sie auf dieser Seite der Website.)
Dennoch wirkt sie auf mich elegant, inspiriert von der Ästhetik eines guten alten Buchsatzes.