Das klimafreundlichste Contao Theme aller Zeiten.

'Juliane Arzberger'
Juliane Arzberger

100% performant. 100% accessible. 100% SEO optimiert. 0.1g CO₂ emitting.

Das Internet verbraucht Strom – und zwar eine Menge. Denn Rechenleistung, Kühlung und unterbrechungsfreie Stromversorgung von Tausenden Servern kosten täglich Unmengen an Energie und verursachen einen enormen CO₂ Ausstoß. Eine durchschnittliche Webseite produziert 1,76 Gramm CO₂ pro Seitenansicht. Für eine Website mit 10.000 monatlichen Seitenaufrufen sind das 211 kg CO₂ pro Jahr!¹

Nachhaltigkeit ist kein Trend sondern unsere Lebensversicherung


Im gleichen Zeitraum bindet ein Baum im Schnitt ca. 11 Kg CO₂. Es müssten also ca. 20 Bäume gepflanzt werden, um das online CO₂ einer einzigen Website durch Bäume wieder zu kompensieren!² Puh - das hört sich ziemlich viel an, haben wir uns gedacht. Und wollten etwas dagegen tun, denn Nachhaltigkeit ist längst kein Trend mehr sondern die Lebensversicherung zukünftiger Generationen.
Also beschäftigten wir uns mit der Konzeption von energieeffizienten Webseiten und entwickelten das klimafreundlichste Webseiten-Theme aller Zeiten. Mit einem durchschnittlichen CO₂ Ausstoß von 0,1g (darum nannten wir das Theme „0.1“) pro Seitenansicht verursacht dieses im Jahr bei 10.000 Seitenaufrufen nur 12kg CO₂ – diese Emmission kann innerhalb eines Jahres von nur einem Baum kompensiert werden. Klingt schon besser? Ja, aber das ist noch längst nicht alles.

Energieeffizientes Webdesign ist mehr als nur umweltfreundlich


Wir haben festgestellt: Eine energieeffizientere Webseite ist immer auch eine bessere Webseite. Denn fast alle Dinge, die wir tun können, um Webseiten energieeffizienter zu machen, optimieren diese automatisch auch in anderen Hinsichten: Sei es besseres SEO, schnellere Performance oder höhere Nutzerfreundlichkeit:

Energieeffizientes Webdesign ist performant, weil es nur so viele Inhalte wie nötig verwendet. Der Einsatz von ressourcenintensiven Formaten, wie Videos und Bildern wird kritisch hinterfragt und Texte sind knapp und informationsorientiert verfasst.
Energieeffizientes Webdesign ist nutzerfreundlich, da es seine Zielgruppe kennt. Es verfügt über klare Strukturen sowie kurze Wege und macht deshalb Spaß.
Energieeffizientes Webdesign ist suchmaschinenoptimiert, weil es sowohl der Suchmaschine als auch dem Nutzer hilft, die gesuchten Informationen schnellstmöglich zu finden.

Eine energieeffizientere Webseite ist im Grunde genommen immer auch eine bessere Webseite.

 

Wie spart man Energie mit einer Webseite?

Vermeidung von Datenmüll durch Informationsreduktion

Die auf einer Webseite dargestellten Informationen auf das Wesentliche zu reduzieren birgt enorme Vorteile: Weniger Inhalte bedeuten weniger Code und schnellere Ladezeit. Neben der Performance steigt auch gleichzeitig die Usability, denn Nutzer finden schnell das was sie suchen. Hierzu gehört auch effizientes Copywriting, welches Informationen klar und verständlich präsentiert. Zudem sollte der Einsatz von ressourcenintensiven Inhalts-Formaten, wie Videos und Bildern kritisch hinterfragt werden: Bringt das Medium wirklich einen Mehrwert für den Nutzer?
Somit wird die Nutzung des Webs einfacher und effizienter für alle: der Nutzer spart Zeit, der Anbieter Datenmüll und der Planet profitiert von der eingesparten Energie.

JS & co. machen Webseiten schöner & interaktiver - aber auch verschwenderischer

Einerseits erhöht die Verwendung von Javascript die Dateigröße der Webseite und andererseits erfordert dessen Verarbeitung mehr Ressourcen auf dem Endgerät des Benutzers. Dies erhöht die CPU-Auslastung, was wiederum den Energieverbrauch des Geräts erhöht. Deshalb macht es Sinn sich zu fragen, ob die gewünschte Interaktion, Funktionalität oder Animation vielleicht auch mit effizienteren Technologien, wie CSS, realisierbar wäre.
Ähnlich verhält es sich mit Webfonts, denn diese wirken sich ebenfalls oft negativ auf die Dateigröße der Webseite aus. Wer Daten, Ladezeiten und Energie sparen will, sollte Systemschriften in Betracht ziehen. Wir meinen jedoch nicht Arial oder Times New Roman - die Rede ist von Schriften, die Hausherren ihrer Betriebssysteme sind und für moderne, hochauflösende Bildschirme konzipiert wurden: Apple, Google & Microsoft haben mit ihren Systemschriften San Francisco, Roboto & Segoe performante, schöne und wirkungsvolle Fonts geliefert, welche auf Webseiten ebenfalls einen guten Job machen.

Neue & alte Techniken - WebP & Dark Mode

