Technische OnePage-SEO-Strategie – Teil 11 – Prerender/Prefetch/DNS-Prefetch
[av_anibild heading=’Teil 11/21 – Prerender/Prefetch/DNS-Prefetch‘ av_uid=’av-fxuqmq‘][/av_anibild]
Was ist DNS-Prefetch?
Die «DNS-Prefetch»-Technik sorgt dafür, dass externe Inhalte schneller vom Client geladen werden können. Dies geschieht, wenn dem Browser bereits beim Laden der Webseite mitgeteilt wird, welche externen Domains später benötigt werden. Der Browser kann dann, bevor die eigentlichen externen Inhalte benötigt werden, die Domain auflösen. Das spart ein paar Millisekunden Ladezeit. Hat man keine externen Inhalte verlinkt, kann diese Technik ignoriert werden.
Heutzutage werden jedoch immer mehr Schriften und Bibliotheken von externen Quellen eingebunden, weshalb die Bedeutung dieser Optimierungsmassnahme zunimmt.
Was ist Prefetch/Prerender?
Unter «prefetch» und «prerender» wird vorausgesagt, welche Seite der Besucher als nächstes am ehesten anklicken wird. Diese Seite wird dann von den Browsern unsichtbar im Voraus geladen. Ruft der Besucher diese Seite auch wirklich auf, kann sie ohne weitere Ladezeit angezeigt werden.
Diese Technik führt dazu, dass Seiten ohne Verzögerung geladen werden und trägt damit merklich zur Seitenladezeit bei. Auch Google nutzt diese Technik bei der Suchmaschine, indem das erste Resultat im Voraus geladen wird! Eine Auswertung von Google im Browser Chrome zeigt eine 20 Prozent schnellere Ladezeit der Seiten dank dieser Technik.
Die Untersuchung
Wir haben 2 verschiedene Techniken ausgetestet und über ein integriertes Analysetool ausgewertet. Dabei wird geschätzt, welche Seite die höchste Wahrscheinlichkeit aufweist, als nächstes eines Besuchers aufgerufen zu werden. Die Seite mit der höchsten Wahrscheinlichkeit wird im Quellcode ausgewiesen. Einzig bei der Newsseite wurde die Berechnung deaktiviert und immer die neueste News hinterlegt.
Die Auswertung von der Abbildung zeigt nach der Implementierung einen massiven Anstieg der Sichtbarkeit um durchschnittlich 10 Plätze. Parallel blieben die Seiten im Index und der Traffic konstant. Nach dem Entfernen der der technischen Optimierungsmassnahme auf der Seite sank das Ranking wieder und pendelte sich rund 5 Plätze höher als zuvor ein.
Eine Auswertung über die Prerender-Funktion zeigte, dass rund 30% der Seitenbesucher während des Testzeitraums von der Technik profitieren konnten. Diese Resultate belegen den grossen Einfluss der Massnahme auf das Ranking. Zusätzlich zeigt die Auswertung von Google im Browser Chrome einen 20% schnellere Ladezeit der Seiten dank dieser DNS-Prefetch-Technik.
Aufwand
Aufwand Seitenbetreiber: Kein Aufwand
Aufwand Webagentur: Diese Techniken beschleunigen die Seitenübertragung zum Browser. Moderne Server liefern HTTPS automatisch über HTTP2 aus, was die Techniken irrelevant macht. Alle Seiten auf HTTP1 benötigen weiterhin diese Techniken. Eine Implementation kann je nach CMS aufwändiger sein. Erwarteter Aufwand 1 bis 3 Tage.
Erwarteter Effekt auf SEO: Bei Websites, die mit HTTP1 ausgeliefert werden, hat diese Techniken überraschenderweise Einfluss auf das Ranking.
Folgen bei Nichtbeachtung: Websites mit vielen einzelnen Dateien werden langsamer ausgeliefert, da nur 5 Dateien parallel pro IP-Adresse geladen werden. Der Einsatz eines CDN-Netzwerkes kann diese Limitierung auch beheben.
Unsere Empfehlung
- Implementiere die DNS-Prefetch-Technik für eine reduzierte Ladezeit bei jedem Seitenaufruf!
- Die Prerender- und Prefetch-Technik benötigt eine Vorhersage der nächsten Seite pro Besucher. Über Google Analytics API oder Selbstprogrammierung kann diese Technik integriert werden. Ob der Aufwand/Nutzen dieser Technik den Einsatz rechtfertigt, muss pro Einsatzgebiet der Webseite analysiert und geprüft werden.
- Benutze ein CDN-Netzwerkes bei Webseiten mit vielen einzelnen Dateien! Da wird die Limitierung von 5 Dateien pro IP-Adresse aufgehoben.
Die technische Umsetzung
Prefetch und Prerender werden unsichtbar im Quellcode platziert.
Dabei ist es wichtig, dass alle Domains, welche für eine externe Verbindung einer Webseite benötigt werden, als «dns-prefetch» hinterlegt werden. Damit kann der Browser bereits die DNS-Auflösung durchführen, bevor die Dateien überhaupt angefordert werden. Dadurch spart sich der Browser ein paar Millisekunden Zeit ein.
In der Abbildung wird beispielsweise ein DNS-Prefetch auf Google-Fonts durchgeführt. Der Browser weiss in diesem Fall, dass eine Schriftart von Google verwendet wird und löst die IP für den Google-Server bereits auf. Sobald die Schriftart angefordert wird, kann diese schneller bezogen werden (der Browser kennt den Weg bereits). Die Umsetzung dieser Massnahme ist einfach zu realisieren.
Für Prefetch und Prerender kann entweder ein internes Statistiktool verwendet werden, oder auch auf die Daten von Google Analytics verwendet werden über die Google API.
Weitere Beiträge aus der Reihe
Dieser Beitrag ist aus der Reihe Technische OnPage-SEO-Strategie für Websites und Onlineshops.
- Technische OnePage-SEO-Strategie – Teil 1 – Title Tag
- Technische OnePage-SEO-Strategie – Teil 2 – Meta Description
- Technische OnePage-SEO-Strategie – Teil 3 – H1 Tag
- Technische OnePage-SEO-Strategie – Teil 4 – XML Sitemap
- Technische OnePage-SEO-Strategie – Teil 5 – HREFLANG Implementation
- Technische OnePage-SEO-Strategie – Teil 6 – Cloaking
- Technische OnePage-SEO-Strategie – Teil 7 – Mobile Optimierung / Responsive Design
- Technische OnePage-SEO-Strategie – Teil 8 – HTTPS
- Technische OnePage-SEO-Strategie – Teil 9 – Erreichbarkeit
- Technische OnePage-SEO-Strategie – Teil 10 – Ladezeit der Webseite
- Technische OnePage-SEO-Strategie – Teil 11 – Prerender/Prefetch/DNS-Prefetch
- Technische OnePage-SEO-Strategie – Teil 12 – Serverstandort
- Technische OnePage-SEO-Strategie – Teil 13 – Duplicate Content
- Technische OnePage-SEO-Strategie – Teil 14 – Canonical URLs
- Technische OnePage-SEO-Strategie – Teil 15 – Verbotene Ressourcen
- Technische OnePage-SEO-Strategie – Teil 16 – Minimierte und gepackte HTML, JS und CSS Dateien
- Technische OnePage-SEO-Strategie – Teil 17 – Google AMP
- Technische OnePage-SEO-Strategie – Teil 18 – Structured Data- / Schema.org-Anreicherung
- Technische OnePage-SEO-Strategie – Teil 19 – 404-Seiten / Seiten ohne 301 Umleitung entfernt
- Technische OnePage-SEO-Strategie – Teil 20 – Domain-Umstellung mit 301 Umleitungen
- Technische OnePage-SEO-Strategie – Teil 21 – Zugriffe / Saisonaler Traffic