Skip to main content

Um eine optimale Ladezeit für eure Webseite zu erzielen, empfehlen wir das Plugin WP Rocket. Es ist zwar kostenpflichtig, erzielte aber im Test die besten Ergebnisse.

Installation WP Rocket

Nach dem Kauf erhaltet ihr eine ZIP-Datei, welche ihr wie gewohnt im Backend von WordPress über PluginsInstallieren hochladen könnt.

Das Plugin aktiviert sich automatisch, die Lizenz ist im Paket bereits enthalten.

Prüfen der Schreibrechte

Sollte WordPress keine Schreibrechte z.B. für die htaccess oder im Uploads-Verzeichnis haben, müsst ihr diese entsprechend anpassen. Hierzu liefert das Plugin einen Hinweis, der diesen Vorgang genau erklärt.

Grundlegende Einstellungen

Nach der Installation und Konfiguration setzt ihr die notwendigsten Einstellungen in WP Rocket. Öffnet hierzu bitte die Einstellungen von WP-Rocket (EinstellungenWP Rocket).

Folgende Einstellung könnt ihr ohne Gefahr setzen:

Layzyload:

  • Bilder
  • Iframes & Videos

Datei Optimierung:

  • HTML
  • Google Fonts

Mobiles Caching

  • Aktiviert Cache für mobile Geräte

WP_Rocket_‹_affiliatetheme_io_—_WordPress

Speichert diese Einstellungen und testet eure Webseite mit einem Tool. Eine Liste findest ihr hier.

