• Progressive Web Apps

    Website als App

Behalten Sie mit unserem Technologieradar die wichtigsten KMU relevanten Technologien im Blick!

Zum Technologieradar

Einführung

Progressive Web Apps (PWA) sind Websiten, die über einen Browser aufgerufen werden, dabei aber gleichzeitig Eigenschaften von nativen Smartphone Apps aufweisen. PWAs unterscheiden sich dabei in Handhabung und Aussehen kaum von einer speziell für das Smartphone entwickelten App, da sie sich an das Endgerät flexibel anpassen können.

Zum aktuellen Stand

PWAs gelten als kostengünstige Alternative zu nativen Smartphone-Apps. Durch diesen Ressourcenvorteil und die Anpassungsfähigkeit gelten sie vor allem in der Einzelhandelsbranche als präferierte Art der Unternehmenswebsite für verschiedene große Unternehmen. Dabei unterstützen PWAs neben der Anpassungsfähigkeit an nahezu jedes Endgerät weitere app-typische Funktionen, wie zum Beispiel die Möglichkeit einer Installation auf den Homescreen des Nutzers. Zusätzlich können solche Web-Apps, seit 2023 auch auf iOS-Geräten, Push-Benachrichtigungen nutzen und durch Caching Offline-Funktionalitäten bieten.

Technologieverbreitung

Prototypen und Demonstratoren vorhanden
Branchenübergreifender Einsatz
KMU geeignet?

Technologiebeschreibung

Eine Progressive Web App (PWA) funktioniert aus Anwendersicht wie eine native App, die aber über einen Browser aufgerufen wird. PWAs sind jedoch auf ihrer eigenen Website gehostet und somit indexierbar, was bedeutet, dass Suchmaschinen auf diese verlinken können und Zugriff auf Daten über das Nutzerverhalten erheben können.

Abgrenzung Web-Apps

Gegensätze

Progressive Enhancement

Im Gegensatz zu üblichen Web-Apps sind PWAs in der Lage sich durch Progressive Enhancement an verschiedene Endgeräte wie Smartphones und Laptops anzupassen. Das bedeutet, dass z. B. Geräten mit kleinerem Display und geringerer Leistung automatisch eine angepasste Version der PWA angezeigt wird, um die bestmögliche Nutzererfahrung zu gewährleisten.

Netzwerkunabhängigkeit

Ein weiterer Unterschied von PWAs im Vergleich zu üblichen Webseiten ist die Netzwerkunabhängigkeit. Diese ermöglicht es Nutzern, die Webseite erneut aufzurufen und bereits zuvor geladene Inhalte ohne aktive Internetverbindung anzusehen. Diese Netzwerkunabhängigkeit wird durch den Service Worker, einem Programm, das im Hintergrund des Browsers läuft, ermöglicht. Der Service Worker übernimmt das Caching, wodurch die Offline-Nutzung der PWA ermöglicht wird. Außerdem ist er für das Senden von Push-Benachrichtigungen verantwortlich.

Einsatzmöglichkeiten

Der Einsatz von PWAs ist aufgrund ihrer Flexibilität in nahezu allen Branchen und für verschiedene Arten von Webanwendungen möglich. Dies gilt auch für KMU. In solchen Unternehmen können zum Beispiel klassische Webshops durch Integration in eine PWA mit App-typischen Funktionen ergänzt werden. Lokale Dienstleister können ihre Website um digitale Prospekte mit inkludierter Kundenkarte erweitern. Aber auch eine digitale Visitenkarte, die Funktionen wie das Buchen von Terminen oder den Kontakt zum Kundensupport erleichtert, ist mit dieser Technologie realisierbar.

Chancen für KMU

App-Store unabhängig

Kostengünstig

Suchmaschinenanbindung

Kundenbindung durch App-ähnliche UX

Schrittweise Einführung

  • 1. Anforderungsanalyse

    Im ersten Schritt müssen Sie definieren, was Sie mit Ihrer PWA erreichen wollen. Dabei ist es wichtig, herauszufinden, wer Ihre Nutzer sind, und welche Bedürfnisse Sie haben. Zusätzlich werden in diesem Schritt technische Anforderungen an die PWA bestimmt. Benötigen Sie z. B. Offline-Funktionalitäten oder Push-Benachrichtigungen?

  • 2. Planung und Design

    Sobald die Anforderungen an die App aufgestellt sind, wird die Architektur geplant. Dabei werden Technologien und Tools ausgewählt, die verwendet werden sollen. Zusätzlich wird in diesem Schritt das Design der App entworfen.

  • 3. Entwicklung

    In diesem Schritt wird die Entwicklungs- und Produktionsumgebung eingerichtet. Danach wird die grundlegende Struktur der PWA entwickelt und daraufhin der Service Worker programmiert bzw. adaptiert und implementiert. Zusätzlich werden die Serverseite (Backend) und die Nutzeroberfläche (Frontend) gestaltet.

  • 4. Testen

    Sobald die PWA fertig entwickelt ist, bietet es sich an einen Testlauf durchzuführen. Dadurch können Funktionen und die Nutzerfreundlichkeit dieser getestet werden, aber auch die Performance der Web-App.

  • 5. Deployment

    Sobald Sie alle vorherigen Schritte abgeschlossen haben können Sie Ihre PWA auf Ihrem Webserver veröffentlichen.

Sie brauchen Unterstützung bei der Einführung von Progressive Web Apps in Ihrem Unternehmen? Kontaktieren Sie uns!

Behalten Sie mit unserem Technologieradar die wichtigsten KMU relevanten Technologien im Blick!

Sprechstunde vereinbaren
Zum Technologieradar
WordPress Cookie Plugin von Real Cookie Banner