Progressive Web-Apps (PWAs) sind Web-Apps, die mit modernen APIs entwickelt und optimiert wurden, um mehr Funktionen zu bieten und gleichzeitig alle Webnutzer auf allen Geräten mit einer einzigen Codebasis zu erreichen. Sie kombinieren die große Reichweite von Web-Apps mit den umfangreichen Funktionen plattformspezifischer Apps, um die Nutzerfreundlichkeit zu verbessern.
Die drei Säulen des PWA-Designs
Damit sich eine PWA genauso gut anfühlt wie eine plattformspezifische Anwendung, muss sie leistungsfähig, zuverlässig und installierbar sein.
Leistungsfähig
Webanwendungen sind heute leistungsfähiger als je zuvor und diese Funktionen werden immer weiter ausgebaut. In letzter Zeit hat sich die Software für das Web weiterentwickelt und bietet nun Funktionen, die früher nur plattformspezifischen Apps vorbehalten waren. So können Sie beispielsweise eine hyperlokale Video-Chat-App mit WebRTC, Geolocation und Push-Benachrichtigungen erstellen, die App installierbar machen und mit WebGL und WebVR Gespräche in die virtuelle Realität verlagern. Durch die Einführung von WebAssembly können Entwickler auf andere Ökosysteme wie C, C++ und Rust zugreifen und jahrzehntelang plattformspezifische Funktionen ins Web bringen. Ein gutes Beispiel dafür, wie Entwickler die neuen Funktionen des Webs nutzen, ist Squoosh.app, ein webbasierter Bildkomprimierer.
Obwohl einige Funktionen noch nicht im Web verfügbar sind, wird der Funktionsumfang des Webs durch neue und bevorstehende APIs ständig erweitert. Dazu gehören Funktionen wie der Zugriff auf das Dateisystem, die Mediensteuerung, App-Badges und die vollständige Unterstützung der Zwischenablage. Alle diese Funktionen basieren auf dem sicheren, nutzerorientierten Berechtigungsmodell des Webs. So werden Nutzer geschützt und die Verwendung neuer Websites wird weniger einschüchternd.
Zuverlässig
Eine zuverlässige Progressive Web-App fühlt sich unabhängig vom Netzwerk schnell und zuverlässig an. Nutzer erwarten Apps, die schnell auf Interaktionen reagieren und auf die sie sich verlassen können.
Die Geschwindigkeit ist entscheidend, damit Nutzer Ihre App verwenden. Wenn die Seitenladezeit sich von einer Sekunde auf zehn Sekunden erhöht, steigt die Wahrscheinlichkeit, dass ein Nutzer abspringt, um 123%.
Leistungsprobleme wirken sich auf die gesamte Nutzererfahrung aus, nicht nur auf das onload-Ereignis. Bei einer zuverlässigen App wissen Nutzer immer, ob eine Interaktion mit der App registriert wurde. Scrollen und Animationen müssen flüssig sein. Nutzer müssen den Eindruck haben, dass Ihre App gut funktioniert, und sie muss auch tatsächlich gut funktionieren.
Zuverlässige Apps müssen auch unabhängig von der Netzwerkverbindung nutzbar sein. Nutzer erwarten, dass Apps auch bei langsamen oder instabilen Netzwerkverbindungen oder sogar im Offlinemodus schnell geladen werden. Sie erwarten, dass die neuesten Inhalte, mit denen sie interagiert haben, z. B. Mediatracks oder Tickets und Reisepläne, verfügbar und nutzbar sind, auch wenn die App Probleme beim Senden von Anfragen an Ihren Server hat. Wenn eine Anfrage nicht möglich ist, erwarten sie, dass die App ihnen mitteilt, dass es ein Problem gibt, anstatt stillschweigend zu scheitern oder abzustürzen.
Installierbar
Wenn Sie Ihre PWA installierbar machen, wird sie aus dem Browser in ein separates Fenster verschoben. Das verändert die Art und Weise, wie Nutzer sie wahrnehmen und mit ihr interagieren. Installierte PWAs können über den Startbildschirm, das Dock, die Taskleiste oder die Ablage des Nutzers gestartet werden. Der Nutzer kann auf einem Gerät danach suchen und mit der App-Umschaltfunktion zwischen ihnen wechseln. So entsteht der Eindruck, dass sie Teil des Geräts sind, auf dem sie installiert sind.
Durch die Installation einer PWA werden auch neue Funktionen verfügbar, darunter Tastenkürzel, die normalerweise in einem Browser reserviert sind. PWAs können sich auch registrieren, um Inhalte von anderen Anwendungen zu akzeptieren oder die Standardanwendung für bestimmte Dateitypen zu sein.
Ergebnisse aus PWAs abrufen
Das Einführen einer PWA verbessert nicht nur die Nutzerfreundlichkeit. Außerdem werden Ihre Messwerte verbessert und der Wert Ihres Dienstes gesteigert. Hier einige Beispiele:
- Die PWA von Twitter führte zu 65% mehr Seiten pro Sitzung, 75% mehr Tweets und einer um 20% niedrigeren Absprungrate. Gleichzeitig konnte die Größe der App um über 97 % reduziert werden.
- Nach der Umstellung auf eine PWA verzeichnete Nikkei 2,3-mal mehr organischen Traffic, 58% mehr Abos und 49% mehr aktive Nutzer pro Tag.
- Hulu hat die plattformspezifische Desktop-Oberfläche durch eine PWA ersetzt und konnte so die Zahl der wiederkehrenden Besuche um 27% steigern.
Weitere Informationen zu den Vorteilen von PWAs finden Sie unter Progressive Web-Apps für mehr Geschäftserfolg.