Was ist nachhaltiges Webdesign und wie kann man es umsetzen?

Die Bedeutung von nachhaltigem Webdesign

Web-Technologie kann möglicherweise der Gesellschaft und der Umwelt zugute kommen, aber nur, wenn wir sie mit Bedacht einsetzen …

Da Nachhaltigkeit immer wichtiger wird, suchen viele Unternehmen nach Möglichkeiten, ihren CO2-Fußabdruck zu reduzieren. Nachdem sie Änderungen in ihren Abläufen vorgenommen haben, erscheint es logisch, dass ihre technologischen Auswirkungen der nächste Schritt sind

Die Umweltauswirkungen des Internets sind weithin bekannt und machen 3,7 % der weltweiten Emissionen aus. Daher versuchen immer mehr Designer, ihre Websites nachhaltig zu gestalten, um sicherzustellen, dass sie ihren Teil zum Schutz unserer Umwelt beitragen.

Wenn das Internet ein Land wäre, wäre es der viertgrößte Umweltverschmutzer. Nachhaltiges Web-Manifest

Dank technologischer Fortschritte wie dem Internet der Dinge können Entwickler nachhaltiges Design auf bisher unmögliche Weise in Ihr Zuhause oder Ihr Unternehmen integrieren! Einer der neuesten und am schnellsten wachsenden Bereiche des Webdesigns ist nachhaltiges Webdesign, das sich auf die Reduzierung des CO2-Fußabdrucks Ihrer Website und die Steigerung ihrer Energieeffizienz konzentriert.

Doch obwohl nachhaltiges Website-Design im Jahr 2023 ein beliebtes Gesprächsthema ist, herrscht immer noch einige Verwirrung.

In diesem Beitrag erkläre ich nachhaltiges Webdesign und wie Sie Ihre Website umweltbewusster gestalten können.

Lassen Sie mich zunächst einige häufig gestellte Fragen beantworten.

Was ist eine nachhaltige Website?

Nachhaltige Websites werden mit Blick auf die Zukunft der Menschen, unseres Planeten und auf Profit konzipiert. Sie werden mit erneuerbarer Energie betrieben und verbrauchen davon die geringste Menge. Darüber hinaus sind sie ethisch, wertschöpfend und nicht ausbeuterisch.

Warum sollten Websites nachhaltig sein?

Während es mittlerweile gängige Praxis ist, dass die Medien und Nutzer sozialer Medien den großen Ölkonzern als Hauptverursacher der Klimakrise anprangern und den Politikern vorwerfen, keine realistischen Klimaziele zu setzen, wird dem nicht viel Aufmerksamkeit geschenkt die Umweltauswirkungen des Internets – trotz seines rasanten Wachstums.

Technologie steht im Mittelpunkt unseres beruflichen und privaten Lebens. Die Zahl der vernetzten Geräte steigt und wird bis 2025 voraussichtlich 55,7 Milliarden erreichen.

Digitale Technologien sind für 4 % der Treibhausgasemissionen (THG) verantwortlich und ihr Energieverbrauch steigt jährlich um 9 %.

Das Internet verursacht jährlich 1,6 Milliarden Tonnen Treibhausgasemissionen. Um all diesen Kohlenstoff zu entfernen, müsste ein Drittel der weltweiten Landoberfläche mit ausgewachsenen Wäldern bedeckt werden!

Dieser Trend ist der Grund, warum wir umweltfreundliche Websites brauchen.

Was ist nachhaltiges Webdesign?

Nachhaltiges Webdesign bedeutet, Websites zu erstellen, um die Umweltbelastung zu minimieren, Energie zu sparen und Ressourcen effizient zu nutzen. Mit anderen Worten geht es bei nachhaltigem Webdesign darum, gute Websites für den Planeten zu schaffen.

Wie beeinflusst also das Website-Design die globalen Emissionen?

Eine aktuelle Studie hat gezeigt, dass die tägliche Bildschirmzeit seit 2013 um fast 50 Minuten pro Tag zugenommen hat und der durchschnittliche Amerikaner täglich 7 Stunden und 4 Minuten damit verbringt, auf einen Bildschirm zu schauen.

Während wir im Internet surfen, gibt es ein Problem, das viele nicht berücksichtigen – wie sich unsere Online-Aktivitäten auf die Umwelt um uns herum auswirken können. Website-Designs verursachen auf zwei Arten globale Emissionen: durch den Verbrauch von Strom oder anderen Ressourcen und durch den Ausstoß schädlicher Gase in die Atmosphäre durch ihren Betrieb. Hier kommt nachhaltiges Webdesign ins Spiel.

