8 Tipps zur Optimierung Ihrer Website-Geschwindigkeit

Veröffentlicht: 2022-08-03


Wie schnell ist Ihre Website?

Wir alle wissen, dass sich eine langsame Website negativ auf das Nutzerverhalten auswirkt. Aber tun Sie wirklich alles, um die Geschwindigkeit Ihrer Website zu minimieren?

Heute diskutieren wir acht Tipps zur Optimierung der Seitengeschwindigkeit mit einem Mann, dessen Lieblingsbeschäftigungen Webentwicklung, Petrologie, WordPress, Science-Fiction und Gin sind. Und wer ist am glücklichsten, wenn er knietief in PHP steckt, auf der Bühne steht oder ein gutes Buch liest. Er ist Digitalstratege, Technologe für digitales Marketing und Full-Stack-Entwickler und Leiter der SEO-Abteilung bei Yoast.

Herzlich willkommen zum In Search SEO-Podcast von Jono Alderson.

Die acht Schritte sind:
  1. Core Web Vitals
  2. Wolkenflare
  3. Chrome-Entwicklertools
  4. Fortgeschrittene Bildoptimierungstechniken
  5. Fortgeschrittene Techniken zur Schriftoptimierung
  6. CSS- und JavaScript-Tricks
  7. Caching und Versionierung
  8. Cleveres Drittanbieter-Kit





Acht wesentliche Elemente schneller Websites



J: Hey, schön hier zu sein. Danke für die Einladung. Das ist superspannend.

D: Hervorragend, Jono. Gut, dass du dabei bist. Sie finden Jono auf jonoalderson.com. Also, Jono, was würdest du sagen, ist die aktuelle Haltung dazu, wie sich eine langsame Website tatsächlich auf das Benutzerverhalten auswirkt?

J: Es gibt so viel Forschung. Und ich denke, nichts davon ist neu. Es gibt Forschungen, die Jahrzehnte zurückreichen. Und all das besagt, dass es einen überraschend direkten Zusammenhang zwischen der Anzahl von Millisekunden, die Sie die Leute warten lassen, und dem Einfluss auf die Wahrscheinlichkeit gibt, etwas zu kaufen. Es ist wahrscheinlich nicht so, dass die Leute bewusst sagen: "Oh, das hat 200 Millisekunden zu lange gedauert und ich kaufe bei Ihrem Konkurrenten ein." Aber es ist eine Zeit, in der sie vielleicht aus dem Fenster schauen oder einen anderen Tab öffnen oder sich fragen, was es zu Mittag gibt, und all das untergräbt ihre Wahrscheinlichkeit, im Moment zu bleiben und zu konvertieren oder zu handeln.

Ich habe kürzlich eine wirklich interessante Studie von Deloitte, einem großen Beratungsunternehmen, gesehen. Und sie haben sich etwa eine Teilmenge von 50 der größten unterschiedlichen Websites in den Bereichen E-Commerce und Lead-Generierung und verschiedenen Sektoren in Großbritannien und den USA angesehen. Und sie fanden so etwas wie eine Verzögerung von 200 Millisekunden, das ist die Zeit, die Sie brauchen, um zu blinzeln, wodurch die Website-Geschwindigkeit um etwa 10 % reduziert wird. Und dies ist nur eine solche Studie. Es gibt viele davon. Und alle sagen, dass schneller, schlanker, zugänglicher und benutzerfreundlicher einfach mehr Geld bedeutet. Also ja, es ist ein Kinderspiel für uns, uns das anzusehen.

D: Ich erinnere mich, dass ich eine Studie von Amazon gesehen habe, ich glaube, das war vor über 10 Jahren, aber ich hatte keine aktuellen Statistiken darüber gesehen. Aber es ist sicherlich auch alles vergleichend. Denn wenn die Leute daran gewöhnt sind, auf anderen Websites zu surfen, und sie Ihre Website als viel langsamer als andere Websites ansehen, werden sie nicht allzu lange bleiben.

J: Ja, und die Leute denken wirklich nicht darüber nach. Sie denken, dass ihre Website wahrscheinlich schnell genug ist. Aber die Websites Ihrer Konkurrenten werden schneller, Facebook wird schneller, Instagram wird schneller und die Erwartungen an die Basis dieser Benutzererfahrung ändern sich. Sie müssen also schneller werden als erwartet, sonst werden Sie vergleichsweise langsamer.

