Technische Frontendoptimierung „Perfect Storefront“ (Teil 1)

Online-Käufer sind anspruchsvoll. Das Schaufenster eines Shops sollte deshalb „perfekt“ sein. Deshalb haben wir das Konzept der „Perfect Storefront“ entwickelt, das Unternehmen dabei unterstützt, das „Frontend“ ihres Online-Shops technisch fortlaufend zu optimieren.

Moderne E-Commerce-Systeme entkoppeln die Präsentationsschicht (Frontend – was der Kunde „sieht“) von der Funktions- und Datenschicht (Backend – was im Hintergrund geschieht). Neue Fachbegriffe, die sich in diesem Zusammenhang etabliert haben, sind „Headless-„, „Composable-“ und „Adaptive Commerce“ sowie „API-First“ und andere. Sie beschreiben die Idee modularer Systemarchitekturen, die sich flexibler als klassische Komplettsysteme an neue Anforderungen anpassen lassen.

Die Trennung von Frontend und Backend hat sich besonders bei komplexen Shops mit hoher Veränderungsdynamik bewährt, da beide Bereiche unabhängig voneinander entwickelt werden können, um bestmögliche Kauferlebnisse (Customer Experiences) zu schaffen. Denn das Erlebnis im E-Commerce ist für Käufer heute ebenso wichtig, wie Produkte und Preise. Aus technischer Sicht vereinfacht die Entkopplung vom Backend die technische Optimierung des Frontends.

eCube unterstützt Unternehmen dabei, beide Bereiche – die digitale Verkaufsfläche als auch die Technologien, Daten und Strukturen dahinter – strategisch und praktisch zu optimieren. Unser Ziel ist es, unsere Kunden zu einer “Excellence” in beiden Bereichen zu befähigen.

Bezogen auf das Frontend des digitalen Verkaufs spiegelt sich diese Excellence in unserem Konzept der „Perfect Storefront“ wider – gemeint ist damit ein „perfektes“ Schaufenster, das Käufer dazu anregt, mehr und häufiger zu kaufen. Im Folgenden soll es um die Frage gehen, was eine „Perfect Storefront“ ausmacht und wie Unternehmen dieses Ziel technisch (und inhaltlich) erreichen.

Was steckt hinter „Perfect Storefront“?

Die „Storefront“ – das digitale Schaufenster – umfasst alle Seiten eines Online-Shops, die zum Käufer gerichtet sind, also Kontaktpunkte auf der Kundenreise (Touchpoints) wie beispielsweise die Startseite, Produktdetailseiten, Produktlisten, Kategorieseiten und viele mehr. “Perfect Storefront” beschreibt das Ideal einer optimalen Verkaufsfläche, die den Kauf bestmöglich unterstützt.

Da die digitale Verkaufsfläche heute nicht mehr nur einen Online-Shop, sondern viele andere Verkaufspunkte im Netz umfassen kann, unterscheiden wir zwischen „onsite“ und „offsite“. Der Einfachheit halber ist onsite der eigene Shop (als Website oder App); offsite sind alle Kontaktpunkte von Marketing und Vertrieb außerhalb des Shops – auf Marktplätzen, sozialen Plattformen, Google Ads etc.

Der eigene Shop ist für die meisten Unternehmen am einfachsten zu kontrollieren. Deshalb wollen wir uns im Folgenden auf die Onsite-Aspekte der „Perfect Storefront“ konzentrieren und in groben Zügen aufzeigen, wie diese sich in der Praxis technisch realisieren lassen. Hier muss zunächst geklärt werden, was eine „Perfect Storefront“ ausmacht und welche Anforderungen wir an diese stellen.

Anforderungen an ein „perfektes“ Schaufenster

Die folgenden Anforderungen für sich genommen sind nicht neu und beschäftigen Shopbetreiber unter anderem im Kontext von Suchmaschinenoptimierung (SEO) und Conversionoptimierung regelmäßig. Das Konzept des „Perfect Storefront“ fasst unterschiedliche Anforderungen, die für die Schaffung „perfekter“ Kauferlebnisse wichtig sind, zu einem Anforderungsprofil zusammenzufassen. Hier eine kleine Auswahl:

Dies ist nur die Spitze des Eisbergs. In unseren Workshops zur technischen Frontend-Optimierung behandeln wir diese Aspekte im Detail und erweitern den Katalog je nach individueller Situation und Zielsetzung um weitere relevante Kriterien.

Exkurs: Bedeutung des „Perfect Storefront“ für SEO

Die Performance eine Online-Shops ist nicht nur für den Verkaufserfolg onsite von Bedeutung. Die oben genannten Performance-Kriterien werden auch für Suchmaschinen immer wichtiger. So hat Google die bisherigen „Core Web Vitals“ (Loading, Interactivity, Visual Sability) 2021 in seine „Search signals for page experience“ integriert. Diese entscheiden damit wesentlich über das Ranking eines Shops.

Googles „Core Web Vitals“ werden „Ranking Signals“