Die Antwort mag auf den ersten Blick vage erscheinen, aber sie betrifft alles von der Größe Ihrer Schriftarten bis hin zu den Bildern, die Sie auf Ihrer Website veröffentlichen möchten. Alles hat eine Wirkung, und diese kleinen Dinge summieren sich mit der Zeit, was sie zu einem erheblichen Faktor für die globalen CO2-Emissionen macht.

Der einfachste Weg, den Fußabdruck zu verringern, besteht darin, den Abfall beim Entwurf eines neuen Standorts oder bei der Wartung eines bestehenden Standorts zu minimieren. Im Folgenden werde ich einige Möglichkeiten skizzieren, wie Sie dies tun können.

Vorteile von nachhaltigem Webdesign

Nachhaltiges Webdesign schont die Umwelt und steigert effektiv die Konversionsraten. Grüne Websites konvertieren besser als nicht umweltfreundliche. Zu den bemerkenswerten Vorteilen nachhaltiger Webdesigns gehören:

Einfache und intuitive Benutzeroberfläche

Eine umweltfreundliche Website verfügt normalerweise über eine intuitive Benutzeroberfläche, die einfach zu navigieren ist. Benutzer fühlen sich nie verloren oder verwirrt darüber, wohin sie als nächstes gehen müssen. Dank des klaren, einfachen Layouts und der durchdachten Platzierung der Informationen auf der gesamten Website haben Besucher kein Problem damit, schnell zu finden, was sie suchen. Ein Unternehmen muss bei der Gestaltung seiner Website die Bedürfnisse seiner Benutzer im Vordergrund halten.

Höhere Geschwindigkeitsleistung

Da immer mehr Internetkonsumenten online auf Inhalte zugreifen, wird es für Unternehmen immer wichtiger, sicherzustellen, dass ihre Websites auf Mobilgeräte reagieren. Mobile Responsiveness stellt sicher, dass Websites bei korrekter Ausführung schneller auf Smartphones geladen werden, was die Kundenzufriedenheit erhöht.

Da die meisten mobilen Geräte außerdem mit Batteriestrom betrieben werden, müssen Unternehmen sicherstellen, dass ihr Standort diesen Geräten nicht unnötig Energie entzieht.

Suchmaschinenoptimierung (SEO)

Nachhaltige Webdesigns sind SEO-freundlich, da keine zusätzlichen Codeänderungen erforderlich sind, um auf den Ergebnisseiten von Suchmaschinen zu ranken. Somit verschafft Ihnen eine grüne Website einen Vorteil gegenüber Ihrer Konkurrenz.

Funktioniert gut auf verschiedenen Bildschirmgrößen

Was eine umweltfreundliche Website auszeichnet, ist ihre Fähigkeit, auf unterschiedlichen Bildschirmgrößen eine gute Leistung zu erbringen. Das Anzeigen von Inhalten stellt kein Problem dar, unabhängig davon, auf welchem ​​Gerät ein Besucher gerade surft.

Merkmale nachhaltigen Webdesigns

Die folgenden Beispiele zeigen eine Vielzahl nachhaltiger Webdesign-Techniken und -Funktionen, mit denen Sie schöne, effektive Websites erstellen können.