D: Heute teilen Sie also die wesentlichen Elemente schneller Websites, beginnend mit Nummer eins, Core Web Vitals.



1. Wichtige Web-Vitals



J: Ich denke, es könnte noch mehr davon geben. Aber das ist definitiv meine Go-To-Liste. Ich bin mir sicher, dass inzwischen jeder von Core Web Vitals gehört hat. Aber falls nicht, Google hat das, glaube ich, Mitte 2020 auf den Markt gebracht. Und es ist ihr Versuch, eine Art standardisierte, universelle Metriken zu erstellen, um zu messen, was PageSpeed ​​ist. Denn technisch und konzeptionell ist es ziemlich komplex. Beim Laden von Seiten gibt es alle möglichen Phasen und alle möglichen Dinge, die sich darauf auswirken. Also vereinfachten sie es zu einer Reihe von Metriken, die Sie im Laufe der Zeit überwachen, entwickeln und analysieren können.

Das wirklich Schöne daran ist, dass dies nur Schritt eins ist. Im Moment gibt es drei Metriken und wir bekommen dieses Jahr zwei weitere. Die Metriken selbst entwickeln sich weiter. Dies wird zu einem ausgereiften Ökosystem, um harte Zahlen gegen diese Art von Messungen zu stellen, was bedeutet, dass es als Online-Unternehmen viel einfacher wird zu sagen, dass wir nicht sehr gut abschneiden und unsere Konkurrenten besser abschneiden. Wir wissen, dass die gesamte Forschung dies mit dem Umsatz in Verbindung bringt, also sollten wir uns darauf konzentrieren, dies zu verbessern. So haben wir plötzlich eine Möglichkeit, die Beteiligten davon zu überzeugen, dass nicht nur die Seitengeschwindigkeit wichtig ist, sondern wir haben auch eine Messung, der alle zustimmen werden, die nicht eigensinnig ist und die nicht der SEO-Typ in der Ecke sagt, dass er das tut stimmt nicht mit dem Entwickler in dieser Ecke überein und hat nicht wirklich eine gemeinsame Sprache. Das ist also ein wirklich mächtiges Business-Tool, geschweige denn nur eine technische Maßnahme.

D: Ich weiß, Ihr Gehirn sagt, dass Sie sich nicht dazu verpflichten können, zu sagen, dass es nur die acht wichtigsten und schnellsten Dinge gibt, die Sie tatsächlich tun können, um Ihre Website zu verbessern. Ich weiß, dass Ihr Gehirn im Moment tatsächlich an 1024 Dinge denken kann, aber wir teilen nur die acht ursprünglichen Ideen, die Sie sich ausgedacht haben, die wir gerade ein wenig früher besprochen haben. Nummer zwei war also Cloudflare.



2. Wolkenflare



J: Wenn ich nur genug Zeit und Ressourcen hätte, um nur eine Sache zu tun, um meine Website schneller zu machen, wäre es Cloudflare. Cloudflare ist riesig. Sie sind eines der größten technischen Technologieunternehmen im Weltraum. Dennoch gibt es Tonnen von Entwicklungsteams und Unternehmen, die verständlicherweise noch nie von ihnen gehört haben, weil es ein bisschen nerdig ist. Cloudflare ist ein Content-Delivery-Netzwerk. Es ist ein Stück Infrastruktur, das sich vor Ihrer Website befindet. Sie haben eine kostenlose Version. Der Aufbau dauert etwa 10 Minuten. Und sie verwenden einfach Magie, um Ihre Website zu beschleunigen. Sie verkleinern automatisch Ihre Bilder, sie verkleinern Ihr JavaScript, sie ändern, wie Dinge geladen werden, sie stellen sicher, dass Verbindungen rund um den Globus für verschiedene Zwecke an verschiedenen Orten effizienter geroutet werden, und 1000 andere Dinge. Und das sind alles Dinge, die Sie theoretisch tun könnten, wenn Sie ein Entwicklerteam hätten, das sehr schlau und sehr gut ausgestattet ist. Aber warum sollten Sie, wenn das kostenlose Cloudflare-Produkt das meiste macht und das 20-Dollar-pro-Monat-Produkt so ziemlich den ganzen Rest erledigt?

