PWA-Manifest-Checker
Validiert Ihre Progressive Web App manifest.json auf Chrome-Installierbarkeit: Name, Symbole (192×192 + 512×512), Anzeigemodus, start_url, maskierbare Symbole, theme_color, Screenshots. Installierbarkeitsgrad A-F.
So verwenden Sie PWA-Manifest-Checker
- 1Geben Sie Ihre Website-URL ein — das Tool findet Ihre manifest.json automatisch.
- 2Das Manifest wird abgerufen und gegen Chrome PWA-Installierungsanforderungen validiert.
- 3Symbolgröße (192×192, 512×512, maskierbar) und erforderliche Felder werden überprüft.
- 4Eine Note A-F spiegelt wider, wie bereit Ihre Site für die PWA-Installation ist.
ZenovayAnalytics
Analytics, für Gründer gebaut.
- Besucher-Tracking in Echtzeit
- Datenschutz zuerst, kein Cookie-Banner
- In zwei Minuten eingerichtet
Verwandte Tools
JSON-Formatter und Validator
Formatieren, validieren und verschönern Sie JSON-Daten mit Syntaxhervorhebung und Fehlererkennung.JWT-Decoder
Dekodieren und inspizieren Sie JWT-Token. Zeigen Sie Header, Payload und überprüfen Sie Signaturen.Base64 Encode/Decode
Kodieren Sie Text in Base64 oder dekodieren Sie Base64 zurück in Text. Unterstützt UTF-8 und Binärdaten.URL Codierungstool
Codieren oder decodieren Sie URL-Komponenten. Verarbeiten Sie Sonderzeichen, Abfragezeichenfolgen und vollständige URLs.Häufig gestellte Fragen
Was macht eine PWA in Chrome installierbar?▾
Chrome benötigt folgende Kriterien, um die Installationsaufforderung anzuzeigen: (1) Ein Web-App-Manifest, das von HTML mit <link rel="manifest"> verknüpft ist. (2) Ein name-Feld im Manifest. (3) Ein start_url-Feld. (4) Ein display-Wert von "standalone", "fullscreen" oder "minimal-ui". (5) Icons mit mindestens 192×192 und 512×512 Größe. (6) Die Website wird über HTTPS bereitgestellt. Fehlt eines dieser Kriterien, wird Chrome die Installationsschaltfläche in der Adressleiste nicht anzeigen.
Was ist ein maskierbares Symbol und warum brauche ich eines?▾
Maskierbare Icons (purpose: "maskable") sind so konzipiert, dass sie sicher in jede Form zugeschnitten werden können – Kreis, Squircle, abgerundetes Quadrat usw. – abhängig vom Launcher des Geräts. Ohne ein maskierbares Symbol kann Android einen weißen Kreis hinter Ihrem Symbol hinzufügen, was inkonsistent aussieht. Die "sichere Zone" für maskierbare Icons ist die zentrale 80% des Bildes – halten Sie Ihr Logo in diesem Bereich. Sie benötigen sowohl ein reguläres Symbol (purpose: "any") als auch ein maskierbares Symbol für beste Ergebnisse. Verwenden Sie maskable.app, um maskierbare Icons zu überprüfen und zu erstellen.
Was ist der Unterschied zwischen Display-Modi im Manifest?▾
display steuert die Browser-UI, die angezeigt wird, wenn die App gestartet wird: "standalone" – App-ähnlich, keine Browser-Adressleiste (häufigste Wahl). "fullscreen" – deckt den gesamten Bildschirm ab, keine System-UI (für Spiele). "minimal-ui" – zeigt etwas Browser-Navigation an, verbirgt aber die Adressleiste. "browser" – wird im vollständigen Browser geöffnet (zunichte machen des PWA-Zwecks). Verwenden Sie "standalone" für die meisten Apps. Hinweis: Safari unter iOS verwendet nur standalone-Modus, wenn der Benutzer über das Freigabemenü zum Startbildschirm hinzufügt – das Installationsbanner funktioniert unter iOS anders.
Warum sollte ich Screenshots zu meinem Manifest hinzufügen?▾
Screenshots (das Screenshots-Array) werden von Chromes verbesserter Installationsbenutzeroberfläche verwendet, die einen umfangreichen Installationsdialog mit App-Name, Beschreibung und Vorschaubildern anzeigt. Ohne Screenshots zeigt Chrome eine minimale Installationsaufforderung an. Sie werden auch in der Chrome Web Store und einigen App-Store-Angeboten verwendet. Fügen Sie mindestens 2 Screenshots für das breite (Desktop-) Formfaktor und 2 für das schmale (mobile) Format hinzu. Dimensionen müssen zwischen 320×320 und 3840×2160 Pixel mit gleichbleibendem Seitenverhältnis liegen.
Benötigt meine PWA einen Service Worker, um installierbar zu sein?▾
Ja – ein Service Worker ist für die PWA-Installationsaufforderung in Chrome erforderlich (obwohl dieses Validator nur das Manifest überprüft). Der Service Worker muss auf der Seite registriert sein und betriebsbereit sein. Ein minimaler Service Worker, der nur auf Fetch-Ereignisse reagiert, ist ausreichend. Der Service Worker ermöglicht Offline-Funktionalität und ist Teil der drei PWA-Säulen: Manifest + Service Worker + HTTPS. Tools wie Workbox (workbox-window) machen die Service-Worker-Einrichtung viel einfacher.