Das Unternehmen

MERSOR ist eine Premium Marke für personalisierte Accessoires der Sorg Lederwaren GmbH aus Berlin, welche sich auf den Online-Verkauf fokussiert hat. Das junge Unternehmen verkauft Lederwaren wie Taschen oder Portemonnaies, die mit personalisierten Beschriftungen bestellbar sind.

Die Herausforderung

Bisher wurde für die mobile Version des Onlineshops von Mersor keine technische mobile SEO durchgeführt. Der Page-Speed-Score der Seite ist im unteren Bereich bei ca. 20 Punkten. Dies führt dazu, dass die mobile Seite teilweise sehr langsam lädt, wodurch Nutzer oftmals die Seite verlassen, ohne einen Einkauf getätigt zu haben. Zwangsläufig liegt dadurch Umsatzpotential brach.

Vorgehensweise

  • IST-Analyse der Webseite mit Hilfe von Analysetools
  • Schrittweise Umsetzung gezielter Maßnahmen im Bereich des Browser-Cachings und des Renderings
  • Überprüfen der Ergebnisse
  • Dokumentation der Ergebnisse

Lösung

Langsame Webseiten laden häufig beim zweiten Aufruf wesentlich schneller. Der Grund dafür ist Browser-Caching.

Denn ein Browser kann mehr als nur eine Webseite darstellen. Eine Funktion von Browsern ist, dass sie Teile einer Webseite zwischenspeichern können. Meistens werden dabei Elemente zwischengespeichert, die auch auf weiteren Unterseiten benötigt werden, wie z.B. Logos oder die verwendete Schriftart.

Beim ersten Seitenaufruf müssen alle Elemente der Webseite vom Webserver zum Browser übertragen werden. Der Webserver weist den Browser für jede Datei einzeln an, ob und, wenn ja, wie lange die Dateien gespeichert werden dürfen. Bei einem zweiten Seitenaufruf lädt der Browser die bereits gespeicherten Dateien (wie z.B. das Logo) aus dem lokalen Speicher und muss es nicht nochmal über das Internet übertragen.

Die Webseite wird also schneller angezeigt, weil weniger Daten übertragen werden müssen. Die Idee ist dabei, dass Dateien, die sich vermutlich selten ändern (z.B. Logo, CSS, Schriftart, etc.), länger gespeichert werden und kurzlebige Dateien (z.B. Google Analytics, JavaScript) eher kürzer gespeichert werden.

Folgende Maßnahmen optimieren das Browser-Caching:

  • .htaccess-Datei manuell anpassen:  Durch einen Code kann man einem Webserver beibringen, welche Dateitypen für wie lange von einem Browser gespeichert werden dürfen.
  • Caching-Plugin: In den meisten Caching-Plugins lassen sich die Einstellungen direkt im Backend vornehmen.
  • Blockiertes Browser Rendering lösen: Renderzeit ist Ladezeit. Alles, was Rendern blockiert, hindert eine Webseite am schnellen Laden. Es gibt zwei Ursachen, die das Browser-Rendering blockieren:1. CSS-Dateien im Header (zwischen den <head> Tags im HTML und
    2. JavaScript-Dateien im Header (zwischen den <head> Tags im HTML).Besonders schwerwiegend wirkt es sich aus, wenn JavaScript das Rendering blockiert. Das ist der Fall, wenn JavaScript im HTML-Header der Webseite geladen wird. Ein Browser lädt die Dateien nämlich von oben nach unten der Reihenfolge nach. Aber: JavaScript „macht etwas“ mit der Seite und ist nur selten wichtig, um eine Webseite visuell darzustellen. Wenn JavaScript vor CSS im HTML ausgeführt wird, wartet der Browser so lange, bis das JavaScript vollständig ausgeführt ist, bevor es weiter mit CSS die Webseite rendert. Wenn das JavaScript dagegen im Footer  geladen wird ( vor dem schließenden </body> Tag im HTML), kann der Browser die Webseite schon anzeigen und führt im Hintergrund die JavaScript-Datei aus.Best-Practice ist: CSS in den Header und JavaScript in den Footer. Durch Maßnahmen im Bereich des Browser Caching und des Rendering sind eine weitere Steigerung des Pagespeed um nochmals 50-75% zu erwarten. 

Suchmaschinen-Stichworte für Lösungsanbieter

  • SEO
  • mobile SEO
  • Pagespeed
  • Pagespeed Optimierung
  • Browser-Caching
  • Rendering

Art des benötigten Umsetzungspartners/ Dienstleisters

Agentur mit Know-how im Bereich mobile SEO, speziell im Bereich der lokalen Zwischenspeicherung von Webseiteninhalten und des Renderings (CSS  und JavaScript)

Komplexität bei der Entwicklung und Einführung der Lösung

Mittel*

*(Die Komplexität kann je nach Anforderungen, Investitionsbedarf, Schulungsbedarf, etc. der Aufgabenstellung stark variieren.)

Dauer der Einführung

3 Monate

Systemkosten für den Betrieb der Lösung pro Monat

unter 200 €*

Investitionskosten für die Lösung

unter 50 €*

*(Die Kosten können je nach Komplexität, Anforderungen stark variieren.)

Logo Mersor
Beitragsbild Rendering Caching
Cache und Rendering Best-Practice
Kontaktieren Sie uns.

Bei Fragen und Anmerkungen helfen wir Ihnen gerne weiter. Schreiben Sie uns!

Nicht lesbar? Neues Captcha anfragen. captcha txt

Start typing and press Enter to search