SEO

  • C02 sparen: Responsive Images und Lazyload bei Jekyll

    Netzwerkdaten vorher:1 2

    Dateien Typ Größe Übertragen
    9 images 1.357,97 KB 1.360,75 KB
    3 html 50,54 KB 18,27 KB
    1 css 11,26 KB 3,49 KB

    Netzwerkdaten, nachher (mit jekyll-responsive-images und Lazyload): 1 2 3

    Dateien Typ Größe Übertragen
    9 images 646,17 KB 648,95 KB
    3 html 52,56 KB 18,50 KB
    1 css 11,60 KB 3,65 KB
    1 js 0 KB 28,06 KB

    Reduzierte Inhalte sparen Ressourcen und damit auch Emissionen bei jedem Seitenaufruf.4

    Das ist nicht nur nachhaltig im Sinne von ressourcenschonend und gut fürs Klima,
    sondern Google mag es auch noch gerne.

    Zudem fließt die Performance der Website auch in die Ranking-Kriterien von Google ein, sodass auch die Auffindbarkeit über die Suchmaschine davon profitiert.4

    So empfahl mir Google PageSpeed Insights zur Verbesserung der Performance von netzaffe.de auch die richtige Dimensionierung vom Bildern.

    Dieses Howto hat das Ziel die übertragene Datenmenge von Bildern und somit den CO2-Ausstoß dieser Website mimimieren.

    Ich beschreibe die Installation und Konfiguration von jekyll-responsive-images5, im Zusammenspiel mit einem neuen Template und einen Lazyload Skript, eingebunden in Jekylls Standardtheme miminma6 unter Linux, hier CentOS auf uberspace 7.

    1. Gemessen mit dem Firefox Netzwerkanalyse Werkzeug  2

    2. Startseite, Minima Theme mit Desktop Auflösung  2

    3. jekyll-responsive-images Konfigurationsparameter: width: 740px, quality: 90, strip: true 

    4. reinblau: Klimaschutz und Webentwicklung  2

    5. jekyll-responsive-image 

    6. Minima Theme 

    Weiterlesen

Subscribe