• Verwendet Minimalismus: Einer der wichtigsten Aspekte von nachhaltigem Webdesign ist Minimalismus. Sie können Websites erstellen, die schneller laden und weniger Ressourcen verbrauchen, indem Sie weniger Code, weniger Bilder und kleinere Dateien verwenden.
• Bilder optimieren: Bilder sind oft die schwersten Elemente auf einer Webseite, daher ist ihre Optimierung für das Web unerlässlich. Durch die Komprimierung wird sichergestellt, dass sie weniger Platz beanspruchen und effizient geladen werden, ohne den Rest der Seite zu verlangsamen.
• Verwendet CSS-Sprites: CSS-Sprites sind eine nachhaltige Webdesign-Technik, die mehrere Bilder in einer Datei kombiniert. Obwohl sie im Vorfeld mehr Arbeit erfordern, sparen sie auf lange Sicht Bandbreite, da alle Bilddaten an einem Ort gespeichert werden und nicht auf mehrere Seiten verteilt sind.
• Minimiert HTML-, CSS- und JavaScript-Ressourcen: Jedes Mal, wenn Ihre Website geladen wird, muss sie zusätzliche Serverdaten abrufen. Wenn Sie also diese Elemente reduzieren, wird Ihre Website schneller geladen. Anstatt beispielsweise ein externes Skript wie Google Analytics zu verwenden, verwenden Sie das integrierte Analysetool in WordPress. Und anstatt eine ganze Bibliothek mit Hunderten von Stylesheets zu importieren, importieren Sie nur das, was Sie zur effektiven Darstellung Ihrer Inhalte benötigen.
• Nutzt die Wiederverwendbarkeit von Code: Es ist wichtig, Webdesign nicht als einen einmaligen Prozess zu betrachten. Bei PixoLabo behalten wir den Überblick über alle von uns erstellten Skripte oder Vorlagen und verwenden sie nach Möglichkeit wieder.
• Eliminiert redundante Dateien: Websites verfügen häufig über redundante Dateien. Wenn Sie beispielsweise über eine index.html- und eine index.php-Datei verfügen, wird unnötiger Speicherplatz verschwendet und die Ladezeiten verlangsamt sich. Die Entwickler entfernen diese Dateien effektiv, was für weniger Speicherplatz und ein schnelleres Laden des Webs sorgt.
• Verwendet Rich Media verantwortungsvoll: Bei der Gestaltung Ihrer Website möchten Sie sich auf Inhalte und nicht auf Funktionen konzentrieren. Wenn Sie zu viele Funktionen hinzufügen, verlangsamen Sie Ihre Website, da sie bei jedem Laden mehr Code verarbeiten muss.
• Integriert vorgefertigte Lösungen: Für die häufigsten Website-Probleme gibt es viele vorgefertigte Lösungen. Sie sollten immer versuchen, eine Lösung zu finden, bevor Sie etwas selbst erstellen, wenn Sie dadurch Zeit und Energie sparen. WordPress verfügt beispielsweise bereits über Module zur Integration von Social-Media-Netzwerken wie Facebook, Twitter und LinkedIn – Sie müssen das Rad also nicht neu erfinden!

Verstehen Sie Ihren digitalen Fußabdruck

Der digitale Fußabdruck eines Unternehmens wächst, wenn es Inhalte produziert, Websites startet, Marketing-Updates teilt, virtuelle Workshops veranstaltet, Cloud-Konten aktualisiert und mehr Apps entwickelt, um den sich ändernden Geschäftsanforderungen gerecht zu werden. Hier ist ein Beispiel:

• Eine einzelne E-Mail mit Fotoanhang kann bis zu 50 Gramm CO2e ausstoßen. (e = „äquivalent“, um Treibhausgase jenseits von Kohlendioxid einzubeziehen.)
• Auch wenn das wie ein kleiner Betrag erscheint, denken Sie darüber nach, wie viele E-Mails Ihr Unternehmen täglich versendet.
• Multiplizieren Sie das nun mit jeder digitalisierten Organisation auf der Welt.

Und das ist nur eine E-Mail. Es ist leicht zu erkennen, wie wir einen jährlichen Treibhausgasausstoß von 1,6 Milliarden Tonnen erreichen.

Viele Organisationen überprüfen ihre Online-Präsenz nicht regelmäßig, was dazu führt, dass Millionen von Websites ungelesene Blog-Beiträge, defekte Links, aufgeblähte Bilder und veraltete Inhalte enthalten. Diese Probleme frustrieren die Benutzer, verschwenden Energie, kosten Zeit und Geld und beeinträchtigen die langfristige Nachhaltigkeit und das Endergebnis eines Unternehmens.

Während viele Unternehmen die Umweltauswirkungen ihrer Büroräume, Lieferkette oder Geschäftspraktiken bewerten, prüfen sie selten den CO2-Fußabdruck ihrer Online-Angebote. Angesichts der Geschwindigkeit, mit der das Internet wächst, muss sich dies ändern.

Nachhaltige Webdesign-Praktiken

Nachhaltiges Webdesign ist eine hybride Mischung aus Umweltschutzprinzipien und leistungsbasierten Web- und Benutzerfreundlichkeitsstandards. Unternehmen und Organisationen können sich auf den Lebenszyklus jeder Website, App oder jedes Online-Mediums bewerben, um die Effizienz zu maximieren, die Benutzerfreundlichkeit zu erhöhen und die Leistung zu verbessern.