Die technische Optimierung von Bilddateien verbessert die Ladezeit und somit auch die Benutzerfreundlichkeit einer Webseite und senkt zudem deren Energieverbrauch. Es gibt viele gute Online-Tools, um Bilddateien ohne sichtbaren Qualitätsverlust zu komprimieren und in ein effizientes Dateiformat, z.B. WebP, zu konvertieren. Außerdem helfen responsive Image Elemente wie picture und srcset um für jedes Endgerät die passende Bildgröße auszuliefern.
Dunkle Webseiten waren eine der ersten Techniken, die vor vielen Jahren zum online Energiesparen populär wurden. Sie verschwanden jedoch mit dem Aufkommen von LCD-Bildschirmen. Mit neuen OLED-Bildschirmen, die wieder jedes Pixel einzeln beleuchten, ist dies jedoch wieder eine praktikable Technik, um den Energieverbrauch auf Endgeräten zu reduzieren. Heute zieht der Dark Mode in immer mehr Apps und Geräte als Standard Feature zum Energiesparen ein.

0.1 – an Energy Saving Contao Theme

Das 0.1 Contao Theme ist unser Ansatz im Bereich Webentwicklung, um das Internet umweltfreundlicher zu gestalten. Mit Features, die allen einen echten Mehrwert liefern: Webseitenbesuchern, -anbietern und dem Planeten.

 

  • Ohne ressourcenintensive Inhaltsformate
    Die im Theme verwendeten Icons & Bilder sind allesamt leichtgewichtige SVGs oder Bilder im effizienten WebP Format. Es werden keine unnötigen Iconfonts oder hochauflösende JPGs geladen.
  • Optimale User Experience (UX)
    Gute UX verlangt, dass Erlebnisse einwandfrei funktionieren, dass der Nutzer in der Lage ist, die Dinge zu finden, die er finden will und zudem noch Freude bei der Anwendung hat. Dies war unser Anspruch beim Design des Themes mit klaren Strukturen und freundlichen Funktionen.
  • Leichtgewichtiger Code
    Mit Leichtigkeit Energie zu sparen schafft das Theme durch schlanken, effizienten Contao-Code und dank des smarten CSS-Framework Spectre - dieses ist bei komprimierter Auslieferung lediglich 10kb groß.
  • Support neuster Versionen
    Das Theme unterstützt Contao 4.9 (bereits vor der Veröffentlichung) und setzt auf energieeffiziente Features wie LazyLoading und WebP. Zudem performt es am besten mit PHP 7.3 und höher, denn neuere Versionen von PHP sind meist nicht nur schneller, sondern verbrauchen auch weniger Serverressourcen und damit weniger Energie.
  • Systemschriften
    Im Theme werden keine Webfonts geladen. Es werden lediglich performante Systemschriften verwendet, die für moderne, hochauflösende Bildschirme konzipiert wurden. Und wir finden San Francisco, Roboto & Segoe machen einen guten Job ohne zu beschweren.
  • Dark Mode
    Der Dark Mode zieht in immer mehr Apps und Geräte als Standard Feature zum Energiesparen ein und fehlt natürlich auch nicht bei diesem Theme.
  • Performant
    Mit einen Performance-Score von 100% bei Lighthouse lässt unser Theme Nutzer nicht lange warten und läd mit unseren Demo Inhalten in 0.8s.
  • Ohne Javascript
    Alle interaktiven Features, Funktionen und Animation wurden ohne Javascript umgesetzt. Da JS ein echter Ressourcenfresser ist, verwendet das Theme stattdessen effizientere Technologien, wie Gehirnschmalz + einfaches CSS.
  • SEO optimiert
    Das Theme erreicht einen SEO-Score von 100%³ bei Lighthouse. Das freut Suchmaschinen, Nutzer und Betreiber.
  • Schlicht & flexibel
    Schlichtes, flexibles Design welches einen stimmigen Rahmen bildet aber dennoch genügend Spielraum für eigene individuelle Inhalte lässt
  • Aufkärung inklusive
    Inhalte, die über das wachsende „Online-Energieproblem“ informieren und Ansätze zu dessen Bekämpfung liefern. Es darf ausdrücklich gern alles gelesen & geteilt werden.

 

Es ist wichtig das Energieproblem der Webbranche ernst zu nehmen und anzugehen. Und das ist gar nicht so schwierig, denn es gibt viele Dinge, die wir tun können, um Verschwendung zu vermeiden und Effizienz zu erhöhen. Die meisten dieser Aktionen sind nicht grundlegend schwierig oder komplex, sie erfordern einfach ein bisschen Aufmerksamkeit und sorgfältige Überlegungen hinsichtlich Design, Inhaltserstellung, Entwicklung und Hosting.

Think big. Act now.

Jetzt energiesparende Webseite erstellen mit dem kostenlosen 0.1 Premium Contao Theme

 

Wenn du Fragen, Anmerkungen oder weitere Tipps zur Reduzierung des Energieverbrauchs von Webseiten hast, lass es uns wissen!

Quellen & Links

¹ CO₂ Ausstoss, einer durchschnittlichen Webseite https://www.websitecarbon.com/
² Wieviel CO₂ bindet ein Baum? https://rechneronline.de/co2-ausstoss/baum.php
³ SEO-Score von 100% https://lighthouse-dot-webdotdevsite.appspot.com/lh/html?url=https://0.1.pdir.dev

------------------------------------------------------------

Du möchtest nicht ständig immer wieder Templates kaufen und durchtesten müssen, sondern willst einfach gleich loslegen? Dann schau dir unser pdir+ Webtemplate-Paket an:

Zurück