Ihr Experte für Single Page Applications und Progressive Web Apps
Ich bin Alexandr Stoian, entwickle Single Page Applications und Progressive Web Apps schnell, sauber und ganz auf Ihren Bedarf zugeschnitten.
Ich habe mich ganz auf die Entwicklung von Single Page Applications (SPAs) und Progressive Web Apps (kurz: PWAs) konzentriert, denn ich bin von den Technologien überzeugt und habe schon einige dieser Anwendungen zum Leben erweckt. Ich glaube, dass sie die Zukunft des mobilen Internets sind und einen Großteil der Native Apps, die Sie aus den App-Stores kennen, verdrängen werden.
Doch was genau verbirgt sich hinter den beiden Technologien – und warum nennen wir sie in einem Atemzug?
Doch der Reihe nach: Was sind eigentlich…
Single Page Applications
Single Page Applications (SPAs) sind eine Art von Web-Anwendungen, die im Browser der Nutzer:innen geladen werden und nur eine einzige Seite haben. Im Gegensatz zu herkömmlichen Mehr-Seiten-Anwendungen, bei denen bei jedem Klick eine neue Seite vom Webserver geladen wird, wird bei einer SPA die gesamte Anwendung auf einmal geladen.
Führt eine Person eine Aktion aus, wird nur ein Teil der Website oder bestimmte Inhalte verändert, ohne dass der Rest der Anwendung neu geladen werden muss. SPAs eignen sich besonders für Community-Webseiten mit nutzergeneriertem Content oder für Webseiten mit großen Mengen an dynamischen Content, der sich laufend ändert, und viele interaktive Elementen beinhaltet. Sie sind sehr schnell und komfortabel und fühlen sich für an wie eine richtige Native App.
Die Vorteile von SPAs sind vielfältig. Sie bieten
- großartige Usability
- auf alle Bildschirmgrößen angepasste Gestaltung (Responsiveness) und Personalisierung
- geringere Server-Belastung
- einfachere Fehlerbehebung
Allerdings gibt es auch einige Nachteile von SPAs. Sie haben langsamere anfängliche Ladezeiten (weil eben große Teile zu Beginn auf einmal geladen werden müssen), Herausforderungen bei der Suchmaschinenoptimierung und beim Tracking für die Web-Analyse.
Was haben SPAs und Progressive Web App gemein?
Progressive Web App basieren auf Single Page Applications. Eine PWA ist eine SPA, die bestimmte Kriterien erfüllen muss, um als „progressiv“ zu gelten.
Das “Progressive” in Progressive Web App bedeutet, dass die Anwendung zunächst den Inhalt von der Webseite herunterlädt und dann nach und nach mehr Ebenen und Funktionalitäten hinzufügt – abhängig vom Browser und der Internet-Verbindung des Nutzers. Daher sind PWAs für alle Plattformen geeignet (auch wenn auf sehr alten Browser-Versionen nur die relevantesten Informationen erscheinen).
Darüber hinaus bieten PWAs deinen Nutzer:innen bestimmte zusätzliche Funktionen wie Push-Benachrichtigungen, Offline-Zugriff und lokales Caching (darauf gehe ich später noch genauer ein), durch die sich die Nutzung deiner Anwendung noch mehr nach richtiger App anfühlt.
Jetzt ist die beste Zeit, eine SPA / PWA zu gestalten oder Ihre bestehende App aus den App-Stores in eine PWA zu verwandeln. Die Technologie macht enorme Fortschritte, deine Konkurrenz schläft vielleicht noch… Bringen Sie Ihre PWA jetzt mit mir zum Fliegen!
Und mit Web-Service AS hast als Partner, der
- Sie offen und ehrlich über Chancen und Grenzen berät,
- die Technologie aus dem Effeff beherrscht,
- zuverlässig und sauber arbeitet,
- bereits einige PWAs mit Erfolg umgesetzt hat oder daran arbeitet (z. B. Bau.io, Kalendu, KyotoQuiz)
- (jetzt noch) günstig ist – wir wollen uns einen begeisterten Kundenstamm aufbauen!
Progressive Web Apps: schnell, verlässlich und fesselnd
Im Folgenden nennen ich Ihnen die Vorteile von PWAs und vermittle Ihnen die Technologie. Schließlich will ich auch Sie überzeugen. Die Erklärung funktioniert am besten, wenn ich PWAs mit den so genannten “Native Apps” vergleiche. Das sind die Apps, die Sie sich aus Apples App Store oder Google Play herunterladen können.
PWAs finden ganz im Browser statt, fühlen sich aber wie eine Native App an. Man kann sich PWAs wie eine Symbiose aus einer responsiven Website und einer Native App vorstellen. Vor allem diese drei Eigenschaften bringen das App-Gefühl in Ihre PWA:
Icon auf dem Startbildschirm
Ihre Nutzer können die PWA auf den Homescreen ihres Smartphones oder Tablets herunterladen. So lädt sie Ihre Nutzer von prominenter Stelle zur Interaktion ein. Das verstärkt die Bindung zu Ihrem Angebot.
Offline-Nutzung
Auch wenn die Nutzer keine oder keine stabile Verbindung haben – Ihre PWA ist nie offline. Wenn der Nutzer online ist, lädt die PWA vorsorglich die wichtigsten Daten im Hintergrund herunter. Praktisch, oder?
Push-Benachrichtigungen direkt an deine Nutzer
Ihre PWA sendet Push-Nachrichten an Ihre Kunden. Sie bleiben in Kontakt mit Ihren Kunden, selbst wenn sie gerade nicht im Internet sind und können sie über neue Inhalte oder Rabatte in deinem Shop benachrichtigen.
Chancen und Grenzen von Progressive Web Apps
Doch damit nicht genug! Die Liste der Vorteile von PWAs ist lang – und wird im Zuge der Weiterentwicklung von Browsern immer länger. Ich habe Ihnen hier eine Auswahl zusammengestellt:
Schnell verteilt: Die PWA ist ganz simpel über eine URL zu erreichen. Und einen Browser hat so gut wie jedes Smartphone oder Tablet. Damit tragen Sie Ihre Inhalte, Produkte und Services auf direktem Weg zu Ihren Nutzern – ohne die Vertriebshürde “App-Download”. Bei Nativen Apps liegen einige Schritte zwischen dem Finden der App im App Store und der tatsächlichen Nutzung. Bei PWAs entfallen diesen Schritte.
Schnell geladen: Vom Homescreen starten PWAs sofort, ganz gleich, ob Ihre Nutzer keinen oder unbeständigen Empfang haben. Schnell verfügbar sein ist wichtig: Google hat herausgefunden, dass 53 % der Nutzer eine Website verlassen, wenn sie länger als 3 Sekunden lädt. Studie
Keine Downloads: Mit PWAs müssen Ihre Nutzer keine Apps oder Updates aus den App-Stores herunterladen. Sie sparen Ihren Kunden Aufwände. Sie selbst müssen sich nicht mit teils undurchschaubaren Review-Prozessen, Gebühren, Updates und geografischen Restriktionen der App-Stores herumschlagen.
Gesucht? Gefunden! PWAs laufen im Browser. Damit können Ihre User die PWA wie andere Websites als Lesezeichen speichern und leicht zu Ihnen zurückkehren. Außerdem sind die Inhalte für Suchmaschinen auffindbar. Damit können Sie sich eine Traffic-Quelle aufbauen, um noch mehr Nutzer zu erreichen.
Teilen erwünscht! Da PWAs über URLs erreichbar sind, lassen sich Links über die Social-Media-Plattformen teilen! So können Sie Ihre treusten Fans weiterempfehlen!
Daten sparen! PWAs sind schlanke Anwendungen, die das Datenvolumen deiner Nutzer schonen. Damit sind PWAs sehr interessant für Länder mit einem schwach ausgebauten Mobilnetz.
Gerne interaktiv! PWAs eignen sich durch ihre schnelle Reaktionsfähigkeit auf Eingaben Ihrer User und butterweiche Animationen besonders für Seiten, die User zur Interaktion einladen, wie zum Beispiel für Kontaktformulare, Rechner, Check-out-Prozesse oder Kontaktformulare.
EINE Entwicklung! Wieso für eine responsive Website, Android-App und iOS-App dreifache Entwicklungs- und Wartungsaufwände betreiben? Mit einer PWA reduzieren sich die Arbeiten auf eine Anwendung, die auf allen Plattformen eine gute Figur macht.
Bei all den Vorteilen muss es doch auch ein paar Probleme mit PWAs geben. Ich bin ehrlich: Die gibt es auch. Wie bei jeder neuen Technologie, unterstützen nicht alle Betriebssystem und Browser alle Funktionen. Sie können sich aber sicher sein, dass auf Android nahezu auf allen aktuellen Browser-Versionen die wichtigsten Funktionalitäten wie Homescreen-Icon, Offline-Funktionalität und Web-Push-Notifications laufen. Bei Apple hält sich die Unterstützung noch in Grenzen, aber auch hier scheint sich ein Wandel einzustellen. In der Version 12.2 von iOS (2019) hat das Unternehmen aus Cupertino das Betriebssystem mit neuen PWA-Features ausgestattet.
Im Gegensatz zu Native haben PWAs nur eingeschränkten Zugriff auf die Hardware. Das betrifft unter anderem Funktionen wie den Fingerprint-Scanner, Near Field Communication (NFC), Geo-Fencing, Ambient Light oder eine weiträumige Kontrolle über die Kamera. Zumindest noch. Auch hier zeichnen sich Entwicklungen ab, wonach die Funktionen, die bisher Native Apps vorenthalten waren, auch PWAs zur Verfügung gestellt werden.
Beratung auf Augenhöhe
Sie sehen: Ich sehe PWAs nicht nur durch die rosarote Brille. Mir ist es wichtig, Sie offen und ehrlich zu beraten. Ich sage Ihnen, wo die Chancen und Grenzen Ihrer Wunsch-PWA sind.
Ich könnte Ihnen an dieser Stelle noch viel mehr über weitere Facetten der PWAs erzählen, zum Beispiel den Service Worker, Routing, Data Binding, Angular und, und, und. Aber hier soll es nicht um technische Details gehen (die sind mein Job). Vielmehr geht es um die Verwirklichung Ihrer Vision von einer App, um Ihr Geschäftsmodell, um die bestmögliche Erfahrung für Ihre Nutzer.
Ich kann es kaum erwarten, mit Ihnen zusammen eine PWA zum Leben zu erwecken oder eine Native App in eine PWA zu verwandeln.
Ich freue mich auf Sie und Ihre Vision!
Alexander Stoian