Die Welt von morgen heißt Daten-Highway
3,45 Billiarden Dollar sind 2019 im weltweiten Onlinehandel umgesetzt worden. Das entspricht einem Wachstum von 19 Prozent gegenüber 2018. Trotzdem ist der Markt noch lange nicht ausgereizt. Wie Onlinehändler ihre Profite weiter steigern können, indem sie ihre Shops benutzerfreundlicher gestalten, steht immer wieder zur Debatte. Kein Wunder also, dass es einen erbitterten Diskurs über die folgende Frage gibt: Was ist sinnvoller für ein Unternehmen: sich der eigenen Kundschaft auf mobilen Endgeräten als App oder doch besser als responsive Webseite zu präsentieren?
Nun sieht es so aus, als habe diese Diskussion ihr unerwartetes Ende gefunden. Denn die Technologie der Progressive Web App (PWA) hält Einzug in immer mehr Onlineshops und bringt dabei alle Vorzüge von Webseiten und Apps in einem kompakten Paket mit.
Wie eine PWA funktioniert, welche Vorteile du und deine Kunden von dieser neuen Art der Anwendung haben, wo ihre Gefahren lauern und wie du deinen Onlineshop auf die Technologie umstellst, erfährst du in diesem Artikel.
Du möchtest dein Unternehmen aufs nächste Level bringen? Teste Shopify jetzt kostenlose und lerne alle Funktionen kennen.
Onlinehandel in der guten alten Zeit
Bereits 2014 nutzten 69 Prozent der deutschen Bevölkerung das Internet auf mobilen Endgeräten; dass diese Zahl seitdem noch angestiegen ist, scheint dabei nur plausibel. Für Händler, die online ihre Waren feilbieten, sind Smartphones und Tablets essenzielle Vertriebskanäle – und dabei standen bislang vor allem zwei Wege offen:
Web Stores
Da wäre zunächst die klassische Website. Selbst umfangreiche Onlineshops lassen sich mittlerweile unkompliziert anlegen und verwalten. Der Kunde ruft die Seite bei Bedarf einfach in seinem Browser auf. Das Prinzip, eine URL einzutippen, ist jedem Web-Surfer hinlänglich bekannt, er muss nichts installieren und keine überflüssigen Daten auf seinem Handy speichern.
Lesetipp: Mit den richtigen Online-Shop-Ideen wird dein Traum vom eigenen Unternehmen wahr. Starte jetzt mit unseren Tipps!
Allerdings hat diese einfachste aller Lösungen auch ihre Nachteile. Der offensichtlichste ist, dass der Einkaufsvorgang abrupt zu Ende ist, sobald die Internetverbindung abreißt. Dabei muss es gar nicht zu einem völligen Zusammenbruch des Netzes kommen, denn dem durchschnittlichen Nutzer vergeht bereits die Lust aufs Surfen, wenn aus der 4G-Anzeige auf seinem Telefon ein H oder gar ein E wird. Drei Sekunden, länger warten die meisten Menschen nicht auf eine Webseite.
Dazu gesellen sich weitere Probleme, die eine Website mit sich bringen kann: Das Eintippen einer Internetadresse auf einem kleinen Display ist mitunter lästig, vielleicht hat der potenzielle Kunde gar den Namen des Shops vergessen. Und ob die Seite schlussendlich in wirklich jedem Browser auf jedem Gerät leserlich angezeigt wird, steht in den Sternen.
Lesetipp: 20 großartige Shopify-Store-Beispiele aus Deutschland, Österreich und der Schweiz findest du hier.
Shopping Apps
Die zweite Möglichkeit sind Apps, also jene Anwendungen, die Nutzer sich meist über einen eigenen Store (App Store, Google Play etc.) auf ihrem Smartphone installiert haben. Dadurch bleibt der jeweilige Anbieter seinen Kunden beständig präsent – schließlich landet das kleine Symbol des Programms direkt in der Liste aller installierten Apps, dem sogenannten App-Drawer oder sogar auf dem Startbildschirm.
Außerdem lässt sich eine App wunderbar personalisieren und bietet, dank weitreichender Möglichkeiten in Sachen Design und Interface, häufig eine bessere Nutzererfahrung als eine Webseite.
Allerdings ist die Entwicklung von Apps teuer, denn anders als Webseiten lassen sie sich nicht mit ein paar Mausklicks zusammenbasteln. Die dahinterstehende Technik ist so komplex, dass sie von einem ganzen Team aus Spezialisten konzipiert, entwickelt und gepflegt werden muss.
Hier stellen wir dir 8 Tipps zur Conversion-Rate-Optimierung vor. Schau vorbei!
Und auch nach der eigentlichen Programmierung ist das Ende der Kosten noch nicht erreicht, denn die App-Shop-Betreiber wie Apple und Google lassen sich ihre Dienste bezahlen. Wer dauerhaft in den Stores gelistet werden möchte, zahlt einen regelmäßigen Beitrag. Jedes Update der App kostet eine zusätzliche Gebühr.
Hinzu kommt die Unlust von immer mehr Nutzern fortwährend weitere Anwendungen auf ihrem Gerät zu installieren. Denn niemand mag einen App-Drawer, in dem er vor lauter Icons das eigene Adressbuch nicht mehr findet. App-Müdigkeit nennen Experten dieses Phänomen.
Lesetipp: In diesem Beitrag erfährst du, worauf du in puncto Dropshipping Steuern achten musst.
Die Alternative: Progressive Web Apps
Progressive Web Apps treten nun bereits seit 2018 die schwere Aufgabe an, alle Vorteile von Webseiten und Apps in sich zu vereinen und gleichzeitig all ihre Nachteile zu vermeiden. Zwar setzen bislang vor allem große Konzerne auf die neue Technologie, doch neue Entwicklungen im Bereich Browser- und Webseitenprogrammierung machen PWAs inzwischen auch zunehmend für kleine Unternehmen interessant und erschwinglich.
Was ist eine PWA?
Einfach gesprochen ist eine Progressive Web App eine Internetseite, die wesentlich mehr kann, als eine herkömmliche Website. Sie basiert weiterhin auf dem HTML-Quellcode, also der Sprache, durch die Webseiten meist strukturiert werden, und wird wie jeder andere Ort im World Wide Web über ihre Adresse angesteuert.
Dennoch werden die Unterschiede zu einer herkömmlichen Webseite schnell klar, wenn eine PWA geöffnet wird:
Eine Progressive Web App…
…ist auch offline verfügbar
Der größte Unterschied zu althergebrachten Webseiten ist, dass die PWA nach einmaligem Besuch auch dann geöffnet werden kann, wenn keine Internetverbindung zur Verfügung steht. Verantwortlich dafür sind sogenannte Service Worker. Sie sind ein relativ neuer Bestandteil von JavaScript. Das ist jene Sprache, welche das bereits erwähnte HTML um zahlreiche Funktionen erweitert und moderne, interaktive Webseiten erst möglich macht.
Diese guten Geister laden große Teile der PWA in den Cache des Browsers, sprich dem extra für das Surfprogramm reservierten Teil des Festplattenspeichers. Dieser Vorgang sorgt dafür, dass eine Seite sogar im Flugmodus aufgerufen werden kann. Und sie arbeiten dabei äußerst intelligent: Kommt es zu Veränderungen auf der Seite, lädt die Anwendung auch nur die neuen Informationen herunter. So wird das mobile Datenvolumen geschont.
Dein Vorteil
Deine Kunden können nach Herzenslust in deinem Shop stöbern, selbst wenn sie gerade mit dem ICE durch den Gotthard-Tunnel fahren. Vorausgesetzt natürlich, sie haben deine Seite irgendwann einmal besucht, als sie eine Verbindung zum WWW hatten. Alles, was dann tatsächlich aktiver Konnektivität bedarf – etwa das Absenden und Bezahlen einer Bestellung – kann einfach nachgeholt werden, wenn wieder Netzzugriff besteht.
Denn eine PWA merkt sich ihren aktuellen Zustand für unbegrenzte Zeit. Der Nutzer selbst bekommt davon allerdings so gut wie nichts mit. Alle Prozesse, die auf eine Internetverbindung angewiesen sind, starten automatisch im Hintergrund, wenn das Gerät wieder online ist. Lediglich die E-Mail mit der Bestellbestätigung trudelt mit etwas Verspätung ein.
…sieht aus wie eine App
Dank moderner APIs (den Programmierschnittstellen, die dem Entwickler neue Möglichkeiten, zum Beispiel bezüglich Animation oder Grafik, zur Verfügung stellen) muss eine PWA nicht aufgebaut sein und reagieren wie eine klassische Webseite. Vielmehr wirkt sie in Aufbau und Handhabung wie eine App.
So wird eine Progressive Web App beispielsweise immer im Vollbild-Modus dargestellt, störende Browser-Elemente werden ausgeblendet. Mit der üblichen Taste oder Geste kann der Nutzer die Seite allerdings wie gewohnt verlassen und zu der zuvor besuchten Website zurückkehren.
Auch der Einsatz der Kamera wird durch PWAs möglich
Dein Vorteil
PWAs bieten Möglichkeiten, die wir bislang nur von Apps kannten und die weit über den Funktionsumfang einer Webseite hinausgehen. Zum Beispiel kannst du deinen Shop so gestalten, dass ein Kunde seine Artikel tatsächlich einfach in den Einkaufswagen zieht, was gerade auf kleinem Display mehr ist, als eine nette Spielerei.
Denn ganz komfortabel das Produktbild greifen zu können, erweist sich dort schlicht als nutzerfreundlicher im Vergleich zum Versuch, mit der Fingerspitze einen winzigen Button zu treffen. Die Bezahlung kann danach einfach per Fingerabdruck erfolgen, denn wer hat schon Lust, immer wieder aufs Neue sein Passwort einzugeben?
Und anstatt umständlich Suchbegriffe in deinen Store einzutippen, kannst du deinen Besuchern die Option anbieten, ihre Kamera auf Objekte in ihrer Umgebung zu richten und deinen Shop danach zu durchforsten. So schaffst du für deine Besucher ein einzigartiges und unkompliziertes Einkaufserlebnis und hebst dich von der Konkurrenz ab.
Lesetipp: Apropos Apps - kennst du schon die Apps, auf die Shopify-Händler auf keinen Fall verzichten sollten? Hier findest du sie.
…verhält sich wie eine App
Zum Funktionsumfang einer PWA gehört alles, was Nutzer bislang nur von Apps kennen. So ist es kein Problem, eine Progressive Web App als Icon auf dem Startbildschirm oder im App-Drawer abzulegen oder dieses Symbol wieder zu löschen. Auch das Versenden von Push-Nachrichten ist für eine PWA ohne große Umstände machbar.
Dein Vorteil
Die permanente Präsenz deiner PWA direkt zwischen den anderen Apps des Kunden sorgt dafür, dass sie immer wieder an deinen Shop erinnert werden und ihn schnell erreichen. Anstatt umständlich den Browser zu öffnen, durch die Favoriten zu scrollen oder womöglich gar die URL eingeben zu müssen, reicht ein einfaches Antippen, um deinen Shop anzusteuern.
Dass eine PWA Push-Nachrichten verschicken kann, gibt dir wiederum eine schnelle und unübersehbare Option, deinen Besuchern Informationen zukommen zu lassen. Denn bis jemand die E-Mail mit deinem Newsletter voll aktueller Angebote geöffnet hat, ist diese Aktion vielleicht längst schon wieder vorbei. Eine Benachrichtigung direkt auf dem Telefon dagegen wird so leicht nicht übersehen und zieht häufig die direkte Interaktion des Lesenden nach sich.
…ist aber keine App
Eine PWA ist und bleibt eine Webseite – wenn auch eine, die um einiges mehr kann, als viele Surfer es bislang kennen. Das bedeutet zum einen, dass sie nicht erst umständlich im Shop gesucht, gefunden und installiert werden muss, zum anderen macht es sie flexibel, kostengünstig und unabhängig vom App und Play Store.
Dein Vorteil
Zunächst sparst du natürlich eine Menge Geld. Allein die Integration von Push-Nachrichten lassen sich Entwickler gerne 5.000 Dollar und mehr kosten. In einer PWA ist diese Funktionalität bereits eingebaut und ihre Realisierung viel einfacher und günstiger, als das Programmieren einer App (weiter unten mehr dazu).
Weiterhin ist es gar nicht so einfach, überhaupt im Play und App Store platziert zu werden. Bevor eine App dort auftauchen darf, durchläuft sie einen langwierigen Prozess, der nicht selten in einer mehr oder weniger klar nachvollziehbaren Ablehnung endet. Mit einer PWA umgehst du dieses Problem.
![Progressive Web Apps Vorteile]()
Haben PWAs auch Nachteile?
Haben PWAs auch Nachteile?
Kritische Leser mögen an dieser Stelle den Verdacht äußern, dass Progressive Web Apps einfach die nächste, sprichwörtliche Sau ist, die durchs Dorf getrieben wird. Denn gerade im Onlinebereich werden E-CommerceTrends schnell überhyped.
Doch PWAs scheinen sich auf dem Markt zu etablieren. Marketingexperten sind sich einig, dass dieser Technologie die Zukunft gehört und auch die reinen Zahlen sprechen für sich. So hat Flipkart, das indische Pendant zu Amazon, seine Conversion Rate seit der Einführung von PWA um 70 Prozent steigern können. Die Verweildauer der Seitenbesucher hat sich zeitgleich verdreifacht.
Lesetipp: PWA als Plan für 2020? Diese folgenden Vorsätze sind für dich als Onlinehändler garantiert auch interessant! Jetzt lesen.
Entscheidend für den Erfolg ist, dass mit PWAs ein Mehrwert für den Nutzer geschaffen wird. Das bedeutet: nicht jede kleine Homepage muss zum neuen Format wechseln. Die Wenigsten haben gesteigertes Interesse daran, die Fotos der letzten Jahreshauptversammlung des lokalen Taubenzüchtervereins auch offline betrachten zu können.
Für dich als Onlinehändler bedeutet dieser Umstand konkret, dass du vor allem behutsam vorgehen solltest. Hüte dich davor, das Smartphone deiner Besucher mit Push-Nachrichten zu belagern oder ungefragt Symbole auf ihrem Startbildschirm abzulegen. Solche Verletzungen der Privatsphäre werden gar nicht gerne gesehen und kosten dich schnell das Vertrauen deiner Kunden.
Und um auch noch das letzte Haar in der Suppe zu finden: Das Betreiben von PWAs ist teurer als eine „normale“ Webseite zu führen. Die Mehrkosten halten sich jedoch im Rahmen. Grob geschätzt kannst du mit 30 bis 100 Euro Zuschlag pro Monat rechnen.
Die Kosten sind demnach deutlich niedriger als die Entwicklung und Betreuung einer nativen App. Hier veranschlagen Entwickler für die Programmierung einer Taschenlampen-App gerne Beträge um die 800 Euro, eine waschechte E-Commerce-App schlägt mit mindestens 20.000 Euro zu Buche.
Ohne großen Aufwand kann jede PWA als Icon auf dem Homescreen landen
Welche systemischen Anforderungen stellt eine PWA?
Für eine erfolgreiche technische Umsetzung stellen PWAs keine großen Ansprüche. Im Grunde gilt, wenn du bereits über eine moderne Webseite verfügst, lässt sie sich sehr einfach in eine Progressive Web App umwandeln.
Die einzigen Voraussetzungen sind zum einen die Verwendung von HTTPS. Diese Abkürzung steht für “Hypertext Transfer Protocol Secure“ und bezeichnet die Vorschrift, nach der Computer über das Internet miteinander kommunizieren. Anders als beim alten HTTP (also ohne Secure) werden Daten im HTTPS abhörsicher verschlüsselt. Keine moderne Webseite und erst recht kein Onlinestore geht heutzutage noch ohne diesen zusätzlichen Schutz an den Start - und wenn es nur aus dem Grund ist, dass Suchmaschinen HTTPS-Seiten in ihren Ergebnissen bevorzugen.
Zum anderen fordern PWAs ein responsives Design, also eine Gestaltung der Webseite, die sich in Auflösung und Anordnung an jede beliebige Displaygröße und jeden verwendeten Browser anpasst. Auch dies gehört inzwischen zum Branchenstandard. Kein Webdesigner, der diesen Namen verdient, würde seinen Kunden etwas Anderes anbieten.
Der Rest liegt in der Hand des Nutzers, denn noch ist nicht jeder Browser in der Lage, PWAs zu unterstützen. Zu den Programmen, welche die moderne Technik bereits beherrschen, gehören derzeit Google Chrome und der kurz vor der Veröffentlichung stehende neue Microsoft Edge. Laut Statistik sind dadurch immerhin schon zwei Drittel aller Surfer mit an Bord. Apple zögerte bislang mit seinem Safari noch etwas, unterstützt aber bereits die Offline-Verfügbarkeit und zeigt sich offen gegenüber weiteren Funktionen.
Der altehrwürdige Internet Explorer muss leider passen. Wann frei entwickelte Browser wie Firefox oder Opera PWAs in vollem Umfang ausführen können, ist ebenfalls nicht bekannt. Falls du also planst, zukünftig selbst eine Progressive Web App zu launchen, informiere dich am besten schon in der Planungsphase, ob sich an der jetzigen Situation etwas geändert hat.
Wer nutzt bereits Progressive Web Apps?
Hierzulande ist man mit der Einführung von PWAs etwas zögerlich. Aber einige große deutsche Unternehmen haben die neue Art des Surfens schon für sich entdeckt. Ganz vorne mit dabei sind der Automobilkonzern BMW, zumindest auf seiner englischsprachigen Webseite, die Deutsche Lotto Gesellschaft und die Continentale Versicherung.
International finden sich zahlreiche Beispiele für Betreiber von PWAs. Dazu gehören etwa das Kosmetikinstitut Lancôme aus Frankreich, die bekannten US-amerikanischen Konzerne Starbucks und Uber, die NASA oder das chinesische Online-Kaufhaus AliExpress.
Aber natürlich musst du kein Weltkonzern sein, um Progressive Web Apps erfolgreich umsetzen zu können. Auch zahlreiche kleinere Seiten, die auf dem Shopify-Backend basieren, nutzen die Technologie für sich.
Lesetipp: Du willst wissen, warum bereits eine Million Unternehmen auf Shopify setzt? Was ist Shopify und welche Vorteile hat das System? Erfahre es hier.
Da wäre zum Beispiel der Shop von StriVectin an. Dort findest du eine große Auswahl an Pflegeprodukten für eine gesunde Haut - selbstverständlich durchgehend auf Basis natürlicher Wirkstoffe.
Für natürlich schöne Haut - die Homepage von StriVectin
Oder auch die Homepage des Gertränkeherstellers Recess. Hier gibt es nicht einfach Brause, sondern Mineralwasser in so außergewöhnlichen Geschmacksrichtungen wie Hibiskus oder Pfirsich-Ingwer.
Mineralwasser mal anders: Recess
Technikfreunde werden ihren Spaß bei einem Besuch des Shops von rachio haben. Dort gibt es Bewässerungsanlagen für den Garten. Allerdings nicht einfach langweilige Sprinkler, sondern intelligente Geräte, die sich per Smartphone steuern und programmieren lassen.
Moderner kann Bewässerung nicht sein
Wie kann ich PWAs in meinem eigenen Shop umsetzen?
Wenn du bereits einen Onlinestore hast, ist das Upgrade auf PWA überraschend einfach. Mehr als eine kleine Anwendung im App-Format brauchst du nicht, um auf alle neuen Funktionalitäten zugreifen zu können. Der Vorgang läuft dabei nahezu vollständig automatisiert ab: Die App benötigt den Zugriff auf den Quellcode deiner Webseite und passt alle relevanten Einstellungen automatisch an.
Lediglich für wirklich aufwändige Ideen wie den Einsatz der Kamera oder eine komplette Umstellung des User Interface auf Gestensteuerung möchten wir dir den Kontakt zur Marketingagentur deines Vertrauens ans Herz legen. Dort findest du Webentwickler, die in der Lage sind, auch ausgefallene Wünsche umzusetzen.
Seriöse Shopify-Experten aus Deutschland, Österreich und der Schweiz findest du in unserer englischen Expertensuche.
Bis dahin empfehlen wir dir eine der zahlreichen Apps, die die Umstellung automatisch für dich vollziehen. Als eines von vielen Beispielen sei hier PWA by Ampify Me genannt. Dort halten die Entwickler auch gleich eine Beispielseite für dich bereit, auf der du einen Vorgeschmack auf das bekommen kannst, was deinen eigenen Store erwartet.
Auf der technischen Überholspur
Progressive Web Apps sind Webseiten, die aussehen, funktionieren und sich anfühlen wie eine Native App. Zahlreiche Funktionen, wie die Offlineverfügbarkeit, schnellere Ladezeiten und die Verlinkung auf den Startbildschirm von Mobilgeräten wirken sich häufig positiv auf die Verweildauer und Conversion Rate von Besuchern der Seite aus.
Einfach in der Umsetzung und günstig in der Finanzierung sind sie eine zukunftsweisende Möglichkeit für jeden Onlinehändler, seine eigene Webpage im Gedächtnis seiner Kunden zu verankern, Besucher zur Wiederkehr zu bewegen und sich von den Mitbewerbern abzuheben.
Starte deinen eigenen Onlineshop mit Shopify!
kostenlose testen—keine Kreditkarte erforderlich.
Über die Autorin: Inara Muradowa ist SEO & Content Beraterin. Ihr Schwerpunkt ist der Bereich E-Commerce. Im Shopify-Blog porträtiert sie am liebsten erfolgreiche Gründer*innen und gibt Insider-Tipps zu aktuellen Trends.