Ihr solltet bereits jetzt eine deutliche Verbesserung erkennen können. In unserem Test hatten wir mit diesen Einstellungen in unserer Demo01 einen PageSpeed von 93/100 am Desktop (getestet mit Google PageSpeed Insights.

Natürlich kann es sein, dass ihr diesen Wert entweder unter- oder überschreitet. Es hängt z.B. stark von eurem Server ab, wie schnell eure Seite lädt.

Erweiterte Einstellungen

Euch lädt die Seite immer noch nicht schnell genug? Wir haben noch weitere Möglichkeiten die Webseite zu optimieren. Spürbar sollte das minimieren von JS- und CSS-Dateien sein.

Wichtiger Hinweis: Nicht jeder Server unterstützt die Minimierung! Ihr müsst testen, ob euer Server die Minimierung unterstützt. Falls nicht, müsst ihr die Minimierung wieder deaktivieren.

CSS Optimierung

Hier gibt es nicht viel zu beachten, setzt einfach die folgenden Haken in eurer WP Rocket-Konfiguration:

Datei Optimierung

  • Inline CSS
  • CSS

Anschließend solltet ihr wieder den Cache löschen und die Seite erneut besuchen – am besten eignet sich zum Testen ein Browser den ihr im „Inkognito-Modus“ (Privates Surfen) starten könnt, das wären z.B: Firefox oder Chrome.

Hinweis: Der Cache steht nur Besuchern zur Verfügung, die nicht eingeloggt sind. Sofern nicht anders konfiguriert

Sollte das Layout eurer Webseite „zerschossen“ sein, unterstüzt euer Server die minimierung nicht.

JS Optimierung

Das Affiliate Theme lädt einige JavaScript Dateien, diese sind zwar größtenteils schon optinmiert – dennoch ist eine JS Optimierung mit WP Rocket ratsam.

Setzt bitte folgende Haken:

Datei Optimierung

  • Inline JS
  • JS

Anschließend müsst ihr noch die Reihenfolge der JS-Dateien optimieren, solltet ihr diesen Schritt überspringen, kann es sein, dass die Minimierung Fehler verursacht. Beispiel:

Ihr verwendet ein Script für eine Bilder-Lightbox, welches jQuery benötigt. Sollte WP Rocket nun beides minimieren, legt es ggf. eine eigene Reihenfolge fest. Sollte das Lightbox-Script jetzt vor jQuery geladen werden, kann dieses nicht korrekt ausgeführt werden.

Reihenfolge der JS-Dateien optimieren

Zunächst benötigt ihr eine Liste mit allen JS-Dateien, die eure Seite lädt. Öffnet hierzu bitte diese URL und gebt eure Webseite ein:

http://wp-rocket.me/tools/wp-rocket/debug/minify/

Anschließend erhälst du eine Liste, mit allen Dateien, das sieht in etwa so aus:

Get_CSS___JS_Files_-_WP_Rocket_Debug_Tools

Um die Liste in WP Rocket zu übertragen, müsst ihr erneut die Einstellungen aufrufen und den Tab Erweiterte Optionen: öffnen.

Dort findet ihr folgende Einstellung: JS-Dateien die während des Minimierungsprozesses in der Fußzeile enthalten sein sollen..

In dieser Liste fügt ihr jetzt nach und nach die Script, in der gleichen Reihenfolge wie auf der Debug-Seite von WP Rocket, ein und speichert deine Änderungen.

Bitte achtet darauf, dass jQuery in der Liste ganz oben steht, es ist das wichtigste Script und wird von allen weiteren Scripten benötigt.

Löscht euren Cache und testet erneut den PageSpeed eurer Seite. Wichtig ist auch, dass ihr die Webseite uneingeloggt auf Fehler überprüft. Es ist sehr wichtig, dass alle Funktionen fehlerfrei laufen.

Fazit

Mit WP Rocket hebt eure Seite sprichwörtlich ab. Achtet aber immer darauf, dass eure Seite korrekt arbeitet. Die Nutzung der Webseite steht immer im Vordergrund auch wenn der PageSpeed vielleicht nicht immer bei 100/100 liegt.

In unserer Demo haben wir ein Ergebnis erzielt mit dem wir sehr zufrieden sind:

PageSpeed_Insights

Die Kunst ist es ein gesundes Mittelmaß zu finden.

Falls ihr kein WP Rocket nutzen möchtet, könnt ihr auch mit ein bisschen Quellcode in eurer .htaccess-Datei wahre Wunder bewirken. Eine optimierte .htaccess-Datei findet ihr hier.

Viel Erfolg.


Hinweis
Dieser Artikel basiert auf einem Forumthread. Wer Zugang zum Forum hat kann diesen hier (https://affiliatetheme.io/forum/thema/pagespeed-optimierung-mit-wp-rocket/) finden.

Ähnliche Beiträge


Kommentare

rene 31. Mai 2016 um 23:11

Bei der Aktuellen Version von WP Rocket gibt es die Einstellung "JS-Dateien die während des Minimierungsprozesses in der Fußzeile enthalten sein sollen.." nicht mehr.
Ich kann die JavaScript-Dateien entweder verzögert laden oder nach dem Minifizieren in den Footer verschieben.
Könntet Ihr die Anleitung anpassen?

Eine andere frage zu der Meldung bei Google Pagespeed: "JavaScript- und CSS-Ressourcen, die das Rendering blockieren, in Inhalten "above the fold" (ohne Scrollen sichtbar) beseitigen"
Was muss hier gemacht werden?

Antworten

Christian 10. Juni 2016 um 18:09

Danke für den Tipp. Wir aktualisieren demnächst die Anleitung für die neuste WP Rocket Version.

Den Punkt "JavaScript- und CSS-Ressourcen, die das Rendering blockieren, in Inhalten "above the fold" (ohne Scrollen sichtbar) beseitigen" wirst du nur sehr schwer bis garnicht beheben können. Ist auch nicht zwingend erforderlich. Prüfe deine Seite auf Ladezeit und Größe, wenn das alles passt, ist alles im grünen Bereich! 😉

Antworten

Carsten 10. Oktober 2016 um 21:41

Ich hätte eine Frage zum Pagespeed in Bezug auf die Produktbilder: Macht es für den Pagespeed einen merklichen Unterschied ob ich die Produktbilder selber hoste oder über eine Verlinkung beziehe. Ersteres sollte doch eigentlich schneller sein oder ?

Antworten

Christian 17. Oktober 2016 um 17:29

Hi Carsten,

das kommt ganz drauf an wieviele Requests auf deiner Seite entstehen. Ein CDN, das was du meinst, macht eigentlich erst Sinn, wenn du bereits über diene Domain über 60-70 Requests hast. Dann kann es durchaus helfen die Bilder auszulagern.

Das muss man im Zweifel einfach mal austesten und die Ladezeiten vergleichen – pauschal kann man das schwer beantworten. 🙂

Antworten

Du hast eine Frage oder eine Meinung zum Artikel? Teile sie mit uns!

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

*
*

Choose your currency:

Close
Converted prices are for reference only - all orders are charged in € Euro (€) EUR.
  • USDUS Dollar ($)
  • EUREuro (€)
  • GBPPfund Sterling (£)
  • AUDAustralische Dollar ($)
  • BRLBrasilianischer Real (R$)
  • CADKanadischer Dollar ($)
  • CZKTschechische Krone
  • DKKDänische Krone
  • HKDHongkong Dollar ($)
  • HUFUngarischer Forint
  • ILSIsraelischer Schekel (₪)
  • JPYJapanischer Yen (¥)
  • MYRMalaysischer Ringgits
  • MXNMexikanischer Peso ($)
  • NZDNeuseeland Dollar ($)
  • NOKNorwegische Krone
  • PHPPhilipinischer Pesos
  • PLNPolnischer Zloty
  • SGDSingapur Dollar ($)
  • SEKSchwedische Krone
  • CHFSchweizer Franken
  • TWDTaiwan New Dollar
  • THBThai Baht (฿)
  • INRIndische Rupie (₹)
  • TRYTürkische Lira (₺)
  • RUBRussischer Rubel