Browser-Caching: der Cache als SEO-Tool

Was ist Browser Caching und wie nutze ich es?
Andreas Kirchner

Autor: Andreas Kirchner

Kontakt: Profil Xing

Datum: 28.01.2017, 11:26 Uhr

Was ist Browser-Caching?

Den Browser-Cache kennen die meisten daher, dass er hin und wieder entleert werden muss, damit der Computer wieder schneller arbeitet oder man Websites und spezielle Landingpages, die verändert wurden, im aktuellen Stand sehen kann. Grund für das nötige Löschen des Browser-Caches ist, dass ein Abbild der Website, die wir einmal besucht haben, im Browser Cache gespeichert wurde, um das erneute Laden beim nächsten Besuch des Users zu beschleunigen.

Das hat allerdings auch seinen Preis: Zu viele zwischengespeicherte Websites rauben Speicher, können Rückschlüsse auf persönliche Daten des Users und dessen Surfverhalten zulassen und beeinträchtigen die Arbeitsgeschwindigkeit des Computers. Das klingt erst einmal nicht sehr positiv, ist aber für Sie als Websitebetreiber eine Chance auf ein besseres Google-Ranking und führt auch bei anderen Browsern zu einer besseren Performance, wenn Sie das Browser-Caching, wie sich das Zwischenspeichern der Internetseiten nennt, gezielt einsetzen. Als SEO-Tool eingesetzt, sorgen Sie mit dem Browser-Caching dafür, dass Ihre Website oder Ihr Webshop durch eine schnellere Ladezeit nutzerfreundlicher performt und damit eine bessere Userexperience bietet. Auch ist die Absprungrate der Besucher geringer, da sie nicht lange auf den Aufbau der Website warten müssen.

In diesem Beitrag wollen wir u. a. Antworten zu den Fragen geben: Was sind die Vorteile des Browser-Cachings? Welche Ressourcen Ihrer Website oder Ihres Webshops sollten zwischenspeicherbar sein? Was sollten Sie sonst noch beim Browser-Caching beachten?

Wie verhilft Browser-Caching zum besseren Google-Ranking?

Kein User wartet gerne und schon gar nicht darauf, dass die Website endlich geladen ist. Der Inhalt muss dann schon extrem interessant für ihn sein, um die Wartezeit in Kauf zu nehmen. Websites, die sich rasendschnell aufbauen, sind also wesentlich userfreundlicher. Je mehr positive Userexperience Sie bieten und je länger der User auf Ihrer Seite verweilt, desto besser werden Suchmaschinen wie Google und Co. Ihren Webauftritt bewerten. Mit jeder Steigerung der Performance Ihrer Website oder Ihres Webshops verbessert sich auch Ihr Ranking!

Jeder Browser verfügt über die Implementierung eines HTTP-Cache-Speichers und muss nur noch durch einen korrekten HTTP-Header als Anweisung von Ihrem Server mit den nötigen Parametern versorgt werden, um die richtigen Ressourcen zwischenzuspeichern. Diese „Snapshots“ verwenden Browser wie Google Chrome, Safari und Co. zum einen, u, um die Ladezeiten der Websites zu verringern und zum anderen und in erster Linie als Back-up in den Suchergebnissen, falls die aktuelle Seite einmal nicht geladen werden kann.

Welche Dateitypen kann man im Browser zwischenspeichern?

Damit das Browser-Caching auch perfekt funktioniert, müssen Sie dem Browser (Google, Opera, DuckDuckGo, Safari etc.) mitteilen, welche Ressourcen bzw. Dateitypen er zwischenspeichern soll und wie lange. Zu den möglichen Dateitypen gehören typischerweise:

  • JavaScript Dateien
  • CSS-Dateien
  • Binäre Objektdateien wie das PDF oder Mediendaten wie MOV, WAV etc.
  • Bilddateien wie JPG, GIF, PNG etc.

Wie legt man die Ressourcen für das Browser-Caching fest?

