Expires Header

Expires Header

Copyright ┬ę Shutterstock/Brian A Jackson

Was sind Expires Header?

Der Expires Header enth├Ąlt Anweisungen f├╝r den Browser eines Webseitenbesuchers, ob und wie lange er eine Ressource in seinem Cache speichern soll. Der Expires Header enth├Ąlt das Datum und/oder die Uhrzeit, nach der die Ressource veraltet ist und neu geladen werden muss. Wenn Expires Header f├╝r eine Ressource, zum Beispiel f├╝r alle JPEG Bilder auf einer Webseite, festgelegt werden, speichert der Browser diese Ressourcen beim Aufruf der Webseite in seinem Cache. Sobald der Besucher das n├Ąchste Mal auf die Webseite zur├╝ckkehrt, wird diese schneller geladen, da dem Browser die Bilder bereits zur Verf├╝gung stehen und er sie nicht neu herunterladen muss.

Nachdem Google die Auswirkungen der Ladegeschwindigkeit auf die Such Rankings bekannt gegeben hatte, richtete sich die Aufmerksamkeit vieler SEOs und Webseitenbetreiber auf die Vorteile von Expires Headern, um das Browser Caching zu steuern.

Das Verbessern der Ladegeschwindigkeit einer Website verbessert ihre Funktionalit├Ąt und bietet Vorteile wie niedrigerer Absprungraten und eine h├Âhere Verweildauer. Wenn eine Website schneller geladen wird, als die Websites der Wettbewerber, kann dies m├Âglicherweise bessere Platzierungen in den Google Suchergebnissen zur Folge haben. Ein weiterer Vorteil von Expires Headern besteht darin, unn├Âtige HTTP-Anfragen vom Browser an den Server zu vermeiden.

Funktionsweise und Implementierung von Expires Headern

Die Funktionsweise von Expires Header ist einfach. Sie teilen dem Browser mit, wie lange eine Datei im Cache gespeichert werden muss, damit sie bei nachfolgenden Seitenansichten und Besuchen die Datei nicht erneut herunterladen m├╝ssen. Das hei├čt, ein Expires-Header verbessert die Ladegeschwindigkeit einer Webseite nicht beim erstmaligen Besuch eines Users, da dieser Besucher alle Dateien zum ersten Mal herunterladen muss. Erst bei weiteren Besuchen mit dem gleichen Browser wird die Ladezeit verk├╝rzt, da der Browser einen Teil oder alle Ressourcen im Cache gespeichert hat.

Damit der Browser wei├č, dass er bestimmte Ressourcen zwischenspeichern soll, enthalten Expires Header einfache Anweisungen f├╝r den Browser. Zum Beispiel

Expires: Mon, 1 Oct 2018 12:22:00 GMT

oder

ExpiresDefault “access plus 1 month”

Die zweite Anweisung sorgt daf├╝r, dass die gesamte Ressource f├╝r einen Zeitraum von einem Monat nach dem Abruf gespeichert wird. Wenn nur einzelne Ressourcen gespeichert werden sollen, m├╝ssen diese benannt werden. Das hei├čt, es muss erst ermittelt werden, welche Dateien h├Ąufig aktualisiert und welche Dateitypen nicht oft aktualisiert werden.

Manchmal ist es nicht sinnvoll, eine ganze Gruppe von Skripten, Images oder anderen statischen Ressourcen auf der gesamten Webseite zwischenzuspeichern, aber es w├Ąre hilfreich, bestimmte zu cachen. Zum Beispiel bei einer E-Commerce Webseite, die h├Ąufig aktualisiert wird, kann es sinnvoll sein, einen Expires Header f├╝r bestimmte Bilder und nicht f├╝r alle Bilder auf der gesamten Website festlegen.

Das Setzen von Expires Headern f├╝r bestimmte Ressourcen, wie Header Images, die sich nicht ├Ąndern, erm├Âglicht ein schnelleres Laden der Webseite, w├Ąhrend die Produktbilder aktualisiert werden k├Ânnen, ohne dass der Browser sie zwischenspeichert. Auf diese Weise wird sichergestellt, dass Produktbilder aktualisiert werden und Kunden die neuen Bilder sehen.

