So einfach kannst du die Ladezeit deiner Website verbessern

Dass Google benutzerfreundliche Webseiten mit besseren Positionen in der Suchmaschine belohnt, sollte bekannt sein. Auch schnelle Ladezeiten gehören dazu. Denn wie frustrierend ist es für einen Suchenden, wenn die ersten Treffer in den Ergebnissen vielleicht sein Problem lösen, er dann aber ewig warten muss, bis die Seite geladen ist.

Oft fehlt es jedoch am technischen Verständnis der Website-Betreiber, obwohl bereits einfache und schnelle Lösungen zum Erfolg führen. Die aus meiner Sicht am schnellsten umzusetzenden Maßnahmen, die das Laden einer Seite erheblich beschleunigen, stelle in diesem Beitrag vor.

Warum lädt meine Webseite so langsam?

Die Ursachen dafür können sehr vielseitig sein.
Google stellt mit PageSpeed Insights ein sehr hilfreiches Tool zur Verfügung, worüber man seine Webseite analysieren lassen kann. Hier gibt es dann nützliche Vorschläge, wie man die Seiten flott machen kann.

Anhand der aktuellen ZIELBAR.de-Seite, die wir bisher noch nicht optimiert haben, beginne ich damit gleich mittels dieser Anleitung hier.
Für Testzwecke beschränke ich dies auf die Desktop-Version.

Google PageSpeed Insights Zielbar Start

Google PageSpeed Insights

Um für WordPress das ersten Problem

JavaScript- und CSS-Ressourcen, die das Rendering blockieren, in Inhalten „above the fold“ (ohne Scrollen sichtbar) beseitigen

zu beheben, könnte das kostenlose Plugin Async JS and CSS bereits ein Stückchen, wenn nicht sogar komplett Abhilfe schaffen.

Im nächsten Schritt interessieren mich hier die Vorschläge

Komprimierung aktivieren

sowie

Browser-Caching nutzen

Wobei die Komprimierung bereits von unserem Provider All-Inkl.com serverseitig aktiviert ist. Sehr vorbildlich. Macht’s auch noch ein Stückchen schneller. :-)

Komprimierung mit deflate aktivieren

Mittlerweile ist das Apache-Modul mod_deflate auch bei kleineren Webhosting-Paketen inbegriffen. Oft muss dieses jedoch noch aktiviert werden. Sollte seitens PageSpeed dieser Punkt nicht zu den bestandenen Regeln gehören, können nachfolgenden Zeilen in der Datei .htaccess (liegt im Haupt-Verzeichnis der Webseite) Abhilfe schaffen.

<IfModule mod_deflate.c>
<FilesMatch ".*\.(html|php|css|js|xml)$">
SetOutputFilter DEFLATE
</FilesMatch>
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/xml application/xhtml+xml
AddOutputFilterByType DEFLATE application/javascript application/x-javascript
</IfModule>

Browsercache aktivieren

Mit dem Apache-Modul mod_expire wird der Browser vom Besucher dazu veranlasst, Dateien, die bereits geladen wurden, nicht noch einmal von Server abzuholen. Lediglich Dateien, die im lokalen Speicher bereits länger als einer Woche sind, werden erneut angefordert.

<IfModule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 1 week"
ExpiresByType text/html "access plus 1 week"
ExpiresByType image/gif "access plus 1 week"
ExpiresByType image/jpeg "access plus 1 week"
ExpiresByType image/png "access plus 1 week"
ExpiresByType text/css "access plus 1 week"
ExpiresByType text/javascript "access plus 1 week"
ExpiresByType application/x-javascript "access plus 1 week"
ExpiresByType text/xml "access plus 1 seconds"
</IfModule>

