Seit die Google-Entwickler Frances Berriman und Axel Russell 2015 den Begriff progressive Web-App eingeführt haben, ist die Begeisterung für die neue Web-Technologie ungebrochen. PWAs bieten fast alle Vorteile einer nativen App, müssen aber nicht über einen Appstore heruntergeladen werden, sodass Sie die Grenzen zwischen einer nativen App und einer mobilen Website verwischen.
Dass Unternehmen ihre Kunden auf mobilen Geräten ansprechen ist heute längst selbstverständlich: Die Frage ist nicht mehr, ob Sie einen mobilen Shop oder eine mobile Website betreiben wollen, sondern wie Sie Ihre Kunden am besten erreichen. Grundsätzlich hat ein Unternehmen, das mobile Kunden ansprechen möchte, drei Möglichkeiten: Eine responsive Webseite entwickeln, eine native App bereitzustellen oder eine progressive Web-App (PWA) anzubieten.
Mobile Websites sind schnell und einfach zu erreichen, in Bezug auf die Benutzererfahrung sind sie jedoch im Nachteil. Native Apps bieten die beste Benutzererfahrung, sind aber auf bestimmte Geräte beschränkt und weisen verhältnismäßig hohe Akzeptanzschranken auf, da sie einen Download erfordern. So entsteht beim Verbraucher zunächst ein erheblicher Buy-In-Wert, sodass der Vorteil des Impulsverhaltens verloren geht. Zwischen diesen beiden Optionen befindet sich die neueste mobile Lösung: die PWA.
Durch den Einsatz von PWAs verbinden Sie die Vorteile mobiler Websites und nativer Apps, verringern aber die Nachteile, die mit diesen Lösungen verbunden sind.
Was sind progressive Web-Apps?
Im einfachsten Sinne ist eine progressive Web-App eine mobile App, die über das Web bereitgestellt wird. Sie funktioniert wie eine native App, da eine App-Shell verwendet wird, die Gesten und Navigationen im App-Stil ermöglicht. Der Hauptunterschied besteht darin, dass es nicht erforderlich ist, diese aus einem App Store herunterzuladen. PWAs laufen eigenständig direkt in einem Webbrowser. Mit Hilfe von sogenannten „Service Workern“, die intelligentes Caching ermöglichen, kann eine progressive Web-App auch in Bereichen mit geringer Konnektivität sofort geladen werden. Mit Hilfe des Pre-Caching bleibt die App immer auf dem neuesten Stand und zeigt beim Start die neueste Version an.
PWAs lösen zwei Probleme auf einmal
Um zu verstehen, warum PWAs für den E-Commerce so wichtig sind, müssen wir uns den aktuellen Stand des mobilen Webs heute genauer ansehen. Laut Forrester und Shop.org liegen die durchschnittlichen Conversion-Rates für native mobile Apps bei 6 Prozent (4,2 Prozent), während mobile Websites mit nur 2,3 Prozent hinterherhinken.
Aus diesen Zahlen können wir schließen, dass gut entwickelte und gut gebaute native mobile Apps ein so fantastisches und reibungsloses Einkaufserlebnis bieten, dass sie gegenüber dem Desktop ein überlegenes digitales Einkaufserlebnis liefern. Diesem deutlichen Vorteil stehen jedoch zwei wesentliche Nachteile entgegen: Erstens sind native mobile Apps in der Entwicklung und Wartung sehr teuer; und zweitens laden und verwenden Konsumenten nur Apps von Marken, mit denen sie regelmäßig interagieren. Native Apps eignen sich daher hervorragend für Unternehmen, die über siebenstellige mobile Entwicklungsbudgets, ausgereifte Treueprogramme verfügen oder Kunden haben, die mehrmals im Monat mit der App interagieren und einkaufen. Für den durchschnittlichen Händler ist eine native App-Strategie daher nur selten wirtschaftlich sinnvoll.
Hier spielen PWAs ihre Trümpfe aus: Sie haben die Fähigkeit, in mobilen Webbrowsern mit Open-Web-Technologien erstaunlich schnelle und glatte „App-ähnliche“ Erlebnisse zu liefern. Dabei sind PWAs sogar effizienter als native Apps. Sie arbeiten auf Abruf und sind jederzeit verfügbar, ohne den wertvollen Speicher oder die mobilen Daten eines Smartphones zu belegen. Eine PWA kommt im Vergleich zu einer nativen Version derselben Anwendung mit einem geringeren Datenvolumen aus. Das bedeutet jedoch nicht, dass Benutzer auf die Bequemlichkeit einer nativen App verzichten müssen. Sie können die PWA immer noch auf ihrem Startbildschirm speichern – sie kann ohne lästigen Download installiert werden.
Gegenüber einer responsiven Website bzw. einem Online-Shop bieten PWAs also eine deutlich verbesserte Nutzererfahrung. Gleichzeitig sind die Einstiegshürden für die Nutzung im Vergleich zu einer nativen App deutlich geringer: Ein einfacher Klick auf einen Link genügt. Es müssen nur wenige Daten auf dem Gerät gespeichert werden. Eine aufwändige und platzraubende Installation über die klassischen App Stores ist nicht erforderlich.
Für Online-Händler, die mit einer massiven Verlagerung des Datenverkehrs vom Desktop auf mobile Geräte konfrontiert sind, halten PWAs deshalb enorme Möglichkeiten bereit. PWAs schlagen zwei Fliegen mit einer Klappe: Sie bieten einerseits eine verbesserte Leistung und Benutzerfreundlichkeit und dadurch andererseits einen positiven Einfluss auf die Conversion-Rate im mobilen Web. Außerdem müssen Händler nicht in die Entwicklung teurer nativer Apps investieren.
PWAs werden mit Open-Web-Technologien entwickelt
Bei PWAs handelt es sich um eine Weiterentwicklung von Open-Web-Technologien. Der technologische Unterschied zwischen einer PWA und dem bestehenden responsive Webdesign (RWD) besteht darin, dass PWAs zu 100 Prozent mit JavaScript, HTML und CSS erstellt werden. Das Geheimnis der PWAs liegt in einem neuen Satz von APIs, die kürzlich in Webbrowsern als „Service Worker“ hinzugefügt wurden. Service Worker lassen es zu, dass JavaScript im Hintergrund der PWA ausgeführt wird und wichtige Funktionen wie das vorhersagende Laden von Inhalten verarbeitet. Hinzu kommt das Senden von Push-Benachrichtigungen sowie das Synchronisieren und Empfangen von Daten.
Gibt es einen Nachteil bei der Nutzung von PWAs?
Nein. Anfängliche Bedenken hinsichtlich der allgegenwärtigen Browserunterstützung, des SEO-Rankings und der Unterstützung auf dem Desktop wurden identifiziert und sind mit den neuesten Versionen bereits ausgeräumt.
Heutige PWAs sind:
- SEO-freundlich: PWAs sind nicht wie herkömmliche Websites, da sich die Seiten schrittweise anpassen, während der Benutzer navigiert und Aktionen durchführt. Im Wesentlichen werden Seiten selten neu geladen, daher bleibt die URL konstant. Glücklicherweise verfügen alle großen Suchmaschinen über Mechanismen zum Durchsuchen des JavaScript einer PWA-Site, genau wie für eine herkömmliche responsive Website. Der Schlüssel ist die Aufrechterhaltung guter SEO-Praktiken wie die Verwendung kanonischer URLs und die Verwaltung einer durchsuchbaren Sitemap.
- Desktopfreundlich: PWAs sind nicht ausschließlich für das mobile Web gedacht. Tatsächlich unterstützen Desktop-Browser auch Service Worker. Dies ist wichtig, da PWAs ansprechend entwickelt werden können und sollten, um unterschiedliche Bildschirmgrößen auf Mobilgeräten, Tablets und Desktops zu unterstützen.
- Sind nun auch für Safari verfügbar: Apple hat mit der Version iOS11 Service Workers für Safari eingeführt. Seitdem können PWAs nicht nur auf Android-Handys und Desktop-Browsern wie Chrome, Firefox usw. genutzt werden, sondern auch auf iOS-Geräten
Unterm Strich bedeuten PWAs mehr mobile Besucher, mehr Nutzung und verbesserte Conversions.
Warum PWAs von Nutzern bevorzugt werden
PWAs bieten mobile Usern eine ganze Reihe positiver Nutzererfahrungen:
- Schnelleres Browsen: PWAs sind dank intelligenter Caching Strategien viel schneller in der Interaktion und sorgen für ein reibungsloseres Scrollen und schnelleres Blättern von Seiten, da sich die Darstellung „progressiv“ ändert, sodass Seiten nicht mehr neu geladen werden müssen. Google bietet sogar ein Test-Tool (Lighthouse) an, mit dem Sie die Leistung Ihres PWAs messen können.
- Sofortige App-Verfügbarkeit: PWAs sind sofort über den Browser auffindbar und nutzbar, sodass keine App heruntergeladen oder installiert werden muss, bevor sie verwendet werden kann.
- Push-Benachrichtigungen: PWAs unterstützen Push-Benachrichtigungen im Browser. Dadurch wird den Nutzern die Möglichkeit geboten, Echtzeit-, Kontext- und personalisierte Kommunikationen mit einem einfachen „Ein-Klick“-Opt-in direkt von der PWA-Seite aus zu senden. Zudem erhalten die Betreiber der PWA die Möglichkeit, die Nutzer ohne native App aktiv anzusprechen und einzubinden.
- Offline-Verwendbarkeit: PWAs können den Status des Mobilfunknetzes erkennen und können so designed werden, dass sie schlechte Netzwerkbedingungen tolerieren. Beispielsweise kann ein PWA den Kataloginhalt proaktiv abrufen, um während ggf. auftretender Funklöcher eine ununterbrochene und nutzbare Erfahrung zu gewährleisten.
- Native Feeling: Genau wie bei einer nativen App kann eine PWA auf dem Startbildschirm „gespeichert“ werden, sodass ein schneller Zugriff möglich ist, ohne dass der Browser geöffnet und eine URL eingegeben werden muss. Darüber hinaus arbeiten PWAs im „Vollbildmodus“, wobei die Browser-URL-Leiste oben und die Browser-Navigationstools unten ausgeblendet werden, um ein natives „App-ähnliches“ Erscheinungsbild zu erzeugen. Last but not least bieten PWAs auch einen sogenannten Splashscreen an, sodass die Nutzererfahrung noch App-ähnlicher wird.
Die nächsten Schritte für Ihr Unternehmen
PWAs stellen einen enormen Fortschritt im Web dar, der in der Größenordnung dem Übergang von konventionellen Desktopseiten zum responsive Design vor fünf Jahren ähnelt. Insbesondere für Early Adopters hält die neue Technologie große Chancen bereit. Denn wie so oft gilt auch hier: Der frühe Vogel fängt den Wurm. Mit der Version 2.3 hat Magento deshalb das Magento PWA Studio veröffentlicht. Magento-User haben so die Möglichkeit, schon jetzt von den Vorteilen der PWA-Technologie zu profitieren.
Für Unternehmen, die angesichts des 2020 auslaufenden Supports für Magento 1 vor dem Plattformwechsel stehen, bietet die innovative PWA-Technologie zudem einen weiteren Anreiz, ihre E-Commerce-Strategie im Rahmen des Replatforming neu auszurichten und fit für die Zukunft zu machen. Als Ihr zuverlässiger und kompetenter Technologie-Partner unterstützen wir Sie gerne dabei.
Weitere Informationen zum Shopsystem Magento und unseren Services und Leistungen als Magento Partner finden Sie hier.