Eine M├Âglichkeit nur bestimmte Ressourcen zwischenzuspeichern besteht darin, zwei separate Asset Ordner zu erstellen: einen f├╝r statische Ressourcen und den anderen f├╝r Ressourcen, die h├Ąufig aktualisiert werden. Alle Ressourcen zum Beispiel Bilder und Skripte, f├╝r die ein Ablauf in der fernen Zukunft festgelegt werden soll, werden in den statischen Ordner gelegt. Die Ressourcen, die nicht im Cache gespeichert werden sollen, werden in den anderen Ordner gelegt.

Beide Ordner sollten eine .htaccess Datei enthalten. In der .htaccess Datei f├╝r die h├Ąufig zu aktualisierenden Inhalte sollte explizit ein No-Cache-Header eingef├╝gt werden. Dadurch wird sichergestellt, dass der Inhalt nicht zwischengespeichert wird.

Selektiv gespeichert werden k├Ânnen praktisch alle Elemente einer Webseite wie Bilder, Favicons, Texte, CSS oder Scripte. Die Anweisungen werden ├╝blicherweise in die .htaccess-Datei der Webseite wie folgt eingef├╝gt:

< IfModule mod_expires.c>
# Enable expirations
ExpiresActive On
# My favicon
ExpiresByType image/x-icon "access plus 1 year"
# Images
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
# CSS
ExpiresByType text/css "access plus 1 month"
# Javascript
ExpiresByType application/javascript "access plus 1 year"
< /IfModule>

Wenn der Browser diese .htaccess-Datei erh├Ąlt, wei├č er, dass Bilder mit den Formaten .gif, .png, .jpg und .jpeg sowie CSS Dateien f├╝r einen Monat, das Favicon der Webseite und Javascript f├╝r ein Jahr gespeichert werden sollen. Der maximale Ablauf der Speicherfrist kann 12 Monate in der Zukunft liegen.

M├Âgliche Nachteile f├╝r die User Experience

Der offensichtliche Nachteil der Implementierung von Expires Headern ist die Tatsache, dass, wenn eine Ressource zu weit in der Zukunft abl├Ąuft und Aktualisierungen an der Webseite, ob geplant oder unvorhergesehen, vorgenommen werden m├╝ssen, k├Ânnen wiederkehrende Besucher die ├änderungen erst nach Ablauf der Header in ihrem Browser sehen. Es ist wichtig, dar├╝ber nachzudenken, wie weit davon ausgegangen werden kann, dass die Ressourcen gleich bleiben, um das am besten geeignete Ablaufdatum zu bestimmen. Es ist dar├╝ber hinaus wichtig, selbst die kleinsten Ressourcen einer Webseite zu bewerten, bevor Expires Header genutzt werden. Dies gilt insbesondere f├╝r E-Commerce Webseiten.

Bei E-Commerce Webseiten k├Ânnen nicht ordnungsgem├Ą├č genutzte Expires Header zu schwerwiegenden Problemen f├╝hren. Wenn beispielsweise ein wiederkehrender Besucher versucht, Produkte in den Einkaufswagen zu legen, aber die Ressourcen wie zum Beispiel HTML, CSS oder Produktbilder zwischengespeichert werden, zeigt der Einkaufswagen Produkte an, die in der Vergangenheit hinzugef├╝gt wurden und nicht die neu in den Einkaufswagen gelegten Produkte. Zwar kann das Problem durch einfaches Auffrischen des Browser Caches mit STRG + F5 behoben werden, aber viele Besucher kennen diese M├Âglichkeit wahrscheinlich nicht. Sie werden den Shop frustriert und ohne etwas zu kaufen, wieder verlassen.

Anforderungen an die Funktionalit├Ąt von Webseiten

Jede Webseite hat unterschiedliche Anforderungen an die Funktionalit├Ąt. Nicht alle Ressourcen auf einer Webseite m├╝ssen unbedingt zwischengespeichert werden. Zum Beispiel l├Ądt HTML im Allgemeinen sehr schnell, sodass es normalerweise keine wirkliche Notwendigkeit gibt, HTML im Cache zwischenzuspeichern. Wenn eine Website nur langsam geladen wird, ist es empfehlenswert, die wichtigsten Ressourcen wie Bilder und Skripte zu ├╝berpr├╝fen, da diese die Hauptursache langsamer Webseiten sind. Richtig eingesetzt kann mit Expires Header die Funktionalit├Ąt, Benutzerfreundlichkeit und Suchmaschinenfreundlichkeit einer Website erheblich verbessert werden.


Sie haben noch Fragen?

Kontaktieren Sie uns

Kostenloser SEO-Check der OSG


Weitere Inhalte