Damit der Browser weiß, welche Dateitypen er für die Zwischenspeicherung im Caching nutzen soll, müssten Sie eine Ressourcen-Validierung durchführen. Hinsichtlich der Browser-Caching- Header haben Sie die Wahl zwischen:

  • „Last-Modified“ oder „ETag“

Mehrere Header anzugeben, ist nicht sinnvoll. Entscheiden Sie sich daher zu Beginn für eine Version.

„Last-Modified“ oder „ETag“ überprüfen den Zweck und vergleichen, ob es sich um gleiche Ressourcen handelt, um diese bei jeder Veränderung zu aktualisieren. Die GET-Anforderung durch den Browser, um dies abzufragen, erfolgt beim Neuladen der Website durch den User. Beim Last-Modified-Header wird das Datum der letzten Veränderung bzw. Speicherung verglichen. Bei E-Tag-Header können auch andere Werte, wie beispielsweise die Dateigröße, für den Abgleich herangezogen werden.

Wie lange sollten Ressourcen beim Browser-Cache gespeichert werden?

Damit das Browser-Caching fehlerfrei genutzt werden kann, müssen außer den Dateitypen auch die Speicherzeiten festgelegt werden. Beim Browser-Caching übernehmen dies die Expires- und Cache-Control-Header. Während HTML nicht zwischengespeichert werden muss, da es schnell lädt, werden zum Beispiel durch Google empfohlen alle anderen Browser-Caching-Ressorcen für mindestens eine Woche zu speichern. Für Widgets oder Werbeanzeigen von Drittanbietern sollten Sie die Cache-Lebensdauer für mindestens einen Tag eintragen. Für binäre Objektdaten wie das Favicon oder das Javascript, die in der Regel nicht aktualisiert bzw. verändert werden, sollten Sie mindestens einen Monat festlegen, besser noch: das Maximum, das 12 Monate beträgt.

Erst nach Ablauf des gewählten Browser-Caching-Speicherzeitraums, wird der Browser erneut prüfen, ob es eine neue Version des gespeicherten Inhalts gibt und diesen ggf. mittels einer GET-Anforderung aktualisieren.

Diese Browser-Caching-Header definieren die Speicherdauer:

  • „Expires“ oder „Cache-Control max-age“

Mehrere Header anzugeben, ist wie schon bei der Ressourcen-Validierung nicht sinnvoll. Entscheiden Sie sich daher für eine Version.

Tipp: Anstelle bei Cache-Control „max-age“ zu wählen, sollten Sie einen Expire-Zeitraum eingeben, da dies von Browsern in der Regel besser unterstützt wird.

Was ist der Nachteil einer zu langen Speicherzeit beim Browser-Caching?

User, die Ihre Website besuchen, sehen Änderungen an Ihrer Website erst, wenn Sie ihren Cache löschen und somit das Browser-Caching und somit die Ansicht der Website aktualisieren. Es ist daher wichtig, sich vorher genau zu überlegen welche Browser-Caching-Ressourcen in der Regel unverändert bleiben, welche mindestens einen Monat gleich bleiben und welche sich wöchentlich ändern. Besonders bei Webshops ist hier besondere Sorgfalt angebracht! Wenn Sie die falschen Browser-Caching-Expires in einem Webshop einsetzen, ist der Frust der User und damit ein möglicher Absprung und eine Verschlechterung des Rankings vorprogrammiert. Eine zu lange Speicherung von Produktbildern kann nämlich dazu führen, dass beispielsweise Produkte, die der Kunde in der Vergangenheit in seinen Warenkorb legte, noch immer dort angezeigt werden.

Wie wird das Ablaufdatum beim Browser-Caching festgelegt?

Damit Sie im Browser Ressourcen und das Expire-Date (Ablaufdatum) für das Caching festlegen können, müssen Sie Expire Header in Form einer .htaccess-Datei auf Ihrem Server definieren. Die Browser holen sie per GET-Anfrage ab und verarbeiten sie. Ein Beispiel für die Anweisung eine Ressource für einen Monat zu speichern wäre beispielsweise:

