Web-App-Manifest-Validator

Eine Progressive Web App installiert sich nur dann sauber, wenn ihre manifest.json die Felder erfüllt, die Browser und App Stores tatsächlich prüfen. Dieser Validator liest Ihr hochgeladenes Manifest ein und geht die W3C-Web-App-Manifest-Spezifikation Feld für Feld durch: Er meldet ein fehlendes name und short_name, ein leeres oder fehlerhaftes icons-Array, Icons ohne src, sizes oder type, eine nicht interpretierbare start_url, einen nicht erkannten display-Wert sowie theme_color- oder background_color-Zeichenketten, die keine gültigen CSS-Farben sind. Jede Feststellung erscheint als klarer Satz – kein rohes Spezifikationszitat –, sodass Sie genau wissen, was zu korrigieren ist und warum es für die Installierbarkeit zählt.

Das herausragende Merkmal ist die Vorschau der Safe-Zone für maskierbare Icons. Androids adaptive Icons wenden eine vom Betriebssystem gewählte Maskenform – Kreis, Squircle, Tropfen und mehr – auf jedes Icon an, das mit "purpose": "maskable" gekennzeichnet ist. Alles, was außerhalb eines zentrierten Kreises liegt, der 40 % des Icon-Viewports abdeckt, kann je nach der vom Gerät angewendeten Maske abgeschnitten werden. Laden Sie die von Ihrem Manifest referenzierten Icon-Bilddateien zusammen mit der manifest.json hoch, und dieses Tool ordnet sie anhand des Dateinamens zu, zeichnet jedes maskierbare Icon in seiner deklarierten Größe auf ein Canvas und legt genau diesen Sicherheitskreis darüber, damit Sie mit eigenen Augen sehen, ob Ihr Artwork die Beschneidung übersteht.

Das Bestanden/Nicht-bestanden-Kennzeichen unter jeder Vorschau ist kein kosmetischer Checklistenpunkt – es basiert auf einer echten pixelweisen Analyse der dekodierten Bilddaten. Das Tool misst, wie viel nicht-hintergründiger Inhalt außerhalb des Sicherheitskreises liegt (Inhalt, den eine Maske beschneiden würde) und wie stark das Icon transparent ist (maskierbare Icons sollten einen vollflächigen, deckenden Hintergrund haben, da Transparenz die Farbe der zugrunde liegenden Maske durchscheinen lässt). Beide Prüfungen laufen gegen die tatsächlich von Ihnen hochgeladene Bitmap – das Ergebnis spiegelt also Ihre echte Icon-Datei wider, keine Vermutung.

Alles läuft lokal in Ihrem Browser: manifest.json wird mit der File-API gelesen, Icons werden mit createImageBitmap oder einem FileReader/Image-Fallback dekodiert und die Pixel werden auf einem In-Memory-Canvas analysiert. Nichts wird auf einen Server hochgeladen – das ist wichtig, wenn Ihr Manifest einen noch nicht öffentlichen App-Namen, interne start_url-Pfade oder in Entwicklung befindliche Icons referenziert.