Nachhaltiges Webdesign kann auch die Umweltauswirkungen Ihrer digitalen Produkte und Dienstleistungen durch umweltfreundliches Hosting, CO2-Messung und -Reduzierung, Minimierung des Stromverbrauchs usw. reduzieren.

Die Praxis des nachhaltigen Webdesigns fällt in diese Kategorien:

1. Web-Performance-Optimierung: Wie schnell werden Assets auf das Gerät eines Benutzers heruntergeladen?
2. Auffindbarkeit von Inhalten: Wie schnell können Benutzer die benötigten Inhalte finden? Und wie anwendbar sind diese Inhalte, wenn Benutzer sie entdecken?
3. Benutzerfreundlichkeit: Wie schnell können alle Benutzer Aufgaben auf verschiedenen Geräten und Plattformen bei unterschiedlichen Bandbreitengeschwindigkeiten erledigen?
4. Grünes Webhosting: Werden die Server, auf denen Ihre digitalen Produkte und Dienste gehostet werden, mit erneuerbarer Energie betrieben?

In jüngerer Zeit wurden dem nachhaltigen Webdesign-Lexikon zwei wichtige Ergänzungen hinzugefügt:

1. Kunden- und Projektethos: Was fördern oder verkaufen Ihre digitalen Projekte? Wie führen Sie diese transparent und effektiv aus?
2. Geschäftspraktiken: Wie verkörpert Ihre Organisation dieselben Prinzipien?

So machen Sie Ihre Website nachhaltig

1 – Beginnen Sie mit der Planung Ihrer User Journey

Wenn Sie mit dem Konzept nicht vertraut sind, bezieht sich User Journey auf die Abfolge von Aktionen, die ein Benutzer beim Besuch Ihrer Website ausführt, um ein bestimmtes Ziel zu erreichen – eine Anmeldung, einen Kauf usw.

Aus offensichtlichen Gründen bevorzugen Benutzer kürzere Benutzerreisen, da sie ihre Zeit nicht verschwenden. Abgesehen vom Kundenerlebnis werden sie jedoch auch weniger Seiten besuchen, um das zu finden, was sie suchen, und so die CO2-Emissionen ihres Besuchs reduzieren.

Es ist besser, sich mit User Journeys vertraut zu machen und dann Ihr Webdesign daran anzupassen, sobald Sie Ihre Journey Maps frei gestalten können.

Eine gute User Experience (UX), die Reibungspunkte vermeidet, führt unweigerlich zu einem geringeren Energieverbrauch und zufriedeneren Kunden.

2 – Wählen Sie einen umweltfreundlichen Hosting-Anbieter

Ich weiß, das hört sich etwas eigennützig an, da wir letzten Endes ein Hosting-Anbieter sind, aber in Wirklichkeit ist es wichtig, wer Ihre Website täglich betreibt, wenn Sie Ihren CO2-Fußabdruck reduzieren wollen. Leider verbrauchen Rechenzentren einen erheblichen Teil der Energie, die für die Stromversorgung des Internets benötigt wird. Wir müssen schnell auf 100 % erneuerbare Energiequellen umsteigen.

Die Wahl eines Anbieters mit nachhaltigem Hosting, das auf erneuerbaren Energien basiert, ist ein Muss. Es ist auch eine gute Idee, einen Blick auf die allgemeine Umweltpolitik zu werfen und zu prüfen, ob Ihr Hosting-Anbieter zusätzliche Maßnahmen zur Kompensation seiner CO2-Emissionen ergriffen hat und sich an anderen Nachhaltigkeitspraktiken beteiligt.

3 – Entscheiden Sie sich für Responsive Design

Die Wahl eines responsiven Designs scheint vielleicht nicht wie eine nachhaltige Webdesign-Praxis zu sein, aber es ist eine. Responsive Design ist ein Webdesign, das sich an Geräte mit unterschiedlichen Bildschirmgrößen anpasst – was in der heutigen Welt, in der mehrere Geräte und Bildschirme auf das Internet zugreifen, von entscheidender Bedeutung ist.

Wenn Sie sich für ein solches Design entscheiden, passt sich Ihre Website an die verschiedenen Formate an und Sie können dabei Ihren Ressourcenverbrauch senken.

Es wäre hilfreich, wenn Sie darauf achten würden, dass Ihre Website für mobile Benutzer mit intermittierenden oder unzuverlässigen Verbindungsgeschwindigkeiten superschnell ist. Da die meisten Websites im Mobile-First-Index aufgeführt sind, prüft Google auch die Website-Geschwindigkeit anhand seines mobilen Crawlers – es lohnt sich also, mobile Nutzer zu priorisieren.