Wenn Sie also eine Website haben, die vielleicht nicht sehr gut abschneidet, die vielleicht ein bisschen langsam ist, können Sie eine Website, die sechs Sekunden zum Laden braucht, auf zwei Sekunden reduzieren, indem Sie einfach auf ein paar der Schaltflächen klicken. Das Grundniveau ist phänomenal, aber mit den Power-Usern und fortgeschrittenen Fällen können Sie noch weiter gehen. Man kann sagen, dass ich Cloudflare stärker in die Funktionsweise meiner Website integrieren möchte. Und ich möchte einen Teil dieser Geschäftslogik auslagern. Und ich möchte dieses Tagging und Tracking in Google Analytics am Edge in der Cloud in der Nähe des Benutzers ausführen. Es ist ein phänomenales Tool für Fälle, in denen es schwierig ist, die Website selbst schneller zu machen, oder sie auf veralteter Hardware läuft, oder das Hosting ein bisschen naff ist, Sie können Cloudflare tatsächlich dazu bringen, sich vor all das zu setzen, und haben es nie getan sich wieder darum zu kümmern. Das wirft einige interessante Fragen dazu auf, für wie viele verschiedene Teile des Stacks sie verantwortlich sind und wie viel Geschäftslogik Sie entlasten möchten. Aber als schneller Hack ist es ein phänomenales Werkzeug.

D: Und drittens: Verwenden Sie die Chrome Developer Tools, um Leistungsengpässe zu erkennen.



3. Chrome-Entwicklertools



J: Ja, das Ausführen von Core Web Vitals-Tools wie PageSpeed ​​Insights und Web Page Test gibt Ihnen Top-Level-Ergebnisse und einige allgemeine Ratschläge. Und das Problem mit allgemeinen Ratschlägen wie der Verwendung von weniger JavaScript ist, dass es nicht wirklich einfach sein wird, dies auf Ihre Website und Ihre Herausforderungen anzuwenden. Ihre Website ist einzigartig, sie ist auf eine ganz bestimmte Art und Weise eingebaut. Wenn Sie die nächste Ebene erreichen wollen, um wirklich zu erkennen, wo die Möglichkeiten liegen, müssen Sie sich ansehen, wie Ihre Website geladen wird. Und eines der besten Tools, die Sie dafür verwenden können, sind die Chrome Developer Tools.

Ich bin auf einem Windows-Computer. Also drücke ich F12 in einem Browser, ich bin mir sicher, dass es ein Mac-Äquivalent gibt, und ich bekomme die Inspect-Übersicht. Sie können auf die Registerkarte Netzwerk klicken und erhalten ein Wasserfalldiagramm, das Ihnen alle Dinge zeigt, die auf Ihrer Seite geladen werden, in der Reihenfolge, in der sie geladen werden, und wie lange sie dauern. Und wenn Sie ein paar Mal auf „Aktualisieren“ klicken, können Sie beobachten, wie das passiert, und Sie beginnen, Muster zu erkennen. Und Sie müssen kein sehr gründlicher Entwickler sein, um zu sehen, dass diese eine bestimmte Sache doppelt so lange dauert wie alles andere. Und es hält eine Menge Zeug. Und da es sich um ein großes JPEG handelt, sollten wir dieses JPEG vielleicht verkleinern. Um Ihre Website zu diagnostizieren, insbesondere Seite für Seite oder Vorlage für Vorlage, ist dies eine leistungsstarke Methode, um zu sehen, wo die größten Übeltäter sind.

Und ja, es gibt Nuancen darüber hinaus, aber zu wissen, wie man den größten Engpass behebt, bedeutet, dass alles, was zurückgehalten wird, dann schneller geladen wird. Und um die Rosinen herauszupicken und einfache Gelegenheiten zu erkennen, ist dies eine großartige Herangehensweise. Finden Sie das Ding, das andere Dinge aufhält, und machen Sie das ein bisschen schneller. Und Sie können davon einen Screenshot machen und an Ihre Entwickler weitergeben usw. Und sie sollten in der Lage sein, anzugreifen, was auch immer das ist.

