Enthüllen Sie die Geheimnisse der SEO: Der ultimative Leitfaden zur Website-Geschwindigkeit

Veröffentlicht: 2018-08-07

Geschwindigkeit ist sowohl für Benutzer als auch für SEO wichtig: Niemand möchte mehrere Sekunden warten, bis eine Website geladen ist. Benutzer verlassen lieber Ihre Website und gehen zu einem Mitbewerber, als Zeit mit Warten zu verbringen. Das Zitat „Zeit ist Geld“ ist heute genauso wahr wie damals, als es Benjamin Franklin vor Jahrhunderten sagte. Zeit spielt auch für Google eine Rolle. Geschwindigkeit ist einer der Ranking-Faktoren von Google. Bei sonst gleichen Bedingungen gilt: Je schneller die Website, desto höher der Rang. Und es gibt niemanden, der bestreiten wird, dass eine schnelle Website heutzutage keine Notwendigkeit mehr ist. Die Frage ist: Wie können Sie Ihre Website schneller machen? Unser Gastautor in diesem Unwrapping the Secrets of SEO ist Tomek Rudzki, Leiter des Forschungs- und Entwicklungsteams bei Elephate, Gewinner der „Best Small SEO Agency“ bei den European Search Awards 2018. Rudzi bietet Ratschläge zur Beschleunigung Ihrer Website und zum Gewinnen.

Dieser umfassende Leitfaden zur Website-Geschwindigkeit enthält drei Artikel. Lesen Sie hier die folgenden Beiträge: The Ultimate Guide to Website Speed ​​– Part 2 und The Ultimate Guide to Website Speed ​​– Part 3.

Kostenlose Pagespeed-Studie

1. Zeit ist Geld

Es gibt zahlreiche Untersuchungen, die darauf hinweisen, dass eine schnellere Website mehr Umsatz bedeutet.

  • Pinterest erkannte, dass die Verringerung der wahrgenommenen Wartezeiten zu einer Steigerung der Anzahl der Anmeldungen um 15 % führte .
  • BBC hat festgestellt, dass jede weitere Sekunde, in der ihre Website geladen wird, 10 % der Benutzer verlassen.
  • DoubleClick by Google hat untersucht, dass eine Reduzierung der Seitenlast von 19 (extrem!) auf 5 Sekunden zu 35 % niedrigeren Absprungraten und 70 % längeren Sitzungen führte.
  • Die Studie von Amazon zeigt, dass nur eine Sekunde Verlangsamung des Website-Ladevorgangs zu 1,6 Milliarden Umsatzeinbußen pro Jahr führen kann.

Sie können sagen: „Okay, aber Pinterest, die BBC oder Amazon interessieren mich nicht; Sprechen Sie mit mir über MEIN Geschäft.'“ Google hat ein nettes Tool entwickelt, das die Auswirkung der Geschwindigkeit auf den potenziellen Umsatz berechnet . Ich habe das Tool mit den Beispieldaten gefüllt: Durchschnittliche monatliche Besucher 1.000.000, 3,26 % Konversionsrate, mit einem durchschnittlichen Bestellwert von 82 $.

Sie fragen sich vielleicht: „Tomek, warum haben Sie diese Daten ausgewählt: 3,26 Conversion-Rate, aber nicht 1 % oder 4 % oder sogar 10 %?“ Ok, die Daten habe ich von Statista. Ihren Berichten zufolge betrug der durchschnittliche Wert der Online-Shopping-Bestellungen in den Vereinigten Staaten im 4. Quartal 2017 (in US-Dollar) 82. Darüber hinaus betrug die durchschnittliche Conversion-Rate 3,26.

Es scheint, dass die Reduzierung der Seitenladegeschwindigkeit von 5 Sekunden auf 2,8 Sekunden zu 1,97 Millionen US-Dollar mehr Umsatz pro Jahr führen könnte. Klingt gut!

Natürlich ist es nur ein Taschenrechner. Aber der Rechner basiert auf realen Daten. Ich glaube nicht, dass Google am Ende des berechneten Werts ein paar Nullen hinzufügt, um es seriös aussehen zu lassen.

2. Denken Sie immer an mobile Benutzer

Laut Statcounter waren im Februar 2018 über 55 % der Nutzer über Handy oder Tablet mit dem Internet verbunden – eine beeindruckende Statistik!

Wenn Sie Ihre mobilen Benutzer heutzutage zufrieden stellen möchten, sollten Sie:

  • Stellen Sie sicher, dass Ihre Website auf Mobilgeräten einwandfrei funktioniert (d. h. wenn sie responsive ist)
  • Machen Sie die Website wirklich schnell.