Wichtig: Unser Konzept der „Perfect Storefront“ soll nicht nur für optimale Kauferlebnisse im Online-Shop und damit für größeren Verkaufserfolg sorgen, sondern es legt auch die Basis für die erfolgreiche Vermarktung von Produkten und Inhalten über Suchmaschinen (SEO).

Lesenswert dazu: Anleitung zu E-Commerce SEO von E-Commerce Tuners

Technische Frontend-Optimierung (onsite)

Den Weg zur „Perfect Storefront“ in Unternehmen begleiten wir in einem mehrstufigen Prozess der technischen und inhaltlichen Frontend-Optimierung, wobei beide Bereiche eng zusammenhängen.

Im Rahmen der technischen Frontend-Optimierung (onsite) analysieren wir im ersten Schritt den Status Quo eines Online-Shops anhand ausgewählter Kriterien für die „Perfect Storefront“ – Performance, Responsiveness, Personalisierung, Flexibilität und Struktur der Backend-Architektur, Einheitlichkeit der Frontend-Architektur, und weitere, die im konkreten Fall von Bedeutung sind.

In Performance- und Usability-Tests und in Workshops mit unseren Kunden identifizieren wir Optimierungspotenziale und skizzieren mögliche Schritte und Maßnahmen für die Frontend-Optimierung. Dabei orientieren wir uns zu Beginn an den „Low hanging fruits“ – den Potenzialen, die sich schnell und mit geringem Aufwand und Risiko erreichen lassen. Dazu gehört z.B. die Eliminierung von (überflüssigen) Scripten, die das Laden von Shop-Inhalten kritisch verzögern und so das Kauferlebnis schmälern.

Beispiel für die Prüfung der Shop-Performance mittels Lighthouse Score Calculator

Bei der technischen Frontend-Optimierung setzen wir auf moderne Tools für die Analyse und Optimierung und unsere langjährigen Erfahrungen aus zahlreichen Projekten, die insbesondere für den „Deep dive“ in die vorhandene System-Architektur eines Shops sehr wertvoll ist.

Wichtig: Technische Frontend-Optimierung ist kein einmaliges Projekt sondern ein fortlaufender Prozess, denn so wie sich Märkte und die Präferenzen der Käufer (und Suchmaschinen) verändern, verändern sich auch die technischen Anforderungen an das Frontend des Online-Verkaufs.

Technologien und Daten

Technologie allein macht noch keine „Perfect Storefront“. Neben der Systemarchitektur und Shop-Funktionen spielen auch Produkt- und Nutzerdaten eine zentrale Rolle, wenn es darum geht, überdurchschnittliche Kauferlebnisse zu bieten.

Die Qualität der Produktdaten entscheidet wesentlich darüber, wie Produkte im Verkauf präsentiert werden. Metainformationen in den Produktdaten ermöglichen zudem eine intelligente Steuerung von Shop-Funktionen, wie beispielsweise die Personalisierung von Inhalten und Prozessen.

Nicht wenige Online-Shops leiden an einer schwachen Performance (Geschwindigkeit, Verfügbarkeit und Stabilität) weil die Qualität der Produktdaten mangelhaft ist. Mehr dazu und Ansätze, die Qualität Ihrer Produktdaten nachhaltig zu optimieren finden Sie in unserem Whitepaper zum kostenlosen Download: Produktdatenmanagement der nächsten Generation

Neben den Produktdaten spielen auch Kunden- bzw. Nutzerdaten aus dem Online-Verkauf eine wichtige Rolle für die Frontend-Optimierung. Denn nur wenn ein Shop die Käufer individuell „erkennt“ lassen sich Angebot und Shop-Inhalte passend zu den individuellen Bedürfnissen personalisieren. Dazu müssen Nutzerdaten in hoher Qualität bereitgestellt und intelligent verarbeitet werden.

Moderne Customer Data Platforms (CDP) bieten die Möglichkeit, Produkt- und Nutzerdaten aus verschiedenen Quellen (CRM, PIM, DAM, CMS) systematisch zusammenzuführen und für den Online-Verkauf zu konsolidieren. Die Herausforderung besteht darin, die Daten aus verschiedenen Welten logisch zu verknüpfen, um individuelle Kauferlebnisse schaffen zu können. Das ist Data-Excellence.

Fazit: Groß denken, klein starten… und das Thema ernst nehmen

Das Konzept der „Perfect Storefront“ definiert das Optimum für die Verkaufsfläche eines Online-Shops und damit die technischen und inhaltlichen Anforderungen. Der Weg dorthin sollte je nach Ausgangssituation schrittweise erfolgen und sich an der Wertschöpfung für das Unternehmen orientieren. Neueste Technologien können dabei unterstützen, sollten jedoch nicht die Hauptmotivation für technische Frontend-Optimierung sein. Bei der technischen Frontend-Optimierung, wie wir sie verstehen, geht es darum, die „low hanging fruits“ zu erkennen und schrittweise zu realisieren. Besonders Unternehmen, die neu in den digitalen Verkauf einsteigen, sollten das Thema technische Frontend-Optimierung von Beginn an einplanen. Dabei unterstützen wir mit unserer Beratung und in unseren Workshops.

Lesen Sie auch unseren 2. Teil zum Thema technische Frontendoptimierung!