Warum sollte ich eine PWA App entwickeln lassen?

WArum sollten Sie eine PWA App entwickeln lassen? Wie die meisten Dinge im Leben unterliegt auch die Internetbranche einem ständigen Wandel und sucht ständig nach besseren Lösungen. Die Nutzung mobiler Geräte hat heute einen enormen Aufschwung erlebt, und dieser Trend wird sich auch in Zukunft fortsetzen.

Die Unternehmen sind gezwungen, sich an ein stark wettbewerbsorientiertes Umfeld und an die rasch wachsenden Erwartungen der technikbegeisterten Verbraucher anzupassen. Die Unternehmen reagieren darauf mit einem ständigen Streben nach Innovation, indem sie Gewinne ausgeben, um das Web-Erlebnis der Nutzer zu verbessern, und verschiedene Plattformen pflegen, die oft stark eingeschränkt sind.

Und gerade als wir dachten, dass die Branche an ihre Grenzen stößt, kam Progressive Web Apps (PWAs), eine neue und unglaublich vielversprechende Technologie, die die Art und Weise, wie Menschen mit Websites interagieren, unwiderruflich verändert hat. Obwohl es die Technologie schon seit einiger Zeit gibt, haben wir in den letzten Jahren einen dramatischen Anstieg der Popularität von PWAs erlebt.

PWAs kombinieren das Beste einer Website mit dem Besten, was native Apps zu bieten haben, und schaffen so ein phänomenales mobiles Nutzererlebnis. Es handelt sich dabei um spezielle Webanwendungen, die wie normale Websites aufgerufen werden, aber Vorteile wie Offline-Zugriff, Push-Benachrichtigungen und Zugriff auf die Gerätehardware bieten – Dinge, die bisher nur für native Anwendungen verfügbar waren.

Jetzt, wo PWAs das heißeste Thema auf Technologiekonferenzen sind, ist es wichtig, dass jedes Unternehmen die Technologie versteht. Dies ist Ihre Chance, mobile Nutzer für sich zu gewinnen, indem Sie sich von der Konkurrenz abheben und eine überragende digitale Reise anbieten, die sich in höherem Engagement, Kundenzufriedenheit und Konversionsraten niederschlägt.

Nachfolgend finden Sie einen umfassenden Überblick über Progressive Web Apps, in dem die Technologie, ihre Funktionen und die geschäftlichen Vorteile erläutert sowie bewährte Verfahren und hilfreiche Tipps vorgestellt werden, die Ihnen den Einstieg erleichtern. Finden Sie die Antworten auf Ihre Fragen und erfahren Sie, warum Progressive Web Apps eine wahrhaft revolutionäre Lösung sind, die einen so tiefgreifenden Einfluss auf das heutige mobile Web-Erlebnis hat.

WAS GENAU IST EINE PWA?

Einfach ausgedrückt, ist eine PWA eine Website mit allen Vorteilen einer App. PWAs bieten Ihnen eine schnellere, zuverlässigere und ansprechendere Version Ihrer Website oder Ihres eCommerce-Shops.

PWAs können die meisten Funktionen von nativen Apps übernehmen, z. B. Offline-Betrieb, Zugriff auf Kamera und Mikrofon bei Bedarf, GPS und mehr.

Stellen Sie sich einen Kunden vor, der in Ihrem Online-Shop stöbert und die Seite sofort lädt, während er 35.000 Fuß hoch fliegt oder die U-Bahn nimmt – und weiß, dass seine Bestellung automatisch bearbeitet wird, wenn er wieder online ist!

Webanwendung vs. native Anwendung

Einerseits sind Webanwendungen leichter zugänglich (vor allem für neue Nutzer), da sie einfach über einen Webbrowser aufgerufen werden können. Bei Webanwendungen müssen die Nutzer die Anwendung nicht auf ihrem Computer oder Mobilgerät installieren. Darüber hinaus werden Web-Apps im Internet auf einem Webserver gehostet, was bedeutet, dass sie leicht aktualisiert und auf allen Arten von Geräten und Betriebssystemen verwendet werden können. Mit anderen Worten: Es besteht keine Notwendigkeit, Updates an mehrere App-Stores oder direkt an die Nutzer zu verteilen.