D: Und viertens, verwenden Sie fortschrittliche Bildoptimierungstechniken.



4. Fortgeschrittene Bildkomprimierungstechniken



J: Ja, ich habe große JPEGs als Beispiel erwähnt. Und das ist immer noch peinlich üblich. Einer der Hauptgründe dafür, dass viele Websites langsam sind, ist, dass jemand ein 10-Megabyte-GIF auf seine Homepage hochgeladen oder ein Foto mit seinem Mobiltelefon oder seiner Kamera aufgenommen und es einfach in das CMS eingefügt hat. Und es gibt keine Logik, die sagt, vielleicht sollten wir das ein bisschen verkleinern. Vielleicht sollten wir es der Größe anpassen. Wenn Sie sich die Chrome Developer Tools und Cloudflare ansehen, werden Sie oft feststellen, dass der Engpass darin besteht, dass das Laden dieses Bildes nur lange dauert, weil es so groß ist. Es gibt alle Arten von Tools, die Sie verwenden können, um dies zu beheben. Das Wichtigste ist, dass jeder Prozess, den Sie verwenden, um diese Bilder zu erstellen, wahrscheinlich einen Workflow hat. Wenn Sie Sachen in Photoshop erstellen, stellen Sie beim Exportieren von Sachen sicher, dass Sie für das Web exportieren. Überlegen Sie, ob dieses JPEG wirklich eine perfekte Pixelqualität haben muss oder ob wir die Qualität ein wenig reduzieren und vielleicht an Dateigröße sparen können. Wenn das alles ein bisschen technisch ist, gehen Sie zu squoosh.app. Squoosh ist ein Tool, das von einigen Mitgliedern des Google-Entwicklungsteams entwickelt wurde. Sie sind super nerdig, sie stehen wirklich auf den Bildraum. Sie ziehen Ihr Bild per Drag & Drop hinein. Und es gibt Ihnen Optionen, auf die Sie klicken können, wo Sie ein PNG in JPEG ändern können. Sie ziehen und legen ab und können dabei sehen, wie sich die Qualität im Bild ändert. Bin ich mit diesem Kompromiss zufrieden? Und es gibt eine ganze Reihe erweiterter Kontrollkästchen, auf die ich klicken und sehen kann, was passiert, und hier und da noch ein paar Kilobyte einsparen. Und Sie können sehr einfach ein Bild von 2 Megabyte bis zu 200 Kilobyte in nur wenigen Sekunden durch Ziehen und Ablegen und Spielen mit den Einstellungen erhalten. Es ist nicht sehr in Ihre Arbeitsabläufe integriert, aber als schnelle Lösung, um einige dieser großen Engpässe zu verkleinern, ist es wirklich cool.

D: Ja, ich muss die Bildoptimierung in den Griff bekommen, weil ich es ungern zugeben muss, aber ich verwende eigentlich immer noch Macromedia Fireworks, um Software zu produzieren.

J: Oh, ich vermisse Feuerwerk. Es gab ungefähr ein gutes Jahrzehnt, in dem das mein Spielzeug war.

D: Ich weiß. Und ich erstelle ein Bild und exportiere es dann als JPEG mit etwa 80 % Qualität und sage: „Das ist okay für das Web.“ Vielleicht war das vor 10 Jahren etwas Entferntes.

J: Das ist wahrscheinlich der Arbeitsablauf vieler Leute, wo sie es einfach zu 80 % ausgeben und es wird gut. Und das wird zum größten Teil in Ordnung sein, aber gelegentlich wird etwas durchrutschen. Und wenn Sie Engpässe aufheben und Blockierungen aufheben möchten, lohnt es sich wirklich, die Zeit damit zu verbringen, sich jedes einzelne Bild anzusehen und zu sagen: „Bin ich mit diesen Kompromissen bei der Größe zufrieden?“

D: Absolut. Und für eine hyperschnelle moderne Website, die mit den Besten da draußen konkurrieren muss, wird das, was ich gerade beschrieben habe, das sicherlich nicht können. Das bringt uns also zu Nummer fünf, nämlich der Verwendung fortschrittlicher Optimierungstechniken für Schriftarten.