Sie müssen bedenken, dass mobile Benutzer oft schlechte Verbindungen haben und Low-End-Geräte verwenden, sodass wirklich jedes Kilobyte zählt, das über das „Kabel“ gesendet wird. Ihre Website kann auf einem PC mit allen Extras schnell funktionieren, aber auf Mobilgeräten kann sie sehr langsam sein. Und die Chancen, dass Sie Ersteres bekommen, stehen nicht mehr zu Ihren Gunsten.

3. Verwenden Sie GTMetrix

Es gibt ein großartiges Tool, das Ihnen sagt, was Sie verbessern können, um Ihre Website schneller zu machen. Sie können jede Website kostenlos prüfen. Sie müssen kein Websitebesitzer sein, um ein Audit zu starten (dh ich habe Giphy.com auditiert). Das Tool kombiniert sowohl Daten als auch Hinweise von Google PageSpeed ​​Insights und Yahoo Slow.

Es lohnt sich, zu https://gtmetrix.com/ zu gehen und die URL Ihrer Website einzugeben.

Sie können die Liste der Empfehlungen zur Verbesserung der Geschwindigkeit Ihrer Website anzeigen, indem Sie entweder auf die Registerkarten „PageSpeed“ oder „YSlow“ klicken.

Im Moment sind viele Informationen auf diesen Registerkarten möglicherweise nicht verständlich, da sie zu technisch sind. Das ist gut. Rom wurde nicht an einem Tag erbaut. Ich werde mein Bestes tun, um Ihnen den Einstieg zu erleichtern. Es gibt einen interessanten Abschnitt namens „Wasserfall“, der Ihnen genau zeigt, wann die Ressourcen (JS- und CSS-Dateien, Bilddateien) heruntergeladen und geladen wurden.

Ich empfehle Ihnen dringend, sich ein GTMetrix-Konto zuzulegen (es ist kostenlos!). Registrierte Benutzer können den Test anpassen und den Browser- und Serverstandort ändern. Darüber hinaus können Sie nach dem Einloggen die Option „Video erstellen“ aktivieren. Die Videooption ist großartig. Es zeigt Ihnen, wie lange Benutzer warten müssen, bis sie die visuellen Änderungen auf Ihrer Website sehen können.

Aber mach dich nicht verrückt mit GTMetrix

Obwohl GTMetrix ein großartiges Tool ist, können seine Empfehlungen Sie manchmal auf eine wilde Gänsejagd führen. Es gibt nichts falsch mit GTMetrix. Es gibt nur keine Einheitsregel für die Geschwindigkeitsoptimierung – etwas, dessen sich GTMetrix bewusst ist:

Beispielsweise empfiehlt GTMetrix, dass Sie das Browser-Caching für Ressourcen einstellen, die auf dem Google Analytics- oder Facebook-Server gespeichert sind. Um die Wahrheit zu sagen, diese Ressourcen liegen außerhalb Ihrer Kontrolle – Sie können nichts tun . Die Entwickler von Google und Facebook entschieden, dass diese Ressourcen aus welchen Gründen auch immer nicht über einen längeren Zeitraum zwischengespeichert werden sollten.

Natürlich gibt es viele Tools, die GTMetrix ähnlich sind, wie z. B. WebPageTest (das viel leistungsfähiger als GTMetrix ist). Ich habe mich jedoch aus zwei Gründen entschieden, Ihnen GTMetrix vorzustellen:

  1. GTMetrix ist benutzerfreundlicher
  2. WebPageTest gibt Ihnen keine klaren Empfehlungen, was zu tun ist.

Ich möchte ein weiteres interessantes Tool erwähnen – Google Lighthouse (Wenn Sie Chrome verwenden, haben Sie es bereits installiert). Kamila Spodymek von Elephate hat einen großartigen Artikel darüber geschrieben, wie SEOs von den Leistungskennzahlen von Google Lighthouse profitieren können . Auf jeden Fall gut zu lesen!

4. Verwenden Sie die GZIP-Komprimierung

Es gibt eine Regel, die Sie kennen sollten: Wenn eine Ressource weniger wiegt, kann der Browser sie viel schneller herunterladen, was zu einem schnelleren Laden der Seite führt . Ihre mobilen Benutzer werden wirklich davon profitieren.

Sie können die Größe Ihrer Textdateien (wie HTML, SVG, CSS und JS) verringern, indem Sie die GZIP-Komprimierung implementieren. Es ist ziemlich üblich, dass die GZIP-Komprimierung 70-80 % der Ressourcengröße einspart, ohne dass Informationen verloren gehen. Es ist wirklich eine große Sache!