Expires: Mon, 30 Mar 2020 11:30:00 GMT
oder auch:
ExpiresDefault “access plus 1 month”

Einfach Messung der Aufbaugeschwindigkeit mit Google Pagespeed Insights

Wie testet man die Ladezeit nach dem Browser-Caching?

Mit hilfreichen Tools wie Google PageSpeed Insights, Pingdom, Gtmetrix oder Yslow können Sie mit wenigen Klicks messen, ob die Aktivierung des Browser-Cachings erfolgreich war, wie schnell sich Ihre Website oder Ihr Webshop aufbaut und erkennen wo noch nachgebessert werden muss.

Warum lädt die Website trotz Caching langsam?

Wenn eine Website oder ein Webshop sich trotz Zwischenspeicherung im Cache nur langsam aufbaut, sollten Sie die Analyseergebnisse der oben genannten Tools genauer ansehen. Die Tools werden Ihnen aufzeigen, an welchen Stellen beispielsweise zu große Dateien das Tempo drücken und Ihnen Einsparungspotenzial vorschlagen. Typischerweise handelt es sich um ein zu groß geratenes Bild oder eine nicht ausreichend komprimierte Binärdatei. Nachdem Sie die nötigen Anpassungen vorgenommen haben, empfiehlt sich ein erneuter Geschwindigkeitstest.

Was ist der URL-Fingerprint?

Wenn sich verschiedene Ressourcen nicht ständig, sondern nur ab und zu verändern, gibt es eine weitere Möglichkeit der Zwischenspeicherung. Diese wird so lange durchgeführt, bis sich die Daten auf dem Server erneuern. Dies bedeutet, dass der Browser durch den Server erfährt, dass es neue Daten gibt, die sich kürzlich verändert haben. Diesbezüglich erhält jede Ressource eine eigene URL, die sowohl vom Server als auch vom Browser eindeutig wiedererkannt wird. Sie können die Ressource manuell verändern und mit dem Zusatz „_fingerprint.css“ versehen, sodass sie automatisch eine neue ID erhält. Aus diesem Grunde muss der Browser die neue Ressource abrufen, weil er keine andere Möglichkeit hat.

Ebenso besteht die Möglichkeit, pro Anwendung ein neues Verzeichnis für die Veröffentlichung zu erstellen, sodass sich die Assets entsprechend platzieren. Jedoch kann es zu einem erneuten Download kommen, was sich als nachteilig erweist. Und zwar dadurch, dass sich die Version nicht verändert, die URL sich aber dennoch erneuert. Der URL-Fingerprint ist auch dann von Vorteil, wenn Sie manuell das erneute Crawlen Ihrer Website bei Google und anderen Suchmaschinen anstoßen möchten. Denn, wenn Sie wegen einer Urheberrechtsverletzung auf Ihrem Webauftritt abgemahnt werden und eine Unterlassungserklärung abgeben, müssen Sie aktiv und unverzüglich auf eine Bereinigung des Browser-Caches hinwirken, da sonst eine Vertragsstrafe bzw. ein Ordnungsgeld droht.

DSGVO, ePrivacy und Browser-Caching

Der User muss der Zwischenspeicherung durch Browser-Caching von Cookies, Passwörter und Nutzerdaten, die bei erneutem Besuch einer Website dann nicht neu eingegeben werden müssen aktiv zustimmen. Im Cache werden eigentlich nur Abbilder der Website auf dem Computer oder mobilen Endgerät des Users gespeichert. Einige Browser nutzen den Cache allerdings zur Datensammlung. Browser wie DuckDuckGo verzichten darauf und sind daher DSGVO– und ePrivacy-konform. Hier benötigt das Caching der reinen Websitesnapshots keiner Erlaubnis durch den User. Andere wie Google, Firefox und Co speichern persönliche Nutzerdaten und Daten über das Surfverhalten und geben diese für Analysen- und Marketingzwecke an den Websitebetreiber der besuchten Website weiter. User können dies durch Einstellungen in ihrem Browser unterbinden und dem Datensammeln widersprechen.