5. Fortgeschrittene Techniken zur Schriftoptimierung



J: Ich habe erwähnt, dass große JPEGs oft ein Blockierungsproblem darstellen. Und einer der großen Übeltäter sind Schriftarten, insbesondere Google-Schriftarten, oder tatsächlich alle Schriftarten, die Sie von einer Drittanbieter-Domain laden. Diese sind so oft das langsamste Ding auf der Seite, das größte Ding auf der Seite, und Sie werden dies als Benutzer ständig sehen. Wenn Sie eine Seite laden, dauert das Sortieren einige Sekunden, und dann blinkt die Schriftart auf. Es ist eine wirklich schlechte Benutzererfahrung. Es ist in vielerlei Hinsicht wirklich schlecht für Core Web Vitals, aber es gibt Korrekturen. Eines der Probleme mit Google-Schriftarten und ähnlichen Schriftarten besteht also darin, dass Sie eine domänenübergreifende Verbindung herstellen, was eine Weile dauert. Das Ding, mit dem Sie sich verbinden, fragt eine ganze Reihe von Back-End-Systemen ab, was eine Weile dauert. Es spuckt die Schriftart zurück, Sie müssen diese Schriftart dann herunterladen, dann müssen Sie sie rendern. Es gibt ungefähr fünf Schritte in diesem Prozess und es dauert Sekunden, und es gibt keine Möglichkeit, das schneller zu machen.

Einer der einfachsten Erfolge besteht also darin, diese Schriftarten zu lokalisieren. Laden Sie sie nicht von Google Fonts, ignorieren Sie die Anweisungen, die Google Fonts Ihnen zum Kopieren und Einfügen von CSS gibt. Googeln Sie ein wenig und finden Sie einige Anleitungen zum Selbsthosten dieser Schriftarten. Und das hängt von Ihrem Setup und Ihrem CMS ab. Typischerweise gibt es Plugins und Prozesse, um dies ziemlich einfach zu machen. Das schleift das alles ab. Und das andere, was Sie tun möchten, ist, sich anzusehen, was diese Schriftart eigentlich ist, die ich lade, und wie ich sie lade.

In modernem CSS zum Laden von Schriftarten können Sie bestimmte Zeichensätze definieren. Wenn Sie also wissen, dass Ihre Website beispielsweise hauptsächlich auf Englisch ist, müssen Sie wahrscheinlich nicht die Schriftartzeichen für eine ganze Reihe erweiterter lateinischer Glyphen laden, was tatsächlich standardmäßig der Fall ist. Die Schriftart, die Sie laden, verwenden Sie also nur von A bis Z, eins bis neun, aber tatsächlich laden Sie 200 ungerade Zeichen, die niemals auf Ihren Seiten erscheinen. Wenn Sie das also aufteilen können, geht das viel schneller. Und Sie können auch sagen: „Möchte ich, dass diese Schriftart schnell geladen wird, aber möglicherweise nicht zwischengespeichert wird? Oder wo immer die Kompromisse sind, wie lange möchte ich warten, bis sie geladen wird? Und muss ich auf etwas anderes zurückgreifen? Oder zeige ich nur eine leere Stelle, wo es sein sollte?“ Es gibt verschiedene Einstellungen, an denen Sie basteln können, und Tools, mit denen Sie googeln können, um sie zu optimieren. Genauso wie Bilder, die Sie sich jedes einzelne Bit ansehen möchten, fragen Sie wirklich, wie Sie diese Schriftarten laden. csstricks.com hat einige großartige Anleitungen Hier finden Sie eine ganze Reihe von Möglichkeiten, wie Sie die Rosinen auswählen können. Aber schauen Sie sich noch einmal Ihr CMS und Ihren Stack an, es wird Plugins und Käufe geben, die dies vereinfachen.

D: Und Nummer sechs, verwenden Sie CSS- und JavaScript-Tricks.



6. CSS- und JavaScript-Tricks



