GUIDE
PWAマニフェスト・アイコン事前チェックの使い方
PWAマニフェスト・アイコン事前チェックは、Web App ManifestのJSONと端末内のアイコン画像を公開前に照合し、主要メンバー、start_urlとscopeの関係、宣言サイズと実寸、MIME、192px・512px候補、maskable表示をまとめて確認する無料ツールです。項目ごとの指摘を確認し、画像の実寸とMIMEを反映した修正版JSONをコピーまたは保存できます。入力ファイルと結果はブラウザ内だけで処理します。
このツールでできること
主要項目とURL関係を確認
name、short_name、start_url、scope、display、色、iconsを確認し、マニフェストURLを基準に同一オリジンとscope範囲も判定します。
宣言サイズと実画像を照合
srcと同じファイル名の端末内画像を対応付け、実寸、正方形、MIME、192x192・512x512候補を確認します。画像は外部へ送信しません。
maskable表示と修正版JSON
maskableアイコンを円形に切り抜き、安全領域の目安を重ねて確認できます。実寸とMIMEを反映した修正版JSONはコピーまたは保存できます。
かんたん3ステップ
- 1マニフェストJSONを貼り付けるかファイルで読み込み、公開予定のマニフェストURLを入力します。
- 2iconsのsrcと同じファイル名のアイコン画像を端末から選び、「マニフェストとアイコンを確認」を押します。
- 3要修正・要確認・未確認の一覧とmaskable表示を確認し、必要に応じて修正版JSONを保存して実機でも確認します。
こんな方におすすめ
PWAを公開・更新する個人開発者、Web制作会社、公開前チェックを担当する方に向いています。ブラウザの開発者ツールや複数の仕様ページを往復する前に、手元のファイルで基本的な不整合を整理したい場面で使えます。
利用上の注意
- 初期版は1MB以下のJSONを対象に、選択した画像と静的に照合します。Web上のURLへアクセスせず、入力したJSONや画像を外部へ送信しません。
- PWAのインストール可否、Service Worker、HTTPS配信、ブラウザ固有要件、実機の切り抜きを保証するものではありません。公開前に対象ブラウザと実機で最終確認してください。
よくある質問
マニフェストURLは実在する必要がありますか？
いいえ。相対URLを解決する基準として使うため、まだ公開していない予定URLを絶対URLで入力できます。このツールからURLへアクセスしたり、Web上のマニフェストやアイコンを取得したりすることはありません。公開後は実際の配信URLとContent-Typeを別途確認してください。
アイコン画像を選ばなくても使えますか？
はい。画像を選ばなくてもJSONの主要項目、URL関係、宣言された192px・512px候補は確認できます。その場合は実画像が未確認であることを結果に表示します。宣言サイズと実寸、MIME、正方形かどうか、maskableプレビューまで確認するには、iconsのsrcと同じファイル名の画像を端末から選んでください。
指摘がゼロならPWAとして公開できますか？
公開可否やインストール成功を保証するものではありません。Service Worker、HTTPS、配信時のContent-Type、対象ブラウザの要件、実機での表示と起動を別途確認してください。
次に使える関連ツール
同じ目的の作業を続けて進められる無料ツールです。