Besuchen Sie https://checkgzipcompression.com/ , um zu prüfen, wie viele Kilobyte Sie durch die Implementierung von GZIP einsparen (oder bereits einsparen!) können. Im Fall von Searchmetrics.com ist GZIP aktiviert (dadurch konnten 83 % der Seitengröße eingespart werden). Klingt gut!

Seien Sie jedoch vorsichtig! Manchmal machen Webmaster einen Fehler und komprimieren alle statischen Dateien, einschließlich JPEG, PNG-Bilder und PDFs. Lassen Sie mich die Yahoo Developer Network Documentation zitieren: „Bild- und PDF-Dateien sollten nicht gzippt werden, da sie bereits komprimiert sind. Der Versuch, sie zu gzip, verschwendet nicht nur CPU, sondern kann möglicherweise die Dateigröße erhöhen“.

Wenn Sie zusätzliche Kilobyte sparen möchten, ist es auch eine gute Idee, Ihre HTML-, JS- und CSS-Dateien zu verkleinern.

5. Skalierte Bilder bereitstellen

Es ist eine Tatsache, dass eine Website aufgrund einer großen Anzahl von Bildern sehr langsam geladen wird (insbesondere auf Mobiltelefonen!).

Daher kann es manchmal sinnvoll sein, die Anzahl der Bilder zu reduzieren. Aber anstatt sie einzuschränken, würde ich empfehlen, die bestehenden zu optimieren . Davon abgesehen sollten Bilder, die Ihren Benutzern bereitgestellt werden, skaliert und komprimiert werden (entweder verlustfrei oder verlustbehaftet).

Lassen Sie uns zunächst über das Skalieren der Bilder sprechen. Angenommen, es gibt zehn Miniaturansichten im Format 220 × 220 pro Seite, aber Sie haben Bilder im Format 800 × 800 auf den Server hochgeladen. Sollten Sie den Benutzern die bereits skalierten Bilder bereitstellen oder den Browser zwingen, sie „on the fly“ zu skalieren?

Die Antwort ist einfach. Wenn Sie die Bilder serverseitig nicht skalieren, muss der Browser viel mehr Kilobyte herunterladen als benötigt. Für nichts, weil Bilder sowieso skaliert werden. Außerdem ist es eine zusätzliche Aufgabe für die GPU auf der Clientseite. Ganz zu schweigen davon, dass die Ladegeschwindigkeit der Seite darunter leidet.

6. Komprimieren Sie Ihre Bilder

Lassen Sie uns nun über das Komprimieren von Bildern sprechen. Dies ist eine weitere Technik, die für das moderne Web unverzichtbar ist.

Im Allgemeinen gibt es zwei Arten der Bildkomprimierung:

  • Verlustfrei (macht einen wirklich guten Job, Sie können sicher sein, dass die Qualität nicht darunter leidet).
  • Verlustbehaftet (macht ein Bild normalerweise leichter, aber wie der Name schon sagt: Sie verlieren etwas von der Qualität).
https://www.geckoandfly.com/23620/jpeg-compression-tool-batch-lossy-lossless-optimization

Es stellt sich die Frage: Welche Art der Komprimierung ist besser: verlustfrei oder verlustbehaftet?

  • Es kommt wirklich auf die Situation an. Wenn Ihre Website Bilder aus dem Weltall anbietet, kommt es auf jedes Detail an. Aber wenn Sie ein persönliches Blog betreiben, würden Sie wahrscheinlich mit verlustbehafteter Komprimierung zurechtkommen, selbst mit einer hohen Komprimierungsrate. Ich empfehle Ihnen, zu experimentieren, um zu sehen, welche Einstellungen am besten zu Ihrer Website passen.

7. Zwingen Sie Ihre mobilen Besucher nicht, Full-HD-Fotos herunterzuladen!

Mobile Benutzer haben viel kleinere Bildschirme und sie werden einfach nicht von Ihren HD-Fotos profitieren. Stattdessen werden sie wütend, wenn Sie sie zwingen, große Bilder herunterzuladen.

Betrachten wir das Beispiel von Elephate.com . Wir haben ein ziemlich großes Foto (2600×1463 Pixel) unserer Firmenmitglieder oben auf unserer Homepage (522kb)

Es ist völlig in Ordnung für Desktops – sie können es sehr schnell herunterladen. Aber für mobile Benutzer verwenden wir die „srcset“-Parameter von HTML. Dank dieser Implementierung laden mobile Benutzer einfach ein viel kleineres Bild herunter (sie benötigen kein größeres), was sich positiv auf die Ladezeit der Seite auswirkt.

Desktop-Benutzer werden nicht leiden, da sie das Full-HD-Foto sehen. Aber mobile Benutzer werden wirklich davon profitieren.