Progressive WebApp (PWA)

Eine Progressive WebApp (PWA) ist eine Art von Webanwendung, die die besten Eigenschaften traditioneller Websites und mobiler Anwendungen vereint. Sie sind so gestaltet, dass sie in einem Browser wie eine normale Website funktionieren, bieten aber zusätzlich Funktionen und ein Benutzererlebnis, das man sonst nur von nativen Apps kennt, wie zum Beispiel:

  • Offline-Fähigkeit: PWAs können auch ohne Internetverbindung funktionieren, da sie Inhalte zwischenspeichern.
  • Push-Benachrichtigungen: Sie können Benachrichtigungen direkt auf dein Gerät senden, ähnlich wie bei mobilen Apps.
  • App-ähnliche Oberfläche: PWAs können so gestaltet werden, dass sie sich wie eine native App auf deinem Gerät anfühlen und bedienen lassen.

Das Besondere an PWAs ist, dass sie ohne Installation über einen App Store genutzt werden können. Stattdessen kann man sie direkt über den Browser "installieren" und wie eine native App auf dem Startbildschirm oder im Dock des Geräts verwenden.

Alle INtex WEB Anwendungen sind als PWA ausgestaltet. Sie können die Programme also auch lokal installieren. Nur die offline-Fähigkeit ist nicht gegeben, da die sich ändernden, umfangreichen Datenbestände nicht sinnvoll und zeitnah synchronisiert oder heruntergeladen werden können.

Installation einer Progressive WebApp in verschiedenen Browsern

1. Google Chrome

Installation:

  • Desktop (Windows, MacOS): Besuche die Website, die als PWA verfügbar ist. Klicke auf das kleine Symbol (ein Pluszeichen in einem Rechteck oder "Installieren") rechts in der Adressleiste. Bestätige die Installation im daraufhin erscheinenden Dialogfeld.
  • Mobile Geräte: Auf einer PWA-Website wirst du möglicherweise einen Hinweis sehen, die PWA zu installieren. Du kannst auch das Menü öffnen (drei Punkte oben rechts) und auf „Zum Startbildschirm hinzufügen“ klicken.

Aufrufen:

  • Windows/MacOS: Nach der Installation erscheint die PWA wie eine native Anwendung auf dem Desktop oder im Startmenü. Du kannst sie wie eine normale App öffnen.
  • Mobile Geräte: Ein Icon der PWA wird auf deinem Startbildschirm angezeigt, ähnlich wie bei nativen Apps.

2. Microsoft Edge

Installation:

  • Desktop (Windows, MacOS): Besuche die PWA-Website und klicke auf das Menü-Symbol (drei Punkte oben rechts). Wähle "Apps" > "Diese Seite installieren" aus.
  • Mobile Geräte: Ähnlich wie bei Chrome, öffne das Menü und wähle „Zum Startbildschirm hinzufügen“.

Aufrufen:

  • Windows/MacOS: Die PWA wird im Startmenü oder im Dock angezeigt und kann von dort aus gestartet werden.
  • Mobile Geräte: Ein Icon der PWA wird auf deinem Startbildschirm angezeigt.

3. Safari

Installation:

  • MacOS: Safari unterstützt PWAs noch nicht so umfassend wie Chrome oder Edge, bietet aber dennoch die Möglichkeit, eine Webseite als "App" hinzuzufügen. Besuche die Website, die du installieren möchtest, und klicke auf „Teilen“ (das Kästchen mit dem Pfeil nach oben). Wähle „Zum Startbildschirm hinzufügen“.
  • iOS (iPhone, iPad): Öffne das Teilen-Menü und wähle „Zum Home-Bildschirm“.

Aufrufen:

  • MacOS: Nach der Installation erscheint das Icon im Dock, von wo aus die PWA wie eine normale App gestartet werden kann.
  • iOS: Die PWA wird wie eine native App auf deinem Startbildschirm angezeigt.

4. Mozilla Firefox

Installation:

  • Desktop (Windows, MacOS): Firefox unterstützt PWAs nicht in derselben Weise wie Chrome oder Edge, aber du kannst Websites als App-ähnliche Verknüpfung speichern. Öffne das Menü (drei Linien oben rechts), wähle „Weitere Werkzeuge“ und dann „Seite speichern unter“.
  • Mobile Geräte: Öffne das Menü (drei Punkte oben rechts) und wähle „Zum Startbildschirm hinzufügen“.

Aufrufen:

  • Windows/MacOS: Die gespeicherte Website kann über die erstellte Verknüpfung aufgerufen werden.
  • Mobile Geräte: Ein Icon der PWA wird auf deinem Startbildschirm angezeigt.

Bedienungsmöglichkeiten des PWA-Fensters

Nach der Installation einer PWA verhält sich das Fenster weitgehend wie eine native App:

  • Kein Adressfeld: Anders als in einem normalen Browserfenster fehlt bei PWAs oft das Adressfeld, wodurch das App-ähnliche Erlebnis verstärkt wird.
  • Fenstersteuerung: Du kannst das Fenster minimieren, maximieren oder schließen, genau wie bei anderen Desktop-Anwendungen.
  • Drag & Drop: Das Fenster lässt sich verschieben und in der Größe ändern.
  • Taskleiste/Dock: PWAs können direkt über das Icon in der Taskleiste (Windows) oder im Dock (MacOS) gestartet werden.