4 – Machen Sie Informationen leicht auffindbar

Dies entspricht weitgehend den Richtlinien des Sustainable Web Manifesto. Für ein umweltfreundliches Webdesign sollten Sie versuchen, Informationen leicht auffindbar zu machen. Barrierefreiheit ist nicht nur für eine umweltfreundlichere Website, sondern auch für ein besseres Benutzererlebnis von entscheidender Bedeutung.

Es kommt darauf an, wie einfach die Navigation auf Ihrer Website ist. Eine einfache Navigation verkürzt die Zeit, die Menschen auf Ihre Website klicken und nach den erforderlichen Informationen suchen. Dies trägt auch dazu bei, Ihren Kunden vollständige Transparenz zu bieten.

5 – Alles zwischenspeichern!

Caching ist aus Nachhaltigkeitsgründen notwendig, wenn Sie eine PHP-gesteuerte Anwendung verwenden, wie es bei vielen Websites der Fall ist (WordPress, Magento, Drupal usw.).

Wenn eine Site über kein Caching verfügt, muss der Server mehr arbeiten. Jedes Mal, wenn jemand auf eine Seite Ihrer Website zugreift, muss der Seiteninhalt im Handumdrehen geladen werden, indem der PHP-Code verarbeitet, Abfragen an die Datenbank gestellt und dieser in den HTML-Inhalt umgewandelt wird, der Ihre Website anzeigt.

Dieser Prozess beansprucht mehr CPU, Speicher und Festplatte des Servers und verbraucht Energie. Der Server müsste dies für jeden Besucher und jede Seite tun. Je mehr Besucher und Seiten Sie haben, desto mehr Energie verbrauchen Sie.

Bei aktiviertem Caching wird der Großteil dieser intensiven Arbeitsbelastung nur dann erledigt, wenn ein Besucher zum ersten Mal eine Seite anfordert. Der resultierende HTML-Code wird dann in einem Cache gespeichert, sodass nicht jedes weitere Laden einer Seite so viel Arbeit leisten muss.

Darüber hinaus werden Ihre Seiten schneller geladen. Eine schnellere Seitengeschwindigkeit ist nicht nur ein Gewinn für Sie und Ihre Besucher, sondern bedeutet auch, dass Ihre Besucher weniger Zeit im Leerlauf verbringen und auf das Laden der Seite warten müssen – und dabei weniger Energie verbrauchen.

Es gibt viele Möglichkeiten, Websites zwischenzuspeichern. Bei PixoLabo bevorzugen wir WP Rocket für das Seiten-Caching. Superschnelle Websites und bessere Nachhaltigkeit – was gibt es da nicht zu lieben?

6 – Wenn Sie Code schreiben, stellen Sie sicher, dass es sich um sauberen Code handelt

Die meisten Benutzer verwenden ein CMS. Wenn Sie jedoch Code schreiben, stellen Sie sicher, dass dieser leicht zu verstehen und zu ändern ist und unnötige Duplikate und Vorgänge vermieden werden.

7 – Vermeiden Sie unnötige Plugins und Add-ons

Dieser Schritt ist für die obige Regel relevant, jedoch für Personen, die ein CMS wie WordPress verwenden. Manchmal sind wir von all den Möglichkeiten, die der Plugin-Markt bietet, zu sehr begeistert und überfluten unsere Website mit unnötigen Plugins.

Das ist häufig bei marketingorientierten Plugins oder duplizierten Plugins der Fall, die wir vergessen haben. Bewerten Sie, was Sie haben, dann was Sie brauchen, und geben Sie anderen den Vorzug.

8 – Benutzerdefinierte Schriftarten vermeiden oder einschränken

Diese Tatsache mag überraschen, aber benutzerdefinierte Schriftarten können die Dateigröße Ihrer Website erhöhen.

Ihre benutzerdefinierte Schriftartendatei kann leicht mehr als 200 KB groß sein, wenn sie nur eine Schriftstärke enthält. Wenn Sie verschiedene Strichstärken und Schriftarten verwenden, summiert sich das zwangsläufig und wirkt sich sowohl auf die Geschwindigkeit als auch auf den Energieverbrauch aus.