Native Apps hingegen müssen die Nutzer herunterladen und lokal auf ihren Geräten installieren. Das sind die Apps, die wir regelmäßig über App Stores oder App Marketplaces herunterladen. Im Allgemeinen sind native Apps schneller und leistungsfähiger als Web-Apps, da sie besser mit der Hardware des Geräts und den nativen Funktionen (einschließlich Kamera, GPS und Mikrofon) zusammenarbeiten können. Native Apps sind jedoch teurer in der Entwicklung und nicht immer mit allen Geräten kompatibel (jedes Betriebssystem benötigt eine eigene Version der App).

PWAs verwandeln Webseiten in Anwendungen: so geht’s

Wie kann ich eine intelligente Webanwendung installieren?

Ein großer Vorteil von PWAs ist, dass sie einfach zu installieren sind, und der Prozess wird für PWA-fähige Webbrowser wie Chrome und Edge immer einfacher. „Apple ist in einer besonderen Position, wenn es um PWAs geht: Auf macOS können Sie PWAs außer in Safari installieren; auf iOS können Sie PWAs nur in Safari installieren. Im Folgenden erfahren Sie, was Sie tun müssen, um PWAs auf den wichtigsten Betriebssystemen zu installieren (in der Reihenfolge ihrer Beliebtheit).

In Chrome:

Für Websites, die die PWA-Funktionalität vollständig aktivieren, wird im Chrome-Hauptmenü eine Auswahl an Installationsprogrammen angezeigt. (Beachten Sie, dass Sie die Option Zum Startbildschirm hinzufügen für Websites auswählen können, die keine PWA-Funktionalität haben.) Die Langklick-Optionen umfassen immer noch Deinstallieren, aber die verräterische Option darunter ist Website-Einstellungen – etwas, das Sie für im Store installierte Apps nicht sehen.

Firefox:

Für Websites, die in PWAs umgewandelt werden können, ist das Firefox-Menü eine einfache Installationsoption. Tippen Sie auf diese Option, und das Dialogfeld Zum Bildschirm hinzufügen wird angezeigt. Von Firefox erstellte PWAs haben ein kleines orangefarbenes Firefox-Logo unten rechts neben dem Hauptanwendungslogo. Wie bei den von Chrome entwickelten Apps wählen Sie einfach „Entfernen“ aus dem Kontextmenü, um eine App loszuwerden. Im Gegensatz zu den für Chrome erstellten Seiten sehen Sie keine Auswahl an Seiteneinstellungen, die ein realistischeres Gefühl vermitteln.

Installation von PWAs unter Windows

Edge: Der Standard-Windows-Webbrowser bietet die beste Möglichkeit, PWAs auf Microsofts Desktop-Betriebssystem zu installieren. Der Grund dafür ist, dass die App in Ihr Startmenü aufgenommen wird, genau wie jede andere App, die Sie auf die übliche Weise installieren (entweder mit einem heruntergeladenen App-Installationsprogramm oder über die Microsoft Store-App).

Rufen Sie die Website auf, die Sie als PWA installieren möchten.
Wenn die App als PWA installiert werden kann, können Sie auf das Symbol auf der rechten Seite der Adressleiste klicken, das wie drei Quadrate und ein Pluszeichen aussieht (der Hover-Text lautet „App verfügbar“. Installieren Sie [App-Name]), oder Sie können Apps aus dem Drei-Punkte-Überlaufmenü auswählen und dann auf Installieren [App-Name] klicken. Bei einigen PWAs wird das Installationsfeld automatisch angezeigt.
Alles. Ihre neue Anwendung erscheint im Startmenü, erhält ein eigenes Symbol in der Taskleiste (nicht das Edge-Symbol) und kann in eine Desktop-Verknüpfung umgewandelt werden. Wenn Sie die PWA deinstallieren möchten, können Sie dies über das Rechtsklickmenü „Start“, über die Seite „Einstellungen für Programme und Funktionen“ von Windows oder über die Seite „Edge-Steuerungsprogramme“ tun.

PWAs auf iOS und iPadOS installieren