J: Der zweithäufigste Übeltäter ist also, wie Stile und Skripte geladen werden. Und wenn Sie eine Website haben, die viele komplexe visuelle Dinge hat und vielleicht Bewegung und Interaktion und Widgets und Dinge hat, auf die Sie klicken und mit denen Sie Sachen machen können, ist es fast sicher so, dass CSS und JavaScript eine Weile brauchen, um an die Macht zu kommen zum Laden und interagiert mit der Seite auf unterschiedliche Weise. Sie werden dies in Ihrem Chrome Developer Tools-Bericht sehen, wenn Sie sich diesen Wasserfall von Dingen ansehen, die andere Dinge aufhalten. JavaScript ist dafür ein wirklich schlechter Täter. Wenn ich ein Skript habe, das beispielsweise ein Karussell oben auf meiner Seite antreibt, möchte ich nicht warten müssen, bis dieses Skript geladen ist, bevor dieses Karussell zu scrollen beginnt. Es gibt also ein paar Dinge, die Sie damit tun können. Einer ist, dass Sie sie einfach kleiner machen können. Cloudflare ist wirklich gut darin. Wenn es kleiner ist, sind es weniger Bytes, es ist eine schnellere Seitenladezeit. Aber die andere Sache, die Sie tun können, die wirklich leistungsfähig ist, ist, für diese JavaScript-Datei zu sagen: Ich muss sie nicht sofort laden, ich kann warten, bis die Seite fertig ist.

Und es gibt verschiedene Möglichkeiten, wie Sie das tun können. Sie können asynchron laden, Sie können es verschieben. Aufschieben ist heutzutage in der Regel die beste Praxis. Die Leute machen alle möglichen seltsamen Sachen mit der Kombination von Asynchronität und Verzögerung, was ein Durcheinander ergibt. Aber nur die Verwendung des defer-Attributs für JavaScript-Dateien, die Sie nicht sofort benötigen, kann Ihre Seite so viel schneller machen. Wenn ich also etwas JavaScript habe, das etwas in der Fußzeile steuert, muss ich wirklich nicht darauf warten, dass der Rest der Seite geladen wird, besonders wenn man bedenkt, dass die Art und Weise, wie JavaScript und CSS interagieren, ziemlich matschig wird. Wenn ich viele Skripte und viel Styling auf meiner Seite habe, wird einiges davon warten, bis das JavaScript geladen ist. Sie haben also überall Dinge, die andere Dinge hochhalten. Also wirklich taktisch zu sein und zu sagen, dass ich das nicht sofort brauche, kann enorme Leistungssteigerungen freisetzen. Auch hier ist es wirklich einfach zu erkennen, wo sich diese Täter in den Chrome Developer Tools befinden. Und wenn Sie eine Entwicklungsressource haben, ist dies super einfach. Sie fügen buchstäblich einfach ein Attribut zum Tag hinzu und es tut es automatisch.

D: Und Nummer sieben ist, das Beste aus Caching und Versionierung herauszuholen.



7. Caching und Versionierung



J: Eines der Dinge, die Cloudflare wirklich gut macht, ist, wenn es zum ersten Mal auf eine Ressource trifft, sei es ein Bild oder ein Stück JavaScript oder ein Stil, es speichert es in Cloudflare, und dann jeder, der danach fragt in der Zukunft erhält die zwischengespeicherte Version. Und das diente ihnen von irgendwo super lokal. Das ist supereffizient, wirklich schön. Viele Websites funktionieren auf eine Weise, die das ziemlich schwierig macht. Beispielsweise möchten Sie sicher sein, dass Sie Ihre Stylesheets und Ihre Skripte versionieren. Wenn Sie also Ihre neueste Version Ihres JavaScript-Stücks veröffentlichen, möchten Sie sagen, dass dies die sechste Version ist. Und dann kann das von Cloudflare und für alle Besucher gut zwischengespeichert werden. Wenn Sie es aktualisieren, möchten Sie diesen Dateityp ändern, den Dateinamen ändern, also ist dies Version sieben. Und dann sind alle Ihre Caches abgelaufen, die Leute fordern eine andere Ressource an und kommen sehr schnell zurück.

