Elementor: Performance optimieren und PageSpeed verbessern

Dieser Beitrag beschreibt technische Maßnahmen zur Verbesserung der PageSpeed auf WordPress-Seiten, die mit Elementor erstellt wurden. Fokus liegt auf realistischen Optimierungen, die Hosting, Asset-Management und Konfiguration betreffen. Ziel ist eine praktikable Vorgehensweise, die schnelle Verbesserungen der Core Web Vitals ermöglicht.

Problemstellung und Kontext

Viele Webseiten mit Elementor zeigen eine hohe Funktionsdichte und damit verbundenen Overhead bei CSS- und JavaScript-Assets. Standardinstallationen laden oft globalen Code und Widgets, die auf einzelnen Seiten nicht benötigt werden. Zusätzlich kann ein mittelmäßiger Hosting-Provider die Auswirkungen dieser Asset-Last verstärken und so messbare Einbußen bei PageSpeed-Werten verursachen.

Bei Messungen kann ein Ausgangswert wie 59 deutlich verbessert werden, wenn gezielt Hostingeinstellungen und die Asset-Verteilung optimiert werden. Verbesserungen auf 90 Punkte sind möglich, abhängig von Messumgebung und verbleibenden Ressourcen. Dennoch bleibt die Lösung kontextabhängig: nicht jede Seite erreicht „100 Punkte“ ohne Kompromisse bei Funktionalität oder Aufwand.

Messung: Lab- vs. Felddaten und Interpretation

Bei der Analyse sind Labdaten (z. B. PageSpeed Insights Lab-Tools) und Felddaten (Real User Monitoring) zu unterscheiden. Labdaten helfen, konkrete Probleme reproduzierbar zu identifizieren, während Felddaten tatsächliche Nutzererfahrungen abbilden. Beide Datentypen sollten im Optimierungsprozess berücksichtigt werden, da Maßnahmen unterschiedlich auf Lab- und Feldwerte wirken können.

Kernmetriken sind LCP, CLS und INP/FID sowie die Gesamtladezeit der Hauptseite. Ein Sprung im PageSpeed-Score kann durch Reduktion großer Render-blockierender Ressourcen, Optimierung von Bildern und verbesserte Serverantwortzeiten erreicht werden. Es ist wichtig, Änderungen iterativ zu testen und nach jeder Maßnahme sowohl Lab- als auch Felddaten zu prüfen.

Technische Maßnahmen für Elementor-Seiten

Reduziere geladene Elementor-Assets pro Seite, indem ungenutzte Widgets und Funktionen deaktiviert werden. Tools zur selektiven Deaktivierung von Plugin-Assets (Asset-Manager, Plugin-Manager) können gezielt CSS/JS nur dort laden lassen, wo sie gebraucht werden. Dadurch sinkt die Menge an zu übertragenen Bytes und die Anzahl der Requests, was sich direkt auf LCP und First Input Delay auswirken kann.

Zusätzlich sind Bildoptimierung und moderne Formate wie WebP wichtig. Bilder sollten in passenden Auflösungen, mit korrekten Dimensionen und Lazy Loading bereitgestellt werden. Serverseitiges Caching, ein CDN und HTTP/2 bzw. HTTP/3 können die Netzwerklatenz weiter reduzieren. Auf Serverseite sind aktuelle PHP-Versionen, Opcache und PHP-FPM empfehlenswert, um Serverantwortzeiten zu verbessern.

Konkrete Schritte und Priorisierung

Beginne mit einer schnellen Analyse: aktive Plugins auditieren, große Assets identifizieren und TTFB messen. Als nächste Schritte sollten Bildoptimierung, Browser-Caching-Header und das Deaktivieren nicht benötigter Elementor-Module erfolgen. Priorisiere Maßnahmen, die geringe Implementationskosten haben und große Impact-Faktoren adressieren, etwa Bildkompression und Lazy Loading.

