Swappie konnte durch die Konzentration auf Core Web Vitals den mobilen Umsatz um 42% steigern

Für den Erfolg der Optimierungsmaßnahmen war es entscheidend, einen Zusammenhang zwischen der Websiteleistung und den Geschäftsmesswerten zu finden.

Lina Hansson

Swappie ist ein erfolgreiches Start-up, das runderneuerte Smartphones verkauft. Einige Jahre lang priorisierten sie das Hinzufügen neuer Funktionen gegenüber der Websiteleistung. Als das Unternehmen jedoch feststellte, dass die Geschäftsergebnisse auf der mobilen Website hinter der Desktopversion zurückbleiben, kam es zu einer Veränderung. Das Unternehmen konzentrierte sich auf die Leistungsoptimierung und verzeichnete bald einen Anstieg des Umsatzes über Mobilgeräte.

Heben Sie die Chance hervor

Die relative mobile Conversion-Rate (Rel mCvR) wird berechnet, indem die mobile Conversion-Rate durch die Conversion-Rate für Computer geteilt wird. Es gibt viele Möglichkeiten, Geschwindigkeitsmesswerte zu verfolgen, aber es ist nicht immer einfach, sie mit Geschäftsmesswerten zu verknüpfen. Da dieselben Kampagnen und Saisonalitäten sowohl auf Mobilgeräten als auch auf Computern gelten, wird der Einfluss dieser externen Parameter durch den Messwert „Rel mCvR“ beseitigt. Er wird nur angezeigt, wenn sich die mobile Website verbessert oder nicht.

Der Durchschnitt der zehn größten E-Commerce-Websites in den USA beträgt eine Rel mCvR von 50%, aber Swappie lag bei 24%. Dies deutete darauf hin, dass die mobile Website mit Herausforderungen konfrontiert war und dass dem Unternehmen Umsatz entging, was dazu führte, dass das Projekt zur Leistungsverbesserung gestartet wurde.

Auswirkung von Leistungsverbesserungen messen

Swappie nutzte Google Analytics, um mithilfe dieser Tabellenvorlage das tägliche Tracking der Rel mCvR und der durchschnittlichen Seitenladezeit auf Mobilgeräten einzurichten. Hier finden Sie eine Anleitung zur Verwendung der Tabelle. Außerdem wurde damit begonnen, Core Web Vitals über Google Analytics und BigQuery zu erfassen. Nachdem das Tracking aktiviert war, begannen die Entwickler mit der Verbesserung der Websiteleistung.

Nach nur drei Monaten Arbeit waren die Ergebnisse eindeutig: Die mCvR von Rel stieg von 24% auf 34% und der über Mobilgeräte generierte Umsatz stieg um 42 %.

Optimierungen

Für LCP und CLS optimieren

Das Entwicklungsteam von Swappie stellte fest, dass es bei kleinen Dingen, die lange Zeit übersehen wurden, viel Raum für Verbesserungen gab. Bei einer Untersuchung der Website an verschiedenen Darstellungsbereichen und in verschiedenen Sprachen wurden Probleme mit LCP und CLS aufgedeckt, die leicht zu beheben waren und einen großen Einfluss auf die Gesamtleistung hatten. So führte es beispielsweise zu einem geringeren LCP-Wert, wenn das LCP-Element auf dem Server statt auf dem Client gerendert wurde.

Layoutverschiebungen zu erkennen, war eine Herausforderung, da sie je nach Darstellungsbereich und Verbindung stark variieren können. Nachdem die Core Web Vitals von Nutzern zu Analysen gelangt waren, wusste das Unternehmen, dass es auf dem richtigen Weg war, da der CLS-Wert gesunken war.

Bilder

Die Bilder wurden durch Vorabladen, Lazy Loading und geeignete Größenanpassung optimiert. Wichtige Bilder (z. B. LCP) werden vorab geladen, während Bilder nur bei Bedarf außerhalb des Darstellungsbereichs geladen werden.

Schriftarten

Optimierte Schriftarten durch Anbieterwechsel austauschen Das hatte große Auswirkungen, da das Unternehmen eine optimale Methode für die Bearbeitung von Schriftbildern brauchte, die für verschiedene Sprachen benötigt wurden.

Drittanbieter-Skripts

Swappie hat sich viel Mühe gegeben, um jedes Drittanbieter-Skript und -Widget zu überprüfen, wo es verwendet wurde und welche Funktionen es bietet. Nach Gesprächen mit allen Stakeholdern wurde Pläne erarbeitet, die Auswirkungen der Skripts auf die Website zu reduzieren und gleichzeitig die Funktionen beizubehalten. Überflüssige Elemente wurden entfernt und den Rest optimiert. Dadurch wurde die Menge an Drittanbieter-JavaScript auf der Website deutlich reduziert.

Entfernen Sie nicht verwendeten Code und optimieren Sie die Bündelung

Durch das Optimieren von Importen und das Entfernen von nicht verwendetem JS und CSS wurde zwar die Websiteleistung von Swappie geringfügig verbessert, doch diese kleinen Verbesserungen summieren sich mit der Zeit. Außerdem wurde die Bündelung optimiert.

Eine Leistungskultur bei Swappie schaffen

Das Ergebnis, das Swappie erzielt hat, beruht nicht nur auf den Änderungen im Code, sondern auch auf den Änderungen in der Organisation und den Prioritäten.

Der Engineering Lead Teemu Huovinen erklärt:

Es ist wichtig, die Websitegeschwindigkeit mit Geschäftsmesswerten zu verknüpfen, um die Bedeutung dieser Geschwindigkeit wirklich hervorzuheben. Wenn Zeit und Ressourcen knapp werden, kommt es immer auf die Priorisierung an. Das ist immer der Fall. Die Priorisierung des Kundenwerts ist die richtige Lösung, aber es ist zu einfach, sich auf neue Funktionen und direkte Conversion-Verbesserungen zu konzentrieren, wenn Sie der Meinung sind, dass nur die Websitegeschwindigkeit verbessert wird. Es ist nicht immer einfach, die Websitegeschwindigkeit mit Geschäftsmesswerten zu verknüpfen. Hier hat uns die Berechnung mit Rel mCvR sehr geholfen.

Teemu Huovinen

Nachdem das Entwicklerteam die Möglichkeit hatte, sich ein Quartal vollständig auf die Websitegeschwindigkeit zu konzentrieren, war es motivierter, tiefer ins Thema einzugehen.

Das Zusammenspiel unserer Leistung mit dem Wachstum unseres Teams macht es noch beeindruckender. Vier unserer sieben Entwickler hatten innerhalb des Monats begonnen, in dem wir mit der Leistung begann. Ich gratuliere dem Team. Es ist wirklich beeindruckend, wie wir uns mit diesem Thema auseinandersetzen und einen so großen Beitrag leisten konnten.

Teemu Huovinen

Teemu betont auch, wie wichtig es ist, am Anfang Zeit zu investieren, um datengestützte Pläne zu erstellen, sich mit dem Tab „Leistung“ der Entwicklertools vertraut zu machen und Nutzeranalysen einzurichten, bevor Verbesserungen vorgenommen werden. Grafiken (insbesondere solche, die in die richtige Richtung verlaufen) sind eine großartige Quelle für Feedback und Validierung für Ihre Arbeit. Anhand der Core Web Vitals-Werte und der Lab-basierten Lighthouse-Werte konnte das Team sich darauf konzentrieren, die Aspekte zu optimieren, die die meisten Nutzer betreffen.