Wie bereits erwähnt, erlaubt Apple nur Safari die Erstellung von PWAs auf iOS und iPadOS – Browser von Drittanbietern sind davon ausgenommen. „Safari verwendet die Begriffe „Installation“ und „App“ nicht wie alle anderen Browser, die PWAs unterstützen. Um eine PWA auf iOS oder iPadOS zu installieren, laden Sie eine PWA-fähige Website, wählen Sie „Pfeil nach oben“ am unteren Rand des Bildschirms und wählen Sie „Zum Startbildschirm hinzufügen“. Beachten Sie, dass Sie das Gleiche auf jeder Website tun können, aber Sie werden nicht die Offline-Funktionalität einer echten PWA erhalten.

Als ich eine PWA für Instagram erstellte, sahen das Symbol und die App identisch mit der App Store-Version aus, aber statt der Option „App entfernen“ im Langklickmenü sah ich eine Option „Lesezeichen löschen“. Bitte beachten Sie, dass PWA-Symbole nicht in der App-Bibliothek von iOS 14 erscheinen. Sie erhalten also auf Apple-Mobilgeräten nicht dasselbe vollständige App-Erlebnis mit PWA wie auf anderen Plattformen. Angesichts der ablehnenden Haltung von Apple gegenüber offenen Systemen sollte dies keine große Überraschung sein.

PWA-Bereitstellung unter macOS

Die macOS-Installation von PWAs funktioniert auf die gleiche Weise wie unter Windows, aber der Standardbrowser Safari bietet keine Möglichkeit, eine Website als PWA zu installieren. Ihre neue Anwendung erscheint in Launchpad, aber nicht im Finder-Ordner „Programme“.

Apps, die mit Chrome oder Edge erstellt wurden, erhalten ein schönes Top-Menü, das nach der neuen App und nicht nach dem Browser benannt ist, und ich konnte sogar Outlook PWA zu meiner Standard-E-Mail machen. Sie müssen PWAs jedoch aus dem Browser entfernen und nicht nativ aus dem Betriebssystem.

Installation von PWAs auf Linux Betriebssystemen

Unter Linux können Sie PWAs in den Webbrowsern Brave, Chrome und Edge (derzeit in der Beta-Phase) auf die gleiche Weise einrichten wie auf anderen Desktop-Betriebssystemen. Sie sehen die gleiche Installationsschaltfläche in der Symbolleiste und tippen einfach auf diese Schaltfläche, um eine PWA zu erstellen. Ich habe das in Ubuntu ausprobiert. Das PWA-Programmsymbol wird auf der Anwendungsseite angezeigt, und das eindeutige Programmsymbol, nicht das Browsersymbol, erscheint im Aktivitätsfenster.

Beachten Sie, dass Sie diese Vorteile nicht nutzen können, wenn Sie Brave oder den Open-Source-Browser Chromium verwenden. Sie können immer noch eine Version der Website ohne den Browserrahmen erstellen, aber Sie müssen sie über die Hauptanwendung des Browsers öffnen.

Pwas auf Chrome OS installieren

Das Desktop-Betriebssystem von Google verhält sich etwas anders als der Chrome-Browser auf anderen Plattformen: In der Adressleiste des Browsers gibt es eine Schaltfläche mit einem umgekehrten Pluszeichen sowie eine Menüoption zur Installation von [Name der Anwendung]. Wenn Sie eine dieser Optionen auswählen, werden Sie zum Google Play App Store weitergeleitet, wo Sie die App installieren können. Ja, es ist immer noch eine PWA, aber eine, die Sie aus dem App Store beziehen. Das war meine Erfahrung bei der Installation einer PWA auf Twitter, aber auf Outlook Web wurde die PWA durch Auswahl derselben Schaltfläche auf dieselbe Weise installiert wie auf einem Windows-PC.

Es ist keine schlechte Erfahrung, aber wie bei allen Dingen, die mit Chrome OS zu tun haben, wünschte ich, es gäbe mehr Konsistenz. Dies führt zu einiger Verwirrung, da die Outlook-App im Google Play Store keine PWA ist, während der Twitter-Eintrag eine ist. Wenn Sie die Outlook PWA und die Outlook-App im Google Play Store installieren, erhalten Sie zwei App-Symbole in der App-Ablage.

Jetzt sind Sie dran…