Eine Progressive Web App (PWA) ist eine Webanwendung, die es Ihnen ermöglicht, Benutzern auf Mobilgeräten ein natives, App-ähnliches Erlebnis zu bieten, sodass sie schnell, reibungslos und auf ansprechende Weise auf Ihre Website zugreifen können.
PWAs werden sofort geladen, reagieren schnell auf Benutzerinteraktionen und fühlen sich wie eine gewöhnliche App an. Sie benötigen keinen App Store für die Installation und ermöglichen es den Benutzern, die Website sofort wieder zu betreten, selbst wenn ein Gerät offline ist.
- PWAs können nur auf HTTPS-Websites aktiviert werden.
- PWAs werden auf Chrome für Android unterstützt. Wenn PWA aktiviert ist, fragt der Browser den Benutzer automatisch, ob er die Website zum Startbildschirm hinzufügen möchte.
- Sie können PWA auch auf IOS-Geräten mit Version 11.3 hinzufügen. Da die automatische Meldung „Zum Bildschirm hinzufügen“ des Browsers jedoch noch nicht verfügbar ist, müssen Benutzer PWA manuell hinzufügen. Weitere Informationen dazu finden Sie beim Apple-Support.
So aktivieren sie die PWA-Funktion:
- Klicken Sie im linken Bereich auf SEO & Einstellungen und dann auf Progressive Web App (PWA).
- Klicken Sie auf den Schalter Progressive Web App aktivieren.
- (Optional) Klicken Sie auf den Schalter Seiten-Markup zuerst aus Cache bereitstellen. Diese Einstellung ändert die Caching-Strategie unseres Service Workers (für Runtime-Websites). Anstatt zuerst im Netzwerk zu prüfen, holt er die Seite zuerst aus dem Cache (solange sie nicht neu veröffentlicht wird). „Cache zuerst“ (Schalter aktiviert) kann am besten sein, wenn Sie wissen, dass sich die Website und ihre Assets nicht viel ändern werden, da die zwischengespeicherten Informationen schnell geladen werden und für Kunden offline leichter verfügbar sind. Wenn die Daten so frisch wie möglich sein sollen, ist es am besten, zuerst das Netzwerk zu verwenden (die Umschaltfunktion ist deaktiviert).
- (Optional) Klicken Sie auf die Option Aufforderung des mobilen Browsers zur Installation der Webseite als App aktivieren. Wenn diese Option aktiviert ist, können Sie die folgenden Einstellungen konfigurieren:
- Name. Dies ist der Name, der auf dem Begrüßungsbildschirm und in der „Zum Startbildschirm hinzufügen“-Meldung angezeigt wird. Er kann bis zu 60 Zeichen lang sein.
- Kurzname. Dieser Name wird verwendet, wenn nicht genügend Platz für die Anzeige des vollen Namens vorhanden ist, beispielsweise auf der Startseite der Mobilgeräte-Ansicht. Dieser Name kann bis zu 60 Zeichen lang sein, aber wir empfehlen Ihnen, ihn so kurz wie möglich zu halten.
- Icon. Dies ist das Symbol, das auf der Startseite der Mobilgeräte-Ansicht und auf dem Begrüßungsbildschirm beim Laden der App angezeigt wird. Es muss mindestens 192 Pixels breit sein und im .png- Format vorliegen.
- Hintergrundfarbe für den Begrüßungsbildschirm. Diese Farbe wird beim Laden der Webseite angezeigt.
Wenn ein Benutzer von seinem Mobilgerät aus auf eine mit PWA aktivierte Website zugreift, wird unterhalb der Website ein „Zum Startbildschirm hinzufügen“-Button angezeigt. Nach dem Hinzufügen zum Startbildschirm wird das Icon auf ihrem Gerät angezeigt, um einen schnellen Zugriff auf die Website zu ermöglichen (ähnlich wie bei einer App).
Der Benutzer kann nun über dieses Icon erneut auf die Website zugreifen, auch wenn das Gerät offline ist.