Website und Webhosting

From Data Compass
Jump to navigation Jump to search
Deutsch | English | Einfache Sprache





Auch wenn nicht alle Institutionen oder Kulturakteur:innen digitale Kulturangebote produzieren, betreiben alle eine Website, meistens um die eigenen Projekte anzukündigen, zu bewerben und zu archivieren. Websites sind Visitenkarten, um sich zu präsentieren. Dabei werden bei jedem Zugriff Daten aus der Website geliefert. Viele Zugriffe auf eine Website bedeuten also auch einen hohen Datenverbrauch.

Für Kultureinrichtungen ist die Ästhetik der Website von großer Bedeutung. Es gibt aber auch Möglichkeiten, datensparsam zu arbeiten, ohne an der Ästhetik zu sparen. Eine kleine Einführung dazu gibt es aus dem "Grid-aware Websites Project von der Green Web Foundation.

Grundsätzlich lässt sich sagen, dass viele Best Practices für eine barrierearme Webgestaltung auch mit einem energiesparenden Design einhergehen. Wenn wir das Design einfach halten, ohne datenintensive Animationen und Plug-ins, wird unsere Webseite nicht nur sparsamer, sondern auch einfacher zu navigieren. Ein weiteres Beispiel ist der Dark Mode, der durch höhere Kontraste zu einer besseren Lesbarkeit führt.

Bereits bei der Planung einer Webseite für ein neues Projekt, eine neue Initiative oder Institution können Überlegungen zu nachhaltiger Gestaltung und effizienter Programmierung einen großen Unterschied machen. In diesem Zusammenhang sprechen wir auch von Green Coding. Darunter versteht man einige unterschiedliche Ansätze, wie ein Code einfacher gestaltet werden kann, um weniger Daten und damit Energie zu verbrauchen. Aber auch bei einer bestehenden Website können durch Anpassungen viele Daten und damit Energie eingespart werden. Im Blog von Cleaner Web findet sich eine gute Übersicht mit Tipps und Tricks sowie eine Checkliste, wie man die Website klimafreundlicher optimieren kann.[1] Einige der Tipps werden wir hier kurz ansprechen.

Mit dem Audit- und Analysetool von Cleaner Web kann man die eigene Website detailliert untersuchen und die größten Datenfresser ausfindig machen. Die Green Web Foundation stellt ebenfalls ein Werkzeug zur Verfügung, mit dem Entwickler:innen und Programmierer:innen den CO2-Ausstoß ihrer Apps und Websites3 berechnen können.


Greenhosting

Wer eine eigene Website betreibt, muss diese auf einem Server hosten. Bei der Green Web Foundation kann man überprüfen, ob der Server mit Strom aus erneuerbaren Energiequellen betrieben wird.


Statische vs. dynamische Website

Die meisten Kultureinrichtungen verwenden für die Gestaltung, Pflege und Auslieferung der Website ein Content Management System (CMS) wie zum Beispiel WordPress, TYPO3 oder Wix. Diese dynamischen Websites werden serverseitig gesteuert und arbeiten immer mit einer Datenbank. Da die Inhalte bei jeder Anfrage dynamisch generiert und vom Server ausgegeben werden, benötigen sie deutlich leistungsstärkere Server.

In der Regel ändern Kultureinrichtungen ihre Websites nicht ständig bzw. liefern nicht für jede:n Besucher:in individuell generierte Inhalte (wie es z.B. Feeds auf Social Media tun). In diesem Fall reicht eine statische Website, die nicht ständig automatisch aktualisiert wird.

Eine statische Website hat eine vorgegebene Struktur und feste Inhalte. Die Programmierung basiert auf HTML und CSS, eine zusätzliche Datenbank ist nicht immer erforderlich. Bei der Veröffentlichung der Website bleibt der Inhalt stets unverändert und ist schnell verfügbar. Bei statischen Websites erfolgt das Rendering (Prozess der Erstellung einer Webseite aus Rohdaten) bei der Aktualisierung der Inhalte, während bei dynamischen Websites das Rendering bei jedem neuen Aufruf der Inhalte abläuft.

Es ist auch möglich, ein Headless Content Management System für die Verwaltung von Inhalten zu benutzen und diese dann als statische Website auszuliefern. Ein Headless CMS ist ein reines Backend-Web-Content-Management-System, das in erster Linie als Inhaltsspeicher dient.

Egal, welches System man wählt - über geschickt gesetzte Caches (siehe folgenden Abschnitt Caching) kann man den ökologischen Fußabdruck deutlich reduzieren. Ein CMS hat selbst bei simplen Seiten einen um den Faktor 10 höheren Energieverbrauch verglichen mit einer statischen Website.[2] Mit einem korrekt konfigurierten Server-Cache lässt sich das CMS bei wiederholten Seitenaufrufen dem Energieverbrauch einer statischen Website annähern.

Caching

