Headless Commerce im Reality Check

Klare Perspektive mit Risikoanteil für die Migration von bestehenden Shops

Headless Commerce – es ist das Buzzword schlechthin. Überall liest man davon und neben technischen Artikeln erfährt man oft gar nicht, wieso dieses Thema so gehyped wird. Klar, alle sprechen davon wie toll es ist, wenn Frontend und Backend vollständig voneinander getrennt sind. Viele Anbieter haben sich bereits auf diese neue Geschäftswelt spezialisiert und bieten reine Frontend- oder Backend-Lösungen an. Es ist aber nicht die Architektur allein, die große Vorteile mit sich bringt. Einen weiteren Vorteil bilden die mit der Zeit entwickelten Frameworks zum Umgang in Headless-Architekturen: Angular, React und Vue. 
 

Machen wir uns nix vor – es geht ums Geld, genauer gesagt um Conversion Rate (CR) und Traffic, sich also einen größeren Teil des Kuchens zu sichern im Vergleich zu den Mitbewerbern. Es gibt mehrere Wege seine CR zu erhöhen:   

• hohe Produktdatenqualität / Data Quality  
• gekaufter Traffic (höhere Kaufabsicht) –> SEA  
• bessere UX, also eine intuitiv verständliche Shop-Oberfläche  
• Pagespeed 
• attraktives Pricing 
• konkurrenzfähige Auslieferungszeit in der Logistik

 

Im Grunde stehen dahinter die Bedürfnisse des Kunden nach Wohlempfinden, guter Navigation, Aufmerksamkeit, Schnäppchenjagd und kurzfristig wichtigen Käufen. 

Die oben genannten Frameworks führen zu UX by Design, wenn man sie in ihrer Intention korrekt anwendet. Und im Bereich Pagespeed ergibt sich mindestens ein gefühlter Geschwindigkeitsgewinn für den User. Einmal auf Angular, React oder Vue umgestiegen, ist man recht unkompliziert in der Lage, den eigenen Shop als SPA & PWA (siehe Infobox unten) zu realisieren – was meist die eigentliche Intention hinter der Entscheidung zu Headless ist. 

Headless & SEO – Vom Problem zum Vorteil

Aber trotzdem, warum denn gerade genau jetzt? Gibt’s da jetzt irgendwas Neues auf dem Markt? 

Ähnlich zur Autoindustrie und dem Elektromotor ist die Technologie bereits älter. Aber die Umstände haben sich grundlegend geändert. Das Hauptproblem bei Headless war schon immer SEO. 

Wenn ich in meiner robots.txt kein Disallow auf verwendete JS-Ressourcen setze, können Bots das Ganze inzwischen richtig gut interpretieren – mehr sogar, sie ranken die PWA-Headless-Websites sogar teilweise höher (Stichwort: eigenes SEO-Ranking mobile). D.h., dass die neuen Frameworks als Player auf dem Markt von Google & Co. extrem aufgewertet wurden. 

OK, voll überzeugt! Dann mal los!

Stopp! So eindeutig ist die Entscheidung dann doch nicht. Bitte an dieser Stelle keine kopflosen Entscheidungen. Ein Umstieg auf einen 100% Headless-Shop kann sich auch negativ auswirken. Je nachdem wie hoch der organische Traffic auf den bestehenden Shop ist, sollte vorab bedacht werden, dass NextJS (React inkl. Server-Side-Rendering (SSR)), Angular und NuxtJS (VueJS + SSR) als Frameworks verschiedene Vorgaben machen. Die Routing-Komponenten machen für die Struktur der SEO-URLs in Verbindung mit diesen Frameworks out of the box verschiedene Vorgaben, die mit bestehenden URL-Pattern kollidieren könnten. Eine vermeintlich einfache Lösung dieses Konflikts über eine erhöhte Anzahl HTTP-Redirects kann sich dabei negativ auf das erarbeitete SEO-Ranking auswirken. 

Eine weitere Hürde sind die in den Shop integrierten Payment-Gateways, die meist vertraglich mit einer längeren Laufzeit an den Shop gebunden sind. Die meisten Shops binden Payment-Provider noch über serverseitige Requests an das Frontend an und das hat entscheidende Vorteile: läuft die Abwicklung der Zahlung vollständig über das Frontend einer Headless-SPA&PWA ab, ist sie deutlich leichter anzugreifen. Hier sollte man also nach einer vorangegangenen Analyse überlegen, ob ein Teilschritt nicht sicherer & sinnvoller wäre, wenn man sich für eine Hybrid-Lösung aus Headless-Browsing-Frontend und Serverside-Checkout-Frontend entscheidet. 

Und noch etwas wird meist nicht bedacht – die Überwachung des Shop-Betriebs! 
Shop-Systeme sollten immer von einem Monitoring überwacht werden, damit ein DevOps-Team zeitnah handeln kann. Ist das dort eingesetzte Application Performance Monitoring (APM) nicht in der Lage eine PWA mit Headless-Unterbau zu monitoren, könnte das den Livegang eines Headless-Relaunches noch einmal um mehrere Monate unverhofft nach hinten schieben.    

Sie sehen also, dass eine fundierte Headless-Entscheidung Milestones & Budgets schonen kann! 

Sprechen Sie uns an, wenn Sie eine Abschätzung vor einem potenziellen Headless-Projektstart benötigen. Eine Erstberatung ist kostenlos & unverbindlich.

Hier kostenlose Erstberatung anfordern

Mehr Infos zum Thema Headless Commerce:

piazzablu.com/headless

Google Bot, SEO & SPA:
https://vuejsdevelopers.com/2018/04/09/single-page-app-seo/

Frameworks: 
https://nuxtjs.org
https://github.com/nuxt
https://nextjs.org
https://github.com/vercel/next.js