Web App Manifest (manifest.json) Validator

Fügen Sie Ihre manifest.json ein, um zu prüfen, ob sie die Installationsvoraussetzungen für PWAs erfüllt. Prüft Pflichtfelder wie name, start_url, display und icons und weist in einer übersichtlichen Liste auf fehlende maskable-Icons hin.

Zuletzt aktualisiert: 2026-09-20

Prüfen, ob eine manifest.json die Bedingungen einer PWA erfüllt

Ein Web App Manifest ist die JSON-Datei, die Symbol, Name und Erscheinungsbild beim Start bestimmt, sobald eine Website dem Startbildschirm hinzugefügt wird. Fügen Sie ihren Inhalt ein, und dieses Werkzeug prüft die verlangten Einträge wie `name`, `start_url`, `display` und `icons` samt dem Vorhandensein eines maskable-Symbols und führt auf, was fehlt.

**Sorgfalt verdient hier, dass ein vollständiges Manifest allein eine Website noch nicht installierbar macht.** Zu den Bedingungen, unter denen ein Browser die Installation anbietet, gehören **die Auslieferung über HTTPS und ein registrierter Service Worker**, und keine von beiden lässt sich aus dem Inhalt des Manifests beurteilen. Was dieses Werkzeug betrachtet, ist allein jener Teil dieser Bedingungen, für den das Manifest einsteht. **Der andere Punkt ist das maskable-Symbol: Ohne ein solches schrumpft Android das Symbol in einen weißen Kreis hinein.** Ein eigenes Bild mit `purpose` auf `maskable` erlaubt dem System, es bis an den Rand jener Form zu zeichnen, die das Gerät verwendet.

So gehen Sie vor

Fügen Sie den Inhalt von manifest.json ein Geben Sie das ganze JSON unverändert ein.
Probieren Sie zuerst die Beispiele Ein vollständiges und ein minimales Beispiel liegen bereit.
Lesen Sie, was fehlt **Fehlende Pflichteinträge wie auch das Vorhandensein oder Fehlen eines maskable-Symbols werden gemeldet.**
Prüfen Sie HTTPS und den Service Worker gesondert **Diese beiden liegen außerhalb des Manifests.** Urteilen Sie nicht allein nach dem Ergebnis dieses Werkzeugs.

Tipps für die Nutzung

Am besten legen Sie sowohl name als auch short_name fest. Ohne short_name wird die Beschriftung unter dem Icon auf dem Startbildschirm mechanisch aus name gekürzt, was ungünstig aussehen kann.
Ohne ein Icon mit purpose: "maskable" schneiden manche Android-Geräte das Icon unschön zu oder lassen die Hintergrundfarbe durchscheinen. Ein zusätzlicher maskable-Eintrag im vorhandenen icons-Array behebt das in der Regel.
Fügen Sie in icons mindestens ein Icon mit 192x192 oder größer hinzu, idealerweise auch eines mit 512x512 oder größer. Ersteres wird für das Icon auf dem Startbildschirm verwendet, Letzteres für den Splash-Screen.
Die von Browsern wie Chrome tatsächlich angewendeten Installationskriterien für PWAs können sich mit der Zeit ändern. Betrachten Sie die Ergebnisse dieses Tools daher als Orientierungshilfe und nicht als Garantie — eine zusätzliche Prüfung im Application-Panel der Chrome DevTools ist empfehlenswert.
Eine relative start_url (z. B. "/?source=pwa") funktioniert einwandfrei. Ein zusätzlicher Query-Parameter erleichtert es, in der Zugriffsanalyse PWA-Starts von normalen Browserbesuchen zu unterscheiden.

Wofür Sie es nutzen können

Beim Beginn der Arbeit an einer PWA

In dem Stadium, in dem unklar ist, was zu schreiben ist, können Sie ermitteln, welche Einträge nötig sind.

Beim Eingrenzen, warum sich eine Website nicht installieren lässt

**Sie können zuallererst feststellen, ob der Fehler beim Manifest liegt.**

Beim Verbessern des Symbolbildes

Ein maskable-Symbol zu ergänzen verändert, wie die Website auf einem Android-Startbildschirm erscheint.

Beim Prüfen einer bestehenden Einrichtung

Sie können bestätigen, ob ein vor längerer Zeit geschriebenes Manifest die heutigen Bedingungen noch erfüllt.

Begriffe zum Web App Manifest

