Die meisten WordPress-Website-Besitzer wissen, wie frustrierend eine langsame Website sein kann. Sie haben die Grundlagen erledigt – Bilder komprimiert, Caching eingerichtet und die üblichen Geschwindigkeitstipps befolgt – aber Ihre Seiten laden immer noch zu lange.
Wir haben festgestellt, dass das Problem oft etwas Einfaches ist: Websites laden zu viele unnötige Daten herunter.
Technisch gesehen wird dies als „Netzwerknutzlast“ bezeichnet. Es ist einfach die Gesamtmenge an Daten, die zum Laden einer Seite erforderlich ist. Die gesamte Downloadgröße umfasst Text, Bilder, Videos, CSS, JavaScript, Schriftarten und anderen Code.
Grundsätzlich gilt: Je weniger Daten heruntergeladen werden müssen, desto schneller lädt die Seite.
Wenn Sie also die Geschwindigkeit Ihrer Website verbessern möchten, sind Sie hier genau richtig!
In diesem Leitfaden zeigen wir Ihnen genau, wie Sie die Größe dieser Dateien reduzieren und enorme Netzwerk-Payloads in WordPress vermeiden.
Warum sind riesige Netzwerk-Payloads in WordPress ein Problem?
Haben Sie schon einmal ein Tool wie Google Lighthouse oder PageSpeed Insights verwendet, um zu überprüfen, wie schnell Ihre Website ist?
Manchmal sehen Sie vielleicht eine Meldung wie „Vermeiden Sie riesige Netzwerk-Payloads“.
Im Wesentlichen bedeutet dies, dass Ihre Webseite zu groß ist, wie ein Koffer, der zu schwer zum Tragen ist. Eine große Webseite braucht länger zum Laden, was für Besucher Ihrer Seite frustrierend sein kann.
Die Netzwerknutzlast einer Webseite ist die Gesamtgröße aller Teile, aus denen diese Seite besteht. Dies beinhaltet:
- Text: Die Wörter, die Sie auf der Seite lesen
- Bilder & Medien: Bilder und Videos, die Sie sehen
- Code: Die CSS- und JavaScript-Dateien, die die Seite gut aussehen lassen und korrekt funktionieren
- Schriftarten: Die besonderen Stile für Ihren Text
- Plus, alle anderen benutzerdefinierten Elemente
Je größer all diese Elemente zusammen sind, desto länger dauert es, bis Ihre Webseite auf dem Bildschirm erscheint.
Wie groß ist zu groß? Hier ist ein einfacher Leitfaden:
- Gut: Wenn alle Teile Ihrer Webseite zusammen weniger als 2 MB ergeben, ist das, als würden Sie eine leichte Tasche tragen. Sie ist gut optimiert und lädt schnell. Hier müssen Sie sich keine allzu großen Sorgen machen.
- Verbesserungswürdig: Wenn Ihre Webseite zwischen 2 MB und 4 MB groß ist, ist das, als würden Sie einen Rucksack tragen, der ein wenig schwer wird. Möglicherweise gibt es einige Dinge, die Sie leichter machen können. Google gibt Ihnen einige Tipps, wie Sie sie schneller machen können.
- Riesig: Wenn Ihre Webseite mehr als 4 oder 5 MB groß ist, ist das, als würden Sie versuchen, einen riesigen, überfüllten Koffer zu tragen. Das wird Ihre Website für Ihre Besucher langsam machen, daher müssen Sie die Optimierung zur Priorität machen.
Wenn Sie die Meldung „Große Netzwerknutzlasten vermeiden“ sehen, können Sie auf den kleinen Pfeil klicken, um eine Liste aller Ressourcen anzuzeigen, aus denen Ihre Webseite besteht.
Sehen Sie, wie die größten Dateien oben in der Liste stehen? Wenn Sie sich darauf konzentrieren, diese Dateien kleiner zu machen oder unnötige Dateien zu entfernen, dann werden Sie die größte Verbesserung der WordPress-Leistung erzielen.
Indem Sie diese Dateien kleiner machen, verbrauchen Sie weniger Daten, um die Webseite anzuzeigen, und sie wird schneller geladen.
Jetzt, da Sie wissen, warum große Webseiten ein Problem darstellen, wollen wir untersuchen, wie Sie diese in WordPress vermeiden können. Hier sind die 8 Tipps, die wir in diesem Artikel behandeln werden:
- Machen Sie Ihre Bilder kleiner
- Videos richtig einbetten
- Lazy Loading für Bilder und Videos verwenden
- Reduzieren Sie die Größe und Anzahl von Javascript- und CSS-Dateien
- Dateien mit Gzip verkleinern
- Browser-Caching zur Vermeidung wiederholter Downloads nutzen
- Weniger Schriftarten oder Systemschriftarten verwenden
- Vermeiden Sie langsame Plugins
- Frequently Asked Questions About Network Payloads in WordPress
Sind Sie bereit? Lassen Sie uns direkt eintauchen!
1. Machen Sie Ihre Bilder kleiner
Eine der größten Ursachen für große Netzwerknutzlasten sind große Bilder.
Heutige Smartphones und Kameras nehmen qualitativ hochwertige Bilder mit sehr großen Dateigrößen auf. Aber Sie müssen sie nicht so groß lassen, wenn Sie sie auf einer Website anzeigen.
Glücklicherweise können Sie Bilder optimieren, um sie bis zu 80 % kleiner zu machen, ohne die Bildqualität zu verlieren. Dies hat einen größeren Einfluss auf die Netzwerknutzlast Ihrer Website als fast alles andere.
Bei WPBeginner optimieren wir alle unsere Bilder, bevor wir sie hochladen. Wir passen die Größe unserer Bilder an die richtigen Abmessungen an und reduzieren dann ihre Dateigröße mit verschiedenen Tools.
Wir haben einen hilfreichen Leitfaden zusammengestellt, der auf genau dem basiert, was wir auf unserer eigenen Website tun. Sie können unseren Artikel über die Optimierung von Bildern für Web-Performance ohne Qualitätsverlust befolgen.
2. Videos richtig einbetten
Wenn Sie Videos auf Ihrer Website haben, müssen Sie vorsichtig sein, wie Sie sie anzeigen.
Das direkte Hochladen von Videos auf Ihre Website kann zu großen Netzwerklasten führen und Ihre Website erheblich verlangsamen, insbesondere wenn sie automatisch abgespielt werden.
Der beste Weg, Videos einzubinden, ist, sie von Videoplattformen wie YouTube oder Vimeo einzubetten.
☝ Hinweis: Wir verwenden YouTube, um unsere Videos zu hosten und zu streamen. Sie können unsere WordPress-Video-Tutorials auf dem WPBeginner YouTube-Kanal erkunden.
Dieser Ansatz ermöglicht es Ihnen weiterhin, Videos auf Ihrer Website abzuspielen, aber da sie tatsächlich auf dem Server eines anderen gespeichert sind, sind sie nicht Teil Ihrer Netzwerknutzlast.
Das hilft wirklich, da Ihr Server keine großen Datenübertragungen bewältigen muss. Außerdem sind diese Plattformen darauf ausgelegt, Videos effizient zu liefern, mit optimiertem Streaming, das sich an die Internetverbindung Ihres Besuchers anpasst.
Außerdem laden viele Videoplayer von diesen Plattformen das Video erst, wenn der Benutzer auf „Wiedergabe“ klickt, was bedeutet, dass anfangs weniger Daten übertragen werden.
Sie können die Videos ganz einfach mit Einbettungscode auf Ihrer Website hinzufügen.
Weitere Informationen zu diesem Thema finden Sie in unserem Leitfaden Warum Sie niemals ein Video auf WordPress hochladen sollten.
3. Verwenden Sie Lazy Loading für Bilder und Videos
Lazy Loading ist eine weitere großartige Möglichkeit, große Netzwerklasten zu vermeiden, insbesondere wenn Ihre Website voller Bilder oder Videos ist.
Normalerweise möchte der Browser beim Laden einer Webseite sofort alle Bilder und Videos herunterladen, auch wenn sie nicht sofort sichtbar sind.
Stellen Sie sich vor, ein Restaurant würde Ihnen alle Gänge auf einmal servieren, anstatt nacheinander. Das wäre überwältigend!
Dies geschieht auf einer Webseite, wenn Lazy Loading nicht implementiert ist. Alles muss im Voraus heruntergeladen werden, auch wenn der Benutzer es noch nicht sehen kann.
Das ist offensichtlich nicht ideal, da es bedeutet, dass Ihre Website eine große Nutzlast hat und Sie viele Daten herunterladen, auch wenn der Benutzer den Inhalt am Ende der Seite nicht anzeigt.
Die Lösung dafür nennt sich Lazy Loading.
Lazy Loading ist wie dieses Restaurant, das jeden Gang Ihres Essens serviert, wenn Sie bereit dafür sind.
Beim Lazy Loading werden Bilder und Videos erst geladen, wenn sie kurz davor sind, im sichtbaren Bereich des Nutzers auf dem Bildschirm zu erscheinen. Auf diese Weise muss der Browser nur das laden, was wann benötigt wird.
Dies reduziert die anfängliche Netzwerklast und die Menge der herunterzuladenden Daten.
Hier sind einige hilfreiche Tutorials, die Ihnen zeigen, wie Sie Lazy Loading in WordPress einrichten:
- Bilder in WordPress einfach per Lazy Load laden
- So fügen Sie ganz einfach Lazy Loading für Videos in WordPress hinzu
- Gravatare in WordPress-Kommentaren per Lazy Load laden
4. Reduzieren Sie die Größe und Anzahl von Javascript- und CSS-Dateien
Eine der besten Methoden, um große Netzwerk-Payloads auf Ihrer Website zu vermeiden, ist die Reduzierung der Größe Ihrer CSS- und JavaScript-Dateien.
Ihre Website verwendet CSS-Dateien für das Styling und JavaScript-Dateien für interaktive Funktionen.
Diese Dateien enthalten jedoch oft zusätzlichen Leerraum und Kommentare, die für die Funktionalität des Codes nicht benötigt werden. Sie können diese Elemente sicher entfernen, um die Dateigröße zu reduzieren.
Das bedeutet, dass diese Dateien weiterhin auf die gleiche Weise funktionieren, aber es werden weniger Daten für Ihre Benutzer zum Herunterladen vorhanden sein, wodurch Ihre Seite schneller geladen wird.
Dieser Prozess wird als Minifizierung bezeichnet, und die gute Nachricht ist, dass du ein WordPress-Plugin wie WP Rocket verwenden kannst, um deine Dateien automatisch zu minifizieren.
Sehen Sie sich unseren Leitfaden an, wie Sie CSS- und JavaScript-Dateien in WordPress minimieren, um weitere Informationen zu erhalten.
Nun haben verschiedene Teile Ihrer Website normalerweise unterschiedliche CSS- oder JavaScript-Dateien. Zum Beispiel eine Datei für den Header, eine für den Body und vielleicht sogar mehr für Plugins.
Aber viele kleinere Dateien können weniger effizient sein als eine größere Datei. Wenn viele Dateien geladen werden müssen, muss der Browser jede einzelne separat abrufen, was die Gesamt-Downloadgröße erhöht. Stattdessen können Sie viele dieser kleineren Dateien zu einer einzigen Datei zusammenfassen.
Beliebte Plugins wie WP Rocket (Premium) und Autoptimize (kostenlos) können CSS- und JavaScript-Dateien automatisch kombinieren und minimieren.
Sie können lernen, wie Sie diese Plugins verwenden, in unserem Leitfaden zum Thema Beheben von Render-Blocking JavaScript und CSS in WordPress.
5. Dateien mit Gzip verkleinern
Eine weitere Möglichkeit, Ihre Website-Dateien kleiner zu machen, ist das Komprimieren. Textbasierte Dateien wie HTML, CSS und JavaScript können mit Gzip-Komprimierung erheblich reduziert werden.
Tatsächlich kann die Gzip-Komprimierung die Größe dieser Dateien oft um bis zu 70 % reduzieren, bevor sie an den Browser des Benutzers gesendet werden! Dies ist eine enorme Einsparung bei der Menge der zu übertragenden Daten.
Es reduziert die Downloadzeit von Dateien und lässt Ihre WordPress-Website viel schneller laden. Sobald die komprimierten Daten auf dem Computer Ihres Besuchers ankommen, entpackt (dekomprimiert) der Browser die Dateien automatisch und zeigt sie auf dem Bildschirm des Benutzers an.
Sie müssen sich keine Sorgen machen, ob die Browser Ihrer Benutzer Gzip-Komprimierung unterstützen, da diese heute in allen gängigen Webbrowsern funktioniert.
Viele ausgezeichnete Caching-Plugins unterstützen auch die Gzip-Komprimierung. Beliebte Optionen sind WP Rocket, WP Super Cache und W3 Total Cache.
Wir haben zuvor WP Rocket auf der WPBeginner-Website verwendet und hatten eine großartige Erfahrung. Weitere Informationen finden Sie in unserem vollständigen WP Rocket-Testbericht.
Mit WP Rocket wird die Gzip-Komprimierung automatisch aktiviert, wenn Ihr Webhost den Apache-Server verwendet. Bei anderen Caching-Plugins müssen Sie sie möglicherweise in den Einstellungen des Plugins aktivieren.
Detaillierte Anweisungen finden Sie in unserem Leitfaden zum Thema Aktivieren von Gzip-Komprimierung in WordPress.
6. Verwenden Sie Browser-Caching, um wiederholte Downloads zu verhindern
Eine weitere Möglichkeit, eine enorme Netzwerklast in WordPress zu vermeiden, insbesondere wenn Ihre Website viele wiederkehrende Besucher hat, ist Browser-Caching.
Stellen Sie sich vor, Ihre Besucher müssten jedes Mal, wenn sie Ihre Website besuchen, alles herunterladen! Das wäre unglaublich langsam, und genau das passiert, wenn Sie kein richtiges Caching verwenden.
Wenn jemand Ihre Website zum ersten Mal besucht, lädt sein Browser alles herunter, was er benötigt: die Bilder, das CSS, das JavaScript und alle anderen Ressourcen. Mit Browser-Caching speichert sein Browser eine Kopie dieser Dateien auf seinem Computer.
Dann, wenn sie Ihre Website das nächste Mal besuchen, ist ihr Browser schlau! Er prüft seine lokal gespeicherten Dateien, bevor er Ihren Server erneut nach allem fragt.
Wenn der Browser eine Kopie einer Datei in seinem Cache hat, verwendet er diese einfach, anstatt sie erneut herunterzuladen. Dies trägt erheblich zur Reduzierung der gesamten Netzwerklast bei und bietet Stammbesuchern ein schnelleres und reibungsloseres Erlebnis.
Natürlich, wenn sich der Inhalt Ihrer Website häufig ändert, wie z. B. bei einer Nachrichten-Website oder einem regelmäßig aktualisierten Blog, müssen Sie den Browsern mitteilen, wann sie die neuesten Versionen Ihrer Dateien erneut herunterladen sollen. Dies stellt sicher, dass jeder die aktuellsten Inhalte erhält.
Sie können dies steuern, indem Sie Expires-Header in WordPress hinzufügen. Diese Header teilen dem Browser mit, wann eine gespeicherte Datei als veraltet gilt und aktualisiert werden muss.
7. Weniger Schriftarten oder Systemschriftarten verwenden
Schriftarten können Ihre Website großartig aussehen lassen und die Lesbarkeit verbessern. Die Verwendung von benutzerdefinierten Schriftarten kann Ihre Website einzigartig machen und Ihre Besucher dazu ermutigen, mehr Zeit mit dem Surfen zu verbringen.
Aber stellen Sie sich vor, Sie müssten jedes Mal, wenn Sie eine Website besuchen, viele verschiedene Schriftarten herunterladen. Es würde eine Weile dauern, bis alles auf der Seite angezeigt wird.
Der Schlüssel ist, eine kleine Anzahl von Schriftarten auf Ihrer Website zu verwenden. Wir empfehlen, sich an nur zwei Hauptschriftarten zu halten und diese auf Ihrer gesamten Website zu verwenden. Dies reduziert die Gesamtzahl der Dateien, die Ihre Besucher herunterladen müssen.
Noch besser, Sie können Systemschriftarten anstelle von benutzerdefinierten Schriftarten verwenden.
Systemschriftarten sind Schriftarten, die bereits auf den Computern der Benutzer installiert sind. Stellen Sie sich das wie die Verwendung der Standard-Schriftarten auf Ihrem Computer vor, wie Arial oder Times New Roman.
Wenn Sie Systemschriftarten für Ihre Website wählen, müssen Ihre Benutzer überhaupt keine zusätzlichen Dateien herunterladen! Dies reduziert die Größe Ihrer Netzwerknutzlast erheblich und macht Ihre Website für Besucher schneller.
Weitere Informationen finden Sie in unserem Leitfaden unter so deaktivieren Sie Google Fonts auf Ihrer WordPress-Website.
8. Vermeiden Sie langsame Plugins
Schließlich sprechen wir über Plugins. Manchmal können Plugins Ihre Website verlangsamen und die Größe Ihrer Netzwerknutzlast erhöhen, indem sie viele zusätzliche JavaScript- und CSS-Dateien laden.
Sie sollten Plugins als zusätzliche Werkzeuge betrachten, die Sie zu Ihrer Website hinzufügen. Einige sind großartig und leichtgewichtig, während andere ziemlich schwer sein können. Die Verwendung zu vieler schwerer Plugins kann die Downloadgröße Ihrer Website erhöhen.
Es ist auf den ersten Blick schwer zu erkennen, welche Plugins langsam sind, daher müssen Sie etwas recherchieren. Weitere Informationen finden Sie in unserem Leitfaden unter welche WordPress-Plugins Ihre Website verlangsamen.
Sobald Sie die Plugins gefunden haben, die die Downloadgröße Ihrer Seite erhöhen, haben Sie einige Optionen.
Zuerst können Sie den Plugin-Entwickler kontaktieren und sehen, ob Sie etwas tun können, um das Plugin effizienter zu gestalten. Oder Sie suchen nach einem schnelleren Plugin, das dasselbe tut.
Empfehlungen finden Sie in unserem Leitfaden zur Auswahl der besten WordPress-Plugins: wie Sie die besten WordPress-Plugins auswählen.
👉 Verwandter Beitrag: Sind Sie ein wenig nervös, wenn Sie sich an einen Plugin-Entwickler wenden? Lesen Sie unseren Leitfaden, wie Sie richtig nach WordPress-Support fragen (und ihn erhalten).
Manchmal stellen Sie fest, dass einige der schweren Plugins für Ihre Website unerlässlich sind. In diesem Fall können Sie Ihre Website trotzdem schneller machen, indem Sie das Plugin nur auf den Seiten laden, die es benötigen, anstatt es überall zu laden.
Sie können ein kostenloses Plugin namens Plugin Organizer verwenden, um Plugins auf Seiten zu deaktivieren, auf denen sie nicht benötigt werden. Dies verringert die Netzwerknutzlast auf diesen Seiten.
Häufig gestellte Fragen zu Netzwerknutzdaten in WordPress
Hier sind einige der häufigsten Fragen, die Menschen zum Reduzieren von Netzwerk-Payloads in WordPress stellen. Diese Antworten helfen Ihnen, die technischen Aspekte und Implementierungsdetails besser zu verstehen.
1. Was genau ist eine Netzwerknutzlast und warum ist sie für meine WordPress-Website wichtig?
Eine Netzwerknutzlast ist die Gesamtmenge an Daten (Bilder, CSS, JavaScript, HTML usw.), die Ihre Website an den Browser eines Besuchers sendet, wenn dieser eine Seite lädt. Große Nutzlasten verlangsamen Ihre Website, da Besucher mehr Daten herunterladen müssen, was besonders problematisch für mobile Nutzer oder Personen mit langsameren Internetverbindungen ist. Google berücksichtigt auch die Größe der Nutzlast bei der Bewertung von Websites, sodass deren Optimierung Ihr SEO verbessern kann.
2. Wie kann ich meine aktuelle Netzwerk-Payload-Größe überprüfen?
Sie können Ihre Netzwerklast mit Google PageSpeed Insights, GTmetrix oder den Entwicklertools Ihres Browsers überprüfen. In Chrome drücken Sie F12, gehen Sie zum Tab 'Netzwerk' und laden Sie Ihre Seite neu. Die Gesamtgröße wird unten angezeigt. Im Allgemeinen möchten Sie Ihre Gesamtlast für eine optimale Leistung unter 1-2 MB halten.
3. Beeinflusst die Reduzierung von Netzwerknutzdaten die Funktionalität oder das Design meiner Website?
Nicht, wenn es richtig gemacht wird. Die Techniken konzentrieren sich auf die Optimierung und Komprimierung vorhandener Inhalte anstatt auf die Entfernung von Funktionen. Sie behalten die gleiche Funktionalität und das gleiche visuelle Erscheinungsbild bei, während die Inhalte effizienter bereitgestellt werden. Testen Sie Änderungen jedoch immer zuerst auf einer Staging-Website, um sicherzustellen, dass alles ordnungsgemäß funktioniert.
4. Wie oft sollte ich meine Netzwerk-Payloads optimieren?
Sie sollten Ihre Payloads monatlich überwachen und optimieren, wann immer Sie neue Inhalte, Plugins oder Themes hinzufügen. Richten Sie regelmäßige Audits mit Tools wie Google Search Console ein, um Ihre Core Web Vitals zu verfolgen. Größere Optimierungen sind möglicherweise vierteljährlich erforderlich, aber die laufende Wartung sollte Teil Ihrer regulären WordPress-Wartungsroutine sein.
5. Kann ich Netzwerk-Payloads ohne technisches Wissen reduzieren?
Ja, viele Optimierungstechniken können mit benutzerfreundlichen Plugins wie WP Rocket, Smush oder Autoptimize implementiert werden. Diese Tools kümmern sich automatisch um Bildkomprimierung, Dateiminimierung und Caching. Für fortgeschrittene Optimierungen benötigen Sie jedoch möglicherweise Hilfe von einem Entwickler oder WordPress-Experten.
Bonus: Experten-Anleitungen zur WordPress-Performance
Wir hoffen, dieses Tutorial hat Ihnen geholfen zu lernen, wie Sie riesige Netzwerklasten in WordPress vermeiden können. Möglicherweise möchten Sie auch einige Anleitungen zu anderen Möglichkeiten zur Verbesserung der WordPress-Leistung lesen:
- Der ultimative Leitfaden zur Steigerung von WordPress-Geschwindigkeit & Leistung
- Warum ist WordPress langsam? Erfahren Sie, wie Sie es beheben können
- So beschleunigen Sie Ihre E-Commerce-Website
- Wie wir die Seitenladezeit auf WPBeginner verbessern
- So führen Sie einen Website-Geschwindigkeitstest richtig durch
- Die besten WordPress-Caching-Plugins, um Ihre Website zu beschleunigen
- Warum brauchen Sie ein CDN für Ihren WordPress-Blog?
- Wie Sie HTTP-Anfragen in WordPress reduzieren
- So lagern Sie WordPress-Medien aus, um die Website-Geschwindigkeit zu verbessern
- WordPress-Datenbankwartung: So optimieren Sie Ihre Datenbank
Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.
Haben Sie eine Frage oder einen Vorschlag? Hinterlassen Sie bitte einen Kommentar, um die Diskussion zu beginnen.