Daher sollten Sie benutzerdefinierte Schriftarten nur verwenden, wenn Sie der Meinung sind, dass diese für Ihre Marke und praktische Zwecke unerlässlich sind.

9 – Mediendateien mit Bedacht nutzen (und optimieren!)

Es sollte selbstverständlich sein, dass Sie alle Bilder auf Ihrer Website optimieren müssen. Das wissen wir aus den Best Practices in Bezug auf Website-Geschwindigkeit (und SEO). Manchmal fragen uns Kunden, warum ihre Website langsam ist, und stellen dann fest, dass die Startseite 4 MB an Bildern enthält, weil sie sehr große Originale hochgeladen haben! Dieselben Bilder können ohne Qualitätsverlust durch Optimierung bereitgestellt werden.

Imagify für WordPress beinhaltet eine automatische Bildoptimierung, sodass Sie sich nicht darum kümmern müssen, dies selbst zu tun. Darüber hinaus können Bilder in moderne Dateiformate wie WebP konvertiert werden, die etwa 25 % kleiner sind als PNG- oder JPG-Bilder.

Über die Optimierung hinaus müssen wir auch prüfen, ob ihr Einsatz vertretbar und zielführend ist.

Beispielsweise könnten einige Produktfotos unbrauchbar sein (z. B. sehr ähnliche Blickwinkel). In anderen Fällen können auf der Seite verwendete Bilder, wie z. B. zufällige Stock-Bilder, einfach durch Alternativen wie SVG-Grafiken ersetzt werden, oder der gleiche Effekt kann durch CSS-Stile erzielt werden.

10 – Lazy Load Below the Fold-Inhalt

Jede Ihrer Webseiten kann viele Inhalte „below the Fold“ enthalten – also Inhalte, die nicht sichtbar sind, es sei denn, der Besucher scrollt auf Ihrer Seite nach unten.

Wenn es sich um viele Bilder oder Videos handelt, deren Größe erheblich sein kann, müssen alle diese Daten über das Internet übertragen werden, auch wenn sie möglicherweise nie angezeigt werden.

Lazy Loading bedeutet, dass Sie diesen Inhalt nur dann anfordern, wenn der Benutzer auf Ihrer Seite nach unten scrollt. Diese Abschnitte erscheinen unmittelbar bevor der Inhalt sichtbar wird. Aus der Sicht des Besuchers ist es also so, als ob er schon immer da gewesen wäre – es gibt keinen wahrnehmbaren Unterschied.

Sie vermeiden nicht nur die Übertragung unnötiger Daten, sondern verbessern auch Ihren PageSpeed-Score, indem Sie Ihre Website weniger wichtig machen.

Einige Anwendungen verfügen über integriertes verzögertes Laden, oder Sie können ein Plugin verwenden. Für WordPress enthält LiteSpeed ​​Cache eine Lazy-Loading-Funktion, mit der Sie alles von Bildern, Videos, eingebetteten Inhalten oder sogar ganzen HTML-Blöcken laden können, wenn Ihre Seite sehr lang ist.

11 – Beschränken Sie die Verwendung von Videos und Animationen

Sie müssen Ihre Website nicht wie eine Word-Seite aussehen lassen und Videos und Animationen wie die Pest vermeiden, sondern wie bei Bildern stattdessen sparsam damit umgehen.

Animationen haben in der Regel keinen taktischen Zweck, also verwenden Sie sie so wenig wie möglich. Bei Videos kommt es stark darauf an, welchen Zweck sie erfüllen. Wenn Sie also glauben, dass sie für Ihre Benutzer hilfreich sind, verwenden Sie sie. Stellen Sie sicher, dass sie so optimiert wie möglich sind.

12 – HTML, CSS und Javascript minimieren

Auch hier gilt, dass Sie dies möglicherweise bereits aus Geschwindigkeitsgründen tun, aber wenn nicht, gehen wir kurz darauf ein, warum.

Ihr HTML-, CSS- und Javascript-Code enthält häufig zusätzliche Daten wie Leerzeichen, Zeilenumbrüche oder Kommentare. Diese Leerzeichen oder Kommentare sind nur hilfreich, damit ein Entwickler den Code leicht lesen und verstehen kann, haben aber keinen Einfluss darauf, wie der Browser Ihren Code interpretiert.

Durch die Minimierung Ihres Codes wird dieser unnötige Aufwand beseitigt, die Größe der Dateien, die über das Internet übertragen werden müssen, verringert und das Laden Ihrer Website beschleunigt.