Richtig leistungsfähig wird dies erst, wenn Sie anfangen, die eigentlichen Webseiten selbst zwischenzuspeichern. Daher speichert Cloudflare standardmäßig nur JavaScript- und CSS-Bits. Sie möchten die Webseiten zwischenspeichern. Aber Sie möchten dies auf eine Weise tun, die nicht versehentlich angemeldete Personen oder Personen, die etwas in ihrem Einkaufswagen haben, zwischenspeichert. Wenn Sie WordPress verwenden, gibt es einen Dienst von Cloudflare namens automatische Plattformoptimierung, der dies automatisch durchführt. Jetzt stellen Sie Ihre Website also vom nächstgelegenen Cloudflare-Rechenzentrum für Ihre Benutzer bereit, und sie erhalten eine zwischengespeicherte gespeicherte Version davon in 50 Millisekunden statt in 600 Millisekunden.

Wenn Sie eine komplexere Website eingerichtet haben, können Sie dies mit Cloudflare mit dem Workers-Produkt tun, mit dem Sie unter dem Produkt Page Rules einige Ihrer eigenen Logiken dafür definieren können. Aber im Grunde ist die Prämisse, dass Sie nicht möchten, dass Ihre Website irgendetwas tut. Wenn jemand Ihre Seiten öffnet, möchten Sie, dass diese Seite, jedes bisschen JavaScript und jedes bisschen Styling von dort bereitgestellt wird, wo sich das nächste Rechenzentrum befindet. Meine Server stehen in Norwegen, glaube ich. Aber wenn Sie jetzt meine Website öffnen, kommt alles darauf aus Manchester, weil das der nächstgelegene Ort ist, an dem Cloudflare ein Rechenzentrum hat. Und Sie können damit herumbasteln. Sie können sich dies in den Chrome Developer Tools ansehen, Sie können der Ansicht eine zusätzliche Spalte hinzufügen, die besagt, ob Cloudflare zwischengespeichert wird. Und Sie können anfangen, diese Einstellungen herauszupicken und zu optimieren, um sicherzustellen, dass nichts jemals das Backend trifft.

D: Und das bringt uns zum letzten. Nummer acht, verwenden Sie ein cleveres Drittanbieter-Kit.



8. Cleveres Drittanbieter-Kit



J: Es gibt eine ganze Menge Zeug, man kann einfach loslegen, um mit einigen davon zu schummeln. Ich habe im Moment zwei echte Favoriten. Eine davon ist Instant Page, die sich unter instant.page befindet und eine interessante Domain hat. Das ist wirklich cool. Es macht Ihre Website also nicht sofort schneller, aber es beschleunigt die nachfolgende Navigation. Wenn also ein Benutzer seine Maus über einen Link auf Ihrer Seite bewegt, wird dieser im Hintergrund Ihres Browsers vorab geladen, sodass er beim Klicken bereits verfügbar ist. Und sie haben eine ganze Reihe von Untersuchungen, die besagen, dass die durchschnittliche Person ihre Maus 16 Millisekunden lang über einen Link bewegt, bevor sie tatsächlich klickt. Es gibt also ein bisschen Pufferzeit. Und in diesen 16 Millisekunden ist das gerade genug Zeit, um mit dem Laden der Seite im Hintergrund zu beginnen. Es fühlt sich also sofort an.

Und es gibt ein paar Gründe, warum das wirklich schön ist. Erstens, das ist eine großartige Benutzererfahrung. Zweitens wirkt es sich auf Ihre Core Web Vitals aus, obwohl es sich nicht um das anfängliche Laden der Seite handelt, Core Web Vitals aggregiert Geschwindigkeit und Ladezeiten über Ihre gesamte Website in Ihren URLs. Wenn diese Navigationen also superschnell sind, wird das Wunder für Ihre Gesamtpunktzahl bewirken, was Sie dem heiligen Gral verbesserter Google-Rankings näher bringen könnte.