WordPress und Browser-Caching

Bei WP wird es den Websitebetreibern noch einfacherer gemacht. Es gibt zahlreiche Plug-ins, mit denen sich das Browser-Caching aktivieren lässt. Empfehlenswert sind beispielsweise:

Was sind die Vorteile des Browser-Cachings?

Wenn man sich einmal mit dem Thema beschäftigt hat, muss man bestenfalls nur einmal die Einstellungen für das Browser-Caching seiner Website oder seines Webshops definieren. Somit ist das Browser-Caching eines der SEO-Tools, die sich mit einem Einsatz erledigen lassen und nachhaltige Vorteile bieten. Zu den Vorteilen des Browser-Cachings gehören:

  • verbessertes Ranking
  • Suchmaschinenfreundlichkeit
  • Steigerung der Userexperience und Performance
  • geringere Absprungrate
  • Reduzierung des Servertraffics
  • schnellerer Aufbau der Website

Der einzige wirkliche Nachteil für Websitebetreiber ist die Möglichkeit, dass die Aktualität der aufgerufenen Website nicht auf dem neuesten Stand ist, wenn ein zu langer Speicherzeitraum gewählt wurde und die Ressourcen sich seit dem änderten. Die meisten User wissen allerdings darüber Bescheid und entleeren dann ihren Cache.

Quellen:

Das könnte Sie auch interessieren

Adwords Berater

Strukturierung von Anzeigengruppen und Anzeigen in Google AdWords

Vom: 17. November, 2016 | Autor: Andreas Kirchner

Anzeigengruppen und Anzeigen in AdWords Kampagnen - Unternehmen, die durch eine Werbekampagne neue Kunden finden ...

mehr erfahren
Fotolia / AdWords Landingpage

Was macht eine gute AdWords Landingpage aus?

Vom: 21. April, 2017 | Autor: Andreas Kirchner

Google AdWords ist eine gute Möglichkeit, um die Zielgruppe anzusprechen. Jedoch hängt es von zahlreichen ...

mehr erfahren
Google Adwords News September 2016

Online Marketing News: Februar 2020

Vom: 5. März, 2020 | Autor: Andreas Kirchner

SEO-News [toc] 1. Mehr Informationen in der Google Bildersuche Bisher wurden in der Google Bildersuche vor allem die ...

mehr erfahren
zurück

Unsere Blogthemen

Rückruf anfordern und Vorteile nutzen

Nehmen Sie gerne mit uns Kontakt auf.
Wir werden uns schnellstens mit Ihnen in Verbindung setzen.

Das interessiert unsere Kunden

Künstliche Intelligenz: Google erklärt, wie es funktioniert
Mit der Künstlichen Intelligenz wird das sogenannte Maschinenlernen beschrieben. Google hat nun erklärt, wie die neue ...
mehr erfahren
adwords express vs. adwords
Sowohl AdWords als auch AdWords Express sind Werbeprodukte, welche Ihnen von Google angeboten werden. Sie können ...
mehr erfahren
MS-Advertising-Logo von hiclipart.com
Seit Ende April 2019 ist aus "Bing Ads" "Microsoft Advertising" geworden. Bei allen Microsoft-Computern als Suchmaschine ...
mehr erfahren
Google Adwords News September 2016
SEO-News 1. Bis September 2020 werden alle Websites auf den mobile First Index umgestellt [toc] Dass Google alle Webseiten ...
mehr erfahren

Einfach und direkt anfragen:

Ob kostenlose Beratung oder unverbindlicher AdWords-Konto-Check.
Wir sind für Sie da!

Tel.: +49 40 570 10 75 50

Nehmen Sie gerne mit uns Kontakt auf.
Wir werden uns schnellstens mit Ihnen in Verbindung setzen.