WP Rocket übernimmt diesen Aspekt für Sie für WordPress, aber die meisten anderen Anwendungen verfügen auch über eine ähnliche Funktion, die über ein Plugin verfügbar ist.

13 – Entfernen Sie unnötiges CSS und Javascript

Während bei der Minimierung unnötige Daten entfernt werden, wird nicht analysiert, ob Ihre Website diesen Code verwendet.

Möglicherweise haben Sie ein Theme oder einen Seitenersteller mit vielen verschiedenen Layouts, Stilen oder Funktionen verwendet, die Sie nirgendwo auf Ihrer Website verwenden.

Der gesamte Code verbleibt in Ihren CSS- und JS-Dateien, wodurch sich die Datenmenge erhöht, die über das Internet übertragen werden muss, und das Laden Ihrer Website ohne triftigen Grund langsamer wird.

Es kann schwierig sein, genau herauszufinden, welcher Code manuell entfernt werden muss, aber für WordPress ermöglicht Ihnen WP Rocket, nicht verwendetes CSS automatisch zu entfernen. Dieser Prozess entfernt ungenutztes CSS und generiert eine eindeutige CSS-Datei für jede Seite. Wenn Ihre Website nur über wenige Seiten verfügt, kann es sich lohnen, ungenutztes CSS zu entfernen. Die Verwendung einer einzigen CSS-Datei kann jedoch effizienter sein, wenn Ihre Website über viele Seiten verfügt.

Das Entfernen von Javascript kann komplexer sein, obwohl WP Rocket das Laden zumindest verzögern kann, bis eine Benutzeraktivität erkannt wird. Das Verzögern von Javascript kann angemessen sein, sofern es für „above-the-fold“-Inhalte nicht erforderlich ist.

Letztendlich ist es der beste Rat, den Einsatz von Seitenerstellern oder aufgeblähten Plugins nach Möglichkeit zu vermeiden und sauberen Code zu verwenden, von dem Sie wissen, dass er erforderlich ist.

14 – Optimieren Sie Ihre Website für verschiedene Geräte

Das Testen Ihrer Website auf zahlreichen Bildschirmgrößen, Browsern, Geräten und Bandbreitengeschwindigkeiten kann zeitaufwändig sein, aber ein mobilfreundliches Webdesign ist unerlässlich. Die falsche Darstellung von Inhalten und Design führt zu schlechter UX und Verwirrung bei den Benutzern.

Sie werden viel mehr Zeit damit verbringen, das zu finden, was sie suchen, und dabei mehr Energie verbrauchen.

Um dies zu vermeiden, stellen Sie sicher, dass sich Ihr Design an möglichst viele dieser Variablen anpasst, um den Benutzern ein optimales Erlebnis zu bieten.

15 – Verwenden Sie ein CDN, um Ihre Inhalte bereitzustellen

Was ist also ein CDN? Ein Content Delivery Network (CDN) ist ein Netzwerk von Servern an verschiedenen geografischen Standorten. Sie tragen dazu bei, dass Ihre Inhalte schneller geladen werden, indem sie von einem Standort in der Nähe Ihrer Benutzer bereitgestellt werden. Mit anderen Worten: Dies hängt sowohl mit der Geschwindigkeit als auch mit der Benutzererfahrung zusammen.

Noch wichtiger ist jedoch, dass dies unter Nachhaltigkeitsgesichtspunkten zur CO2-Reduzierung beiträgt, da die Übertragung von Daten in verschiedene Teile der Welt viel Energie erfordert. Und je weiter die Daten reisen, desto mehr Energie wird benötigt.

Es ist auch gut zu erwähnen, dass über CDN bereitgestellte Bilder normalerweise kleiner sind, wenn Sie diesen Schritt irgendwie übersprungen haben. Viele CDNs stellen Ihnen Tools zur Bildoptimierung zur Verfügung, einschließlich der Reduzierung der Bildgröße, Pixeldichte, des Formats und der Komprimierung.

Die Wahl eines CDN, das erneuerbare Energien nutzt, wie etwa Cloudflare, ist von entscheidender Bedeutung.

16 – Überprüfen Sie Ihre Inhalte, um sicherzustellen, dass sie der Strategie entsprechen

Wenn Sie eine große Website haben, ist die regelmäßige Überprüfung des Inhalts von entscheidender Bedeutung. Einige Seiten werden unweigerlich veraltet sein oder ihren Zweck nicht mehr erfüllen. Dies gilt insbesondere für Wissensdatenbanken, Produktseiten, Blogbeiträge usw.