Achtung:
Wenn ihr Dateien ändert, die über den Browsercache geladen werden, sehen Andere vielleicht eure Änderungen nicht. Auch wenn das in eurem Browser der Fall ist.
Hier solltet ihr dann die Zeit angepassen oder die entsprechende Zeile für den Dateitypen mit einer Raute (#) am Anfang für 1 Woche auskommentieren.

Die Auswirkungen der Maßnahmen

Das Ergebnis unserer ZIELBAR.de-Seite ist leider nicht gerade repräsentativ. Es gab mit der Cache-Aktivierung unerwartet wenige Pluspunkte. Die Komprimierung macht in der Regel am meisten aus. Diese war hier jedoch bereits aktiv und ließ sich zu Testzwecken auch nicht deaktivieren.

Um euch dennoch anhand einiger Beispiele das Potential dieser minimalen Optimierungsmaßnahmen zeigen zu können, hier mal sehr unterschiedliche Seiten mit den PageSpeed-Werten.

A = keine Komprimierung, kein Browsercache
B = nur Komprimierung
C = nur Browsercache
D = Komprimierung und Browsercache
Webseite A B C D
1. www.handelsprogramm.de 67 84 71 93
2. www.reallatino-tours.com 62 81 69 84
3. www.projektzeiterfassung.org 92 92 94 95
4. www.timo.net 70 73 82 86
5. www.dienstzeitende.de 40 65 46 82

Die kleinste Seite (Nummer 3) hat entsprechend das wenigste Potential durch eine Optimierung. Die letzte habe ich mehrfach getestet, da ich es selbst nicht fassen konnte, wie viel hier die Komprimierung ausmacht. Ich glaube, das ist auch die größte von allen.

Fazit

Ungeachtet der unterschiedlichen Auswirkungen auf den PageSpeed-Wert und damit auch schnellere Ladezeiten, erkennt man bei den getesteten Webseiten sehr eindeutig, dass man mit diesen hier vorgestellten Möglichkeiten relativ einfach und vor allem schnell die eigenen Seiten optimieren kann. Gut für die Besucher, die nicht lange warten müssen. Gut für die Positionen der Einträge in der Google-Suchmaschine.

So einfach kannst du die Ladezeit deiner Website verbessern
Rating: 3.4 15 Votes
Steve Naumann

Steve Naumann

Als begeisterter IT-Anhänger entwickelt Steve Naumann seit 1999 u. a. Webanwendungen auf Basis von PHP und Datenbanksystemen wie MySQL. Im Rahmen seiner Agentur Visual Minds betreibt er mehrere eigene Webprojekte und unterstützt Kunden bei der Durchführung von strategischen Online-Marketing-Maßnahmen. Darüber hinaus ist er Gründer und Herausgeber von Zielbar.

15 Reaktionen zu “So einfach kannst du die Ladezeit deiner Website verbessern”

  1. Marius

    Hi Steve,

    Ich selbst verwende für die Optimierung meiner Seitenperformance die beiden Plugins WP Super Cache und WP-Minify.

    Besonders WP Super Cache hat mir ziemlich aus der Patsche geholfen, da der Server meines Webhosters Probleme mit dem Caching hatte.

    Auf Onlinelupe habe ich vor einiger Zeit mal einen Gastartikel zum Thema geschrieben. Ich poste einfach mal den Link, ich hoffe es geht in Ordnung :D
    http://www.onlinelupe.de/online-marketing/rankingfaktor-pagespeed-seiten-performance-optimieren/

    Viele Grüße
    Marius

    Antworten
    1. Steve Naumann
      Steve Naumann

      Hallo Marius,
      ich bevorzuge zwar manuelle Maßnahmen, um Javascript und CSS zu minimieren, die Alternative über Minify scheint eine schnelle Lösung zu sein. Kenne das Plugin selbst noch nicht.
      Dein Artikel in Jasminas Blog gefällt mir gut und passt hier super als Ergänzung. :-)

      Antworten
    2. Steve Naumann
      Steve Naumann

      Apropos Minify:
      Bin auf eine Anleitung gestoßen, wie man den HTML-Code optimieren kann, ohne ein zusätzliches Plugin zu installieren. Macht WordPress noch etwas schneller.
      Es werden alle HTML-Kommentare, überflüssige Leerzeichen und Umbrüche (jeder Umbruch sind 2 Byte!) aus dem Quellcode entfernt.

      Ist relativ schnell und einfach umzusetzen. Daher mittlerweile auch in unserem Blog im Einsatz. Sehr empfehlenswert!

      http://fastwp.de/snippets/html-minify/

      Antworten
  2. Walter B. Walser

    Hallo Steve

    Ich war kürzlich bei meiner Website bei 100%, in dem ich die Stylesdateien in den Footer verlagerte.

    Allerdings habe ich dann den W3C-Test nicht mehr 100%-ig bestanden. Aber mit über 90% lebt sich auch nicht schlecht :-)

    Antworten
    1. Steve Naumann
      Steve Naumann

      Hallo Walter, danke für Deinen Kommentar. Manchmal ist’s sogar schön, wenn man weiß „da geht noch was“. :-)
      Aber das passt schon. Man muss es auch nicht übertreiben. ;-)

      Antworten
  3. Bernhard Prange

    Hallo Steve,
    schöner Artikel. Ich habe eine ähnliche Anleitung mit einigen Erweiterungen erstellt. Ich würde mich freuen, wenn Du mein Tutorial am Ende Deines Beitrags empfehlen könntest. http://wp-config.tips/2015/03/wordpress-pagespeed-optimierung-all-inkl-com/

    Gruß

    Bernhard

    Antworten
  4. Slava Berg

    Ein super hilfreicher Artikel, konnte durch das Browser-Caching die Bewertung bei PageSpeed Insights um 10 Punkte steigern, diese ist mit 64/100 Punkten zwar noch immer total im Keller, aber der Anfang ist getan ;-)

    Habt ihr hier weitere so tolle Tipps zur Optimierung der Ladezeiten?

    Antworten
    1. Steve Naumann
      Steve Naumann

      Danke, Slava.

      Derzeit haben wir noch keine veröffentlicht. Es werden aber noch einige Artikel zu diesem Thema folgen. Stecke technisch ziemlich tief drin *VorArroganzGlüh* ;-). Kann mich allerdings mit WordPress nicht so richtig anfreunden, um das so zu optimieren, dass ich alle Funktionen, die wir brauchen, auch nutzen kann. Zumindest wäre dieser Weg aus meiner Sicht nicht besonders effizent.

      Wenn Interesse an Artikeln für die Webseitenoptimierung im Allgemeinen geht, bin ich gern dabei. ;-)

      Beste Grüße
      Steve

      Antworten
  5. […] bin ich bei meiner Suche auf einen Artikel bei Zielbar gestoßen, welcher mir sehr interessant erschien. Dort werden zwei Codeschnipsel aufgeführt, […]

  6. DaniBLN

    Hallo,

    ein Super Artikel, vielen Dank dafür.
    Allerdings bekomme ich mein Browser Caching nicht zum laufen.

    Habt ihr einen Tip?
    Folgendes hab ich in der .htacces stehen:

    # BEGIN WordPress

    RewriteEngine On
    RewriteBase /
    RewriteRule ^index\.php$ – [L]
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule . /index.php [L]

    ExpiresActive On
    ExpiresDefault „access plus 1 week“
    ExpiresByType text/html „access plus 1 week“
    ExpiresByType image/gif „access plus 1 week“
    ExpiresByType image/jpeg „access plus 1 week“
    ExpiresByType image/png „access plus 1 week“
    ExpiresByType text/css „access plus 1 week“
    ExpiresByType text/javascript „access plus 1 week“
    ExpiresByType application/x-javascript „access plus 1 week“
    ExpiresByType text/xml „access plus 1 seconds“

    # END WordPress

    Antworten
  7. Martina Zeltner

    Hallo und vielen Dank für den Bericht. Der letzte wohl größere Fehler ist:
    JavaScript- und CSS-Ressourcen, die das Rendering blockieren, in Inhalten „above the fold“ (ohne Scrollen sichtbar) beseitigen
    Gibt es hier eine für Anfänger geeignete Lösung? Es handelt sich um meine http://www.Zeltnerhof.de Seite. Vielen Dank Martina Zeltner

    Antworten
    1. Steve Naumann
      Steve Naumann

      Hallo Martina,
      für WordPress könnte dir vielleicht das Plugin WP-Plugin Async JS and CSS etwas unter die Arme greifen. Habs im Beitrag ergänzt. Danke für den „Schupps“. ;-)
      Beste Grüße
      Steve

      Antworten
  8. geldoo

    Nun hab ich deine Seite gerade getestet?
    Nutzt du die Sachen nicht ode warum schneidet deine Seite so „durchschnittlich“ ab ab?

    Antworten
    1. Steve Naumann
      Steve Naumann

      Der Artikel ist schon etwas älter. Mittlerweile haben wir hier andere Plugins und Zusätze integriert. Zudem gab es auch seitens Google Pagespeed Insights Anpassungen. Die Seite ist zum aktuellen Zeitpunkt kein gutes Beispiel. Optimierungen in dieser Richtung stehen derzeit auch nicht ganz so weit oben in unserer Prioritätenliste.

      Antworten
  9. Anton

    Perfekte Infos!

    Antworten

Jetzt Kommentar zum Thema hinterlassen

Die E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Profitieren Sie vom Workflow unseres eingespielten Teams!

Beratung & Analyse

Die Grundlage jeder Content-Strategie: Wir erheben relevante Daten, analysieren sie und ziehen die richtigen Schlüsse aus den Ergebnissen.

Jetzt mehr erfahren

Content

Der Stoff, um Kommunikationsziele zu erreichen: Wir entwickeln hochwertige Texte, ansprechende Grafiken sowie spannende Video- und Audioformate.

Jetzt mehr erfahren

Newsletter

E-Mailings sorgen für Neukunden und eine starke Kundenbindung: Wir unterstützen bei Entwicklung, Produktion und Erfolgskontrolle.

Jetzt mehr erfahren

Corporate Blog

Relevante Informationen für (potenzielle) Kunden: Unsere Redaktion liefert Qualitätscontent, der entlang der Customer Journey wirkt.

Jetzt mehr erfahren