Für tiefere Optimierung können Critical CSS, Preload für Fonts und JS-Deferral eingesetzt werden. Diese Maßnahmen erfordern Tests auf unterschiedlichen Seitenvorlagen, weil Elementor oft globale Styles generiert. Wenn möglich, reduziere globale Einbindungen und lade Styles/Script nur auf Seiten, die sie benötigen. Parallel dazu sollte das Hosting bewertet und bei Bedarf auf einen leistungsfähigeren Provider gewechselt werden.

Empfehlungen für Agenturen und Entscheidungsträger

Agenturen sollten bei Projektannahme die Performance-Implikationen von Elementor offen darstellen und Optionen wie Custom-Themes oder leichtgewichtige Page-Builder diskutieren. Eine standardisierte Audit-Checkliste hilft, vor Projektstart technische Entscheidungen und Hosting-Anforderungen festzuhalten. Kunden sollten informiert werden, dass Bedienkomfort und Feature-Fülle bei Page-Buildern oft mit Mehrkosten in Optimierungsaufwand einhergehen.

Wenn ein externer Berater vorschlägt, Elementor zu meiden, ist das eine berechtigte Option, insbesondere bei hohen Performance-Anforderungen. Andererseits ist mit gezielten Maßnahmen auch auf Elementor-Basis eine sehr gute Performance erreichbar. Entscheidend sind Messung, Priorisierung und die Kombination aus Hosting, Asset-Management und Bildoptimierung.

• PageSpeed Insights (Google)
• Elementor Performance-Richtlinien

Transkript

[00:00] Ich arbeite für einen Kunden, der Elementor verwendet. Der PageSpeed war anfangs niedrig.

[00:05] Ursprünglich lag der Wert bei 59 und der Kunde meldete, die Seite sei zu langsam.

[00:08] Die Nutzeroberfläche wurde als zu langsam beschrieben.

[00:10] Ich habe Maßnahmen umgesetzt und wir messen jetzt einen Wert von etwa 90.

[00:14] Das Ergebnis ist noch nicht perfekt, aber deutlich besser.

[00:15] Dabei handelt es sich um eine Elementor-Seite auf einem mittelmäßigen Hoster.

[00:20] Angesichts des Providers ist das erzielte Ergebnis relativ gut.

[00:24] Oft wird empfohlen, Elementor einzusetzen, und Kunden folgen diesem Rat.

[00:28] Dann beauftragen sie häufig die erstbeste günstigere Agentur zur Umsetzung.

[00:33] Die Agentur setzt die Seite um und installiert Elementor, in der Hoffnung, das sei ausreichend.

[00:36] In der Praxis bleibt die Seite bei bestimmten Interaktionen langsam und dient als negatives Beispiel.

[00:46] Metaphorisch lässt sich sagen: Wenn die Seite wie ein Sattelschlepper ist, ist es schwer, sie schnell zu machen.

[00:52] Um schneller zu werden, muss man Ballast abwerfen und nicht benötigte Komponenten entfernen.

[00:55] Elementor bietet viele Funktionen, was für Einsteiger vorteilhaft ist, aber Performance kosten kann.

[01:00] Man muss aktiv beginnen, unnötige Features abzuschalten, damit die Seite vernünftig schnell wird.

[01:05] Es ist einfacher, mit einem schlanken Ansatz zu starten als später alles auszudünnen.

[01:10] Am Ende kann ein robustes System stehen, doch die initiale Reduktion ist deutlich effizienter.

[01:17] Spätere Bereinigung erfordert das Entfernen von Dateien, Optimierung von Assets und zusätzliche Arbeit.

[01:24] Aktuell liegen wir bei etwa 90 PageSpeed-Punkten, was akzeptabel ist.

[01:28] Teilweise sind Optimierungen auch Hosting-seitig erforderlich; parallel läuft die Bildoptimierung, die das Ergebnis verbessert.

[01:37] Wenn jemand empfiehlt, Elementor nicht zu verwenden, sollte man diese Empfehlung ernsthaft prüfen.

[01:43] Aussagen wie "Ich habe Elementor installiert und habe 100 Prozent PageSpeed" sind unrealistisch. Absolute Garantien gibt es nicht; Optimierung ist kontextabhängig.