Name und short_name: Der Name der Anwendung. **`short_name` erscheint unter dem Symbol auf dem Startbildschirm, halten Sie ihn also kurz genug.**
Start_url: Die Adresse, die beim Start vom Startbildschirm geöffnet wird. Sie muss nicht die Startseite sein.
Display: Das Erscheinungsbild beim Start. Mit `standalone` verschwindet die Adressleiste des Browsers und es wirkt wie eine Anwendung.
Icons: Die Liste der Symbole. **Sowohl 192 mal 192 als auch 512 mal 512 bereitzustellen ist die Grundforderung.**
Maskable: **Ein Bild, das in der Annahme erstellt wurde, es werde auf die vom Gerät verwendete Symbolform zugeschnitten.** Es wird über `purpose` angegeben.
Theme_color: Die Farbe, die beim Start für die Statusleiste und Ähnliches verwendet wird. Auf die Farbwelt der Website abgestimmt, wirkt das Ganze wie aus einem Guss.

Häufig gestellte Fragen

Die Installationskriterien der meisten Browser für PWAs verlangen name oder short_name, eine start_url, einen display-Wert (fullscreen, standalone, minimal-ui oder browser) sowie ein icons-Array mit mindestens einem Icon von 192x192 oder größer. Fehlt auch nur eines dieser Elemente, wird die Installationsaufforderung möglicherweise nicht angezeigt.

Das ist ein Icon-Eintrag mit purpose: "maskable". Android-Geräte schneiden Icons auf dem Startbildschirm in Formen wie Kreise oder abgerundete Quadrate zu, wodurch bei einem so zugeschnittenen normalen Icon die Ränder abgeschnitten werden können. Ein maskable Icon wird mit zusätzlichem Rand (einer Sicherheitszone) in der Mitte gestaltet, damit es unabhängig von der Zuschnittform korrekt aussieht.

Geben Sie Breite und Höhe getrennt durch ein x an, etwa "192x192". Funktioniert eine einzelne Icon-Datei bei jeder Größe, wie z. B. ein SVG, können Sie stattdessen "any" angeben. Mehrere Größen für einen Eintrag lassen sich auch durch Leerzeichen getrennt auflisten, etwa "192x192 512x512".

Die W3C-Spezifikation definiert vier Werte: fullscreen (nutzt den gesamten Bildschirm), standalone (blendet die Browser-UI für ein app-ähnliches Erscheinungsbild aus), minimal-ui (zeigt eine minimale Browser-UI) und browser (öffnet als normaler Browser-Tab). standalone ist die gängigste Wahl für ein PWA-typisches Erscheinungsbild.

Dieses Tool führt lediglich eine statische Prüfung durch, ob die manifest.json der Spezifikation entspricht. Die tatsächliche Installierbarkeit hängt auch von weiteren Faktoren ab, etwa ob die Website über HTTPS ausgeliefert wird und ein Service Worker korrekt registriert ist. Bestätigen Sie das endgültige Verhalten daher zusätzlich mit den Entwicklertools des Browsers oder auf einem echten Gerät.

Übrigens – Der Zusammenhang zwischen Web App Manifest und PWAs

Das Web App Manifest ist eine JSON-basierte Spezifikation des W3C, die die Informationen deklariert, die nötig sind, um eine Website zum Startbildschirm hinzuzufügen und wie eine native App zu installieren: den App-Namen, Icons, den Anzeigemodus beim Start, die Themenfarbe und mehr. Der Begriff PWA (Progressive Web App) selbst wurde 2015 von Google-Ingenieuren geprägt, und manifest.json ist zusammen mit dem Service Worker, der das Offline-Verhalten übernimmt, einer der beiden zentralen technischen Bausteine dahinter.

Ist die manifest.json nicht korrekt konfiguriert, erkennt der Browser die Website nicht als installierbar und zeigt keine Installationsaufforderung an (etwa das "Installieren"-Banner von Chrome). Probleme wie eine unzureichende Icon-Auflösung oder ein falsch geschriebener display-Wert fallen leicht durch, weil das JSON selbst weiterhin syntaktisch gültig ist — oft bemerkt man sie erst, wenn jemand tatsächlich versucht, die App zu installieren.

Maskable Icons (purpose: "maskable") sind eine relativ neue Ergänzung, die um 2019 eingeführt wurde, um Androids "adaptive Icons" zu unterstützen. Normale Icons werden je nach Gerät zu einem Kreis, einem abgerundeten Quadrat oder einer anderen Form zugeschnitten, sodass bei einem Icon ohne eigenen Rand am Ende ein Teil des Logos abgeschnitten werden kann. Ein maskable Icon muss mit Rücksicht auf eine Sicherheitszone gestaltet werden und wird meist als separater Eintrag neben den regulären Icons bereitgestellt.

Dieses Tool konzentriert sich ausschließlich auf die statische Validierung der manifest.json — es prüft keine weiteren Faktoren, die die tatsächliche Installierbarkeit beeinflussen, etwa ob ein Service Worker registriert ist oder ob die Website über HTTPS ausgeliefert wird. Für die endgültige Bestätigung in der Produktivumgebung empfiehlt sich zusätzlich der Einsatz der Entwicklertools des Browsers (z. B. des Application-Panels der Chrome DevTools).

Alle Wissenstexte ansehen