Caching bedeutet grundsätzlich, dass Daten zwischengespeichert werden, um sie beim nächsten Zugriff schneller bereitstellen zu können. Es gibt verschiedene Arten von Caching:

  • Browser-Cache: Der Browser speichert beim ersten Besuch einer Website bestimmte Elemente wie Bilder, Schriftarten oder Formatierungen. Beim nächsten Besuch müssen diese dann nicht erneut vom Server geladen werden – weniger Daten müssen vom Server ausgeliefert und vom Netzwerk übertragen werden.
  • Server-Cache: Inhalte, die sich zwischen zwei Aufrufen nicht verändern, können direkt auf dem Webserver zwischengespeichert werden. Statt die Seite bei jedem Aufruf neu zu berechnen, kann dann diese zwischengespeicherte Version ausgeliefert werden. Das spart am Server gerade bei CMS deutlich Rechenleistung und spart damit Energie ein.
  • Datenbank-Cache: Inhalte einer Website werden oft in einer Datenbank gespeichert. Bei jedem Seitenaufruf müssen dort Informationen abgerufen werden – etwa Texte oder Veranstaltungsdaten. Ein Datenbank-Cache merkt sich häufig genutzte Abfragen und liefert sie schneller aus, ohne jedes Mal die komplette Datenbank zu durchsuchen.
  • Objekt-Cache: Nicht nur bei CMS werden regelmäßig im Hintergrund Funktionen ausgeführt, etwa um bestimmte Inhalte zusammenzustellen. Diese Rechenschritte können ebenfalls zwischengespeichert werden, sodass sie nicht bei jedem Besuch neu berechnet werden müssen.

Caching ist ein wichtiger Bestandteil jeder klimabewussten Website. Richtig eingesetzt, sorgt Caching dafür, dass Websites ressourcenschonender laufen - und ganz nebenbei damit auch schneller und stabiler.

Lazy Loading

Das verzögerte Laden von Bildern, die nicht sofort sichtbar sind, wird als Lazy Loading bezeichnet. Es kann von modernen Browsern auch ohne spezielle Skripte genutzt werden, indem Bilder immer erst beim Aufruf geladen werden, also kurz bevor sie in den sichtbaren Bereich gescrollt werden. Dadurch können bei vielen Seiten große Datenmengen eingespart werden.


Videos einbetten

Die Datenmengen, die beim Videostreaming über Plattformen wie Netflix, Amazon Prime, YouTube & Co. anfallen, machen bereits mehr als die Hälfte des Datenvolumens im Internet aus.[3] Videostreaming ist also ein großer Hebel, um Daten zu sparen.

Tipps:

  • Wenn wir Videos von Videoplattformen wie Vimeo, YouTube, Twitch usw. auf unserer eigenen Website einbetten, sollte die Auto-Play-Funktion ausgeschaltet sein. So werden Videos erst dann geladen, wenn die Besucher:innen sie auch wirklich anschauen wollen.
  • Auch das automatische Abspielen weiterer Videos von einer Videoplattform kann abgeschaltet werden.
  • Wir können ein Icon oder Bild auf der Website platzieren, dann wird der Player erst geladen, wenn auf das Icon geklickt wird.
  • Bei einigen Anbietern kann auch die Ausgabequalität eingestellt werden – so kann bei Videos z.B. aus Konferenzen, bei denen weniger Bewegung zu sehen ist, die Default-Qualität niedriger eingestellt werden. Streamen in SD statt HD reduziert den ökologischen Fußabdruck um 86 Prozent. Weitere Informationen zur nachhaltigeren Nutzung von Videos auf Websites bietet der Artikel „Using video considerately on sustainable websites“ von Paul Jardine und Becky Thorn.

Videos selbst zu hosten, wird wahrscheinlich nie so effizient werden wie bei darauf spezialisierten Anbietern, denn auch sie versuchen, ihre Videos möglichst datensparend auszuliefern. Dabei sollte man, wie bei jedem Hostingdienst, auf Angaben zur DSGVO und zu Nachhaltigkeit achten.

Moderne Bildformate

Viele von uns kennen und verwenden Bildformate wie JPEG, GIF oder PNG. Allerdings gibt es heute schon bessere Formate wie WebP oder AVIF, die den Datenumfang deutlich verringern. Die Umwandlung von Formaten innerhalb von CMS lässt sich mit Plug-ins automatisieren, z.B. für WordPress oder TYPO3.


Bilder – Auflösung und Größe

Neben dem Dateiformat sollte auch die Auflösung an die Größe, in der die Website die Bilder ausliefert, angepasst werden. Denn oft werden Bilder viel kleiner angezeigt, als sie hochgeladen wurden. Im Idealfall sollte die Website nur Bilder bereitstellen, die nicht größer sind als die Version, die auf dem Bildschirm des Endgeräts angezeigt werden kann.[4]


Dark Mode

Ein dunkler Bildschirm kann je nach Gerät bis zu 60 Prozent weniger Strom verbrauchen.[5] Dies gilt vor allem dann, wenn dieses über ein OLED-Display verfügt. Daher ist es auch sinnvoll, entweder das Design einer Website direkt im Dark Mode zu entwickeln oder zumindest die Möglichkeit eines Wechsels in den Dark Mode einzubauen.



  1. ↑ https://cleaner-web.com/blog/kriterien-klimabewusste-website/
  2. ↑ https://www.green-coding.io/case-studies/wordpress-vs-hugo-cloudflare/
  3. ↑ https://www.eon.de/de/pk/strom/strom-sparen/stromverbrauch-internet.html
  4. ↑ http://webkrauts.de/artikel/2012/responsive-images
  5. ↑ https://www.scienceabc.com/innovation/does-the-dark-mode-on-the-computer-actually-save-electricity.html
Retrieved from "https://data-compass.wikibase.cloud/w/index.php?title=Website_und_Webhosting&oldid=677"