Sie können sie entweder manuell überprüfen oder Google Analytics verwenden, um zu beurteilen, welche Seiten möglicherweise veraltet sind oder eine schlechte Leistung erbringen. Sie können dann entscheiden, ob Sie sie mit hilfreichen, neuen Inhalten aktualisieren oder löschen möchten.

17 – Reduzieren Sie Ihre CO2-Emissionen, indem Sie Ihren CO2-Fußabdruck ausgleichen

Die Teilnahme an Projekten, bei denen Bäume gepflanzt und CO2-Emissionen ausgeglichen werden, ist eine fantastische Möglichkeit, die Nachhaltigkeit Ihres Webdesigns und Ihres Unternehmens insgesamt zu verbessern. Bäume sind absolute Gewinner bei der Reduzierung des CO2-Ausstoßes, da sie diesen absorbieren und in Sauerstoff umwandeln.

Unsere Freunde von Treebuddy Earth können helfen.

Machen Sie Ihre Website klimafreundlich

Die Einführung eines nachhaltigen Webdesigns ist eine perfekte Möglichkeit, Ihr Unternehmen als positive Kraft zu nutzen. Es herrscht große Verwirrung darüber, was eine umweltbewusste Website ist. Nachhaltiges Webdesign ist die Gestaltung von Webdiensten, die den Planeten und die Menschen in den Vordergrund stellen.

Nachhaltige Websites müssen profitabel sein, den Planeten schonen und langfristig einen Mehrwert für die Menschen schaffen. Tools wie der Website Carbon Calculator bieten eine grobe Schätzung der Treibhausgasemissionen einer Website.

Um eine CO2-Neutralität der Website zu erreichen, können Sie sie mit grüner Energie hosten. Wir empfehlen Anbieter, die angeben, dass sie bei einem vertrauenswürdigen Ökostromanbieter einkaufen und auf REC-basierten Ökostrom zurückgreifen können.

Sie können den Stromverbrauch auch durch Verbesserungen der Dateigröße, Geschwindigkeit und Benutzerfreundlichkeit reduzieren. Am vielversprechendsten ist die Konzentration auf Suchabsicht, Video-, Bild- und Plugin-/Skriptoptimierung.

Schließlich können Sie Ihre Treibhausgasemissionen durch Klimaschutzprojekte kompensieren. Eine nachhaltige Website zu erstellen ist weder eine Punktlandung noch eine PR-Kampagne. Seien Sie mutig bei der Überkompensierung Ihres CO2-Fußabdrucks, aber gleichzeitig bescheiden und selbstbewusst in Ihrer Kommunikation.

Nachhaltiges Webdesign wirkt sich positiv auf Umwelt, Gesellschaft und Wirtschaft aus. Sie können eine Reihe von Praktiken integrieren, die die Prinzipien des nachhaltigen Webdesigns verkörpern. Das Wichtigste muss jedoch die Reduzierung Ihres Ressourcenverbrauchs sein.

Müssen Sie eine nachhaltige Website erstellen?

Müssen Sie eine klimafreundliche Website oder einen klimafreundlichen Online-Shop erstellen? Unser Team aus professionellen Designern hilft Ihnen gerne dabei. Schauen Sie sich aber zunächst unser Portfolio an und lesen Sie unsere Fallstudien.

Wenn Sie glauben, dass wir gut zu Ihren Anforderungen an nachhaltiges Webdesign passen, dann lassen Sie uns reden! Wir bieten ein umfassendes Spektrum an Beratungs- und Designlösungen für Unternehmen und Produktmarken.

Und wenn Sie noch unsicher sind, wie Sie eine nachhaltige Website erstellen, dann lassen Sie uns darüber reden. Wir hören Ihnen zu, beantworten Ihre Fragen und ermitteln, wie Sie eine umweltfreundliche Website für Ihr Unternehmen oder Ihre Produktmarke erstellen können!

Was würden Sie hinzufügen?

Was denken Sie über nachhaltige Websites und die Zukunft des Webdesigns? Werden Nachhaltigkeitsthemen endlich im Mittelpunkt neuer Web-Frameworks stehen und zu den Best Practices gehören? Was kann noch getan werden, um eine Website umweltfreundlicher und effizienter zu machen?

Von Gregor Saita

Mitbegründer / CXO

@gregorsaita