Für die technisch versierteren Leute ist Party Town das andere Spielzeug, das ich im Moment wirklich mag. Und die Prämisse ist, dass einige der Inhalte, die Sie auf Ihre Website laden, von Drittanbietern stammen. Und das sind oft Tracking-Pixel und Google Tag Manager und vielleicht noch andere Krimskrams. Sie möchten nicht, dass dieses Zeug mit den wichtigsten wichtigen Dingen konkurriert, die für Ihre Website von entscheidender Bedeutung sind. Wenn ich also eine Menge JavaScript habe, das das Laden der Seite antreibt, möchte ich nicht, dass Google Tag Manager dagegen lädt und Ressourcen stiehlt und dann kämpft. Ich möchte diese Dinge trennen, damit meine Seite im Browser weiß, dass sie wirklich die kritischen Dinge priorisieren sollte und dass die Dinge von Drittanbietern im Hintergrund passieren können, es kann separat passieren. Und aus technischer Sicht lädt es all diese Drittanbieter-Ressourcen in einen separaten Worker, was bedeutet, dass es außerhalb des normalen Streams passiert, die Leistung nicht beeinträchtigt und leise im Hintergrund passiert. Ich habe einige unglaubliche Leistungssteigerungen durch diese Art von Zeug gesehen. Ich denke, das ist sehr viel, wohin die Leistungsoptimierung geht. Es ist ein bisschen schwierig einzurichten, es funktioniert nicht perfekt mit allen Sachen. Aber wenn Sie der Konkurrenz wirklich voraus sein wollen, ist dies ein wirklich cooles Spielzeug zum Spielen. Es ist also ein bisschen Beta, aber es lohnt sich, es zu erkunden.

D: Ich habe versucht, nach der URL für Party Town zu suchen, denn wenn Sie Google danach durchsuchen, ist es ziemlich schwierig, sie zu finden, aber sie ist auf GitHub.

J: Ja. Ich habe dir gerade einen Link gepingt, den du teilen kannst. Es ist sehr Beta. Es ist sehr GitHub. Es ist im Moment sehr nerdy und Entwickler.





Die Pareto-Gurke – Nehmen Sie 100 kleine Änderungen vor



D: Lassen Sie uns mit der Pareto Pickle abschließen. Pareto sagt also, dass Sie 80 % Ihrer Ergebnisse mit 20 % Ihrer Bemühungen erzielen können. Welche SEO-Aktivität würden Sie empfehlen, die mit geringem Aufwand unglaubliche Ergebnisse liefert?

J: Der beste Rat, den ich dazu geben kann, ist, das Pareto-Optimum für SEO zu ignorieren. Ich glaube nicht, dass das so mehr funktioniert. Ich denke, das ist ein guter Rat, wenn Sie unsere Großeltern sind, die vor 100 Jahren ein stationäres Einzelhandelsgeschäft betrieben haben. Ich denke, unser Ökosystem ist anders. Und ich denke, insbesondere für SEO ist die Art und Weise, wie Sie gewinnen, 100 kleine Änderungen vorzunehmen, eine nach der anderen, iterativ heute und morgen, bis Sie sterben. Andernfalls bewegen sich Ihre Konkurrenten schneller. Es dreht sich alles um Qualität, Marke und Geschäft. Alles, was Sie taktisch einfach sagen können: „Oh, tun Sie das“, können Ihre Konkurrenten auch.

Also ja, es gibt möglicherweise einige clevere Antworten, mit denen Sie den Ruf Ihrer Marke verdoppeln können, denn das wird definitiv gut gehen. Aber das ist so eine große komplexe Sache. Und ich denke, eine viel bessere Art, darüber nachzudenken, ist, welche zehn Dinge ich heute Nachmittag verbessern kann? Und geh einfach und mach das. Und sie müssen nicht riesig oder schlau sein, sondern nur iterieren und besser werden.

D: Sie müssen die Dinge nicht priorisieren. Aber sicherlich haben einige Dinge eine größere Wirkung als andere Dinge.

J: Ja, aber die großen Dinge stellen sich einfach als die bessere Lösung heraus, haben den besseren Inhalt, sind besser auf den Produktmarkt ausgerichtet oder beeindrucken und helfen Ihrem Publikum, aber nichts davon sind konkrete, taktische Dinge, die Sie tun können.

Weißt du was, ich ändere meine Meinung. Die 80 %, die Sie tun können, sind Cloudflare.

D: Ich war Ihr Gastgeber David Bain. Jono, vielen Dank, dass du beim In Search SEO-Podcast dabei bist.

J: Danke, dass du mich hast. Das war entzückend.

D: Und danke fürs Zuhören.