Web app manifest is present

ab-002189 · pre-launch.final-verification.web-manifest

Severity: infoactive

Why it matters

Without a web app manifest, Chrome and Edge suppress the install prompt, iOS Add-to-Home-Screen falls back to a screenshot icon, and Lighthouse flags the site on its PWA audit. Android users who do install the site get a low-resolution thumbnail in the launcher with the document title instead of your short_name, and the splash screen renders as a blank white page instead of branded background_color and theme_color.

Severity rationale

Info because the feature gap affects only installed-app users, not core browser functionality.

Remediation

In Next.js App Router, create app/manifest.ts exporting a MetadataRoute.Manifest object with name, short_name, start_url, display: 'standalone', background_color, theme_color, and at least two icon sizes (192x192 and 512x512). Next wires the <link rel="manifest"> automatically. For other frameworks, drop manifest.json in public/ and link it from the document head.

// app/manifest.ts
import type { MetadataRoute } from 'next'
export default function manifest(): MetadataRoute.Manifest {
  return { name: 'Your App', short_name: 'App', start_url: '/', display: 'standalone', background_color: '#ffffff', theme_color: '#000000', icons: [{ src: '/icon-192.png', sizes: '192x192', type: 'image/png' }, { src: '/icon-512.png', sizes: '512x512', type: 'image/png' }] }
}

Detection

ID: web-manifest
Severity: info
What to look for: Count all web manifest files and references. Enumerate which required fields are present (name, short_name, icons, start_url, display). Check public/ directory for manifest.json or manifest.webmanifest. Check app/ directory for manifest.ts or manifest.js (Next.js App Router convention). Check <head> in layout for <link rel="manifest"> tag. The manifest should include at minimum: name, short_name, icons, and display.
Pass criteria: A web app manifest exists and is linked in the document head, with at minimum name, short_name, and a set of icons defined. At least 4 of 5 required manifest fields (name, short_name, icons, start_url, display) must be present.
Fail criteria: No web app manifest found.
Skip (N/A) when: Skip for API-only projects and internal tools with no public-facing pages. Signal: project type is api or cli, or no HTML pages exist.
Cross-reference: For favicon and icons, see favicon. For apple touch icon, see apple-touch-icon.
Detail on fail: "No web app manifest found — users cannot install the site as a PWA and OS integration features are unavailable"

Remediation: A web app manifest enables Progressive Web App features and improves the install experience:

// public/manifest.json or app/manifest.ts
{ "name": "Your App", "short_name": "App", "icons": [{ "src": "/icon-192.png", "sizes": "192x192" }], "start_url": "/", "display": "standalone" }

// app/manifest.ts (Next.js App Router)
import type { MetadataRoute } from 'next'

export default function manifest(): MetadataRoute.Manifest {
  return {
    name: 'Your App Name',
    short_name: 'AppName',
    description: 'What your app does',
    start_url: '/',
    display: 'standalone',
    background_color: '#ffffff',
    theme_color: '#000000',
    icons: [
      { src: '/icon-192.png', sizes: '192x192', type: 'image/png' },
      { src: '/icon-512.png', sizes: '512x512', type: 'image/png' },
    ],
  }
}

Even if you're not building a full PWA, a manifest improves the mobile "Add to Home Screen" experience and is expected by modern browser quality checks.

Taxons

user-experience

History

2026-04-18·v1.0.0·Initial import from pre-launch·automated

Why it matters

Remediation

// app/manifest.ts
import type { MetadataRoute } from 'next'
export default function manifest(): MetadataRoute.Manifest {
  return { name: 'Your App', short_name: 'App', start_url: '/', display: 'standalone', background_color: '#ffffff', theme_color: '#000000', icons: [{ src: '/icon-192.png', sizes: '192x192', type: 'image/png' }, { src: '/icon-512.png', sizes: '512x512', type: 'image/png' }] }
}

Detection

ID: web-manifest
Severity: info
What to look for: Count all web manifest files and references. Enumerate which required fields are present (name, short_name, icons, start_url, display). Check public/ directory for manifest.json or manifest.webmanifest. Check app/ directory for manifest.ts or manifest.js (Next.js App Router convention). Check <head> in layout for <link rel="manifest"> tag. The manifest should include at minimum: name, short_name, icons, and display.
Pass criteria: A web app manifest exists and is linked in the document head, with at minimum name, short_name, and a set of icons defined. At least 4 of 5 required manifest fields (name, short_name, icons, start_url, display) must be present.
Fail criteria: No web app manifest found.
Skip (N/A) when: Skip for API-only projects and internal tools with no public-facing pages. Signal: project type is api or cli, or no HTML pages exist.
Cross-reference: For favicon and icons, see favicon. For apple touch icon, see apple-touch-icon.
Detail on fail: "No web app manifest found — users cannot install the site as a PWA and OS integration features are unavailable"

Remediation: A web app manifest enables Progressive Web App features and improves the install experience:

// public/manifest.json or app/manifest.ts
{ "name": "Your App", "short_name": "App", "icons": [{ "src": "/icon-192.png", "sizes": "192x192" }], "start_url": "/", "display": "standalone" }

// app/manifest.ts (Next.js App Router)
import type { MetadataRoute } from 'next'

export default function manifest(): MetadataRoute.Manifest {
  return {
    name: 'Your App Name',
    short_name: 'AppName',
    description: 'What your app does',
    start_url: '/',
    display: 'standalone',
    background_color: '#ffffff',
    theme_color: '#000000',
    icons: [
      { src: '/icon-192.png', sizes: '192x192', type: 'image/png' },
      { src: '/icon-512.png', sizes: '512x512', type: 'image/png' },
    ],
  }
}

Even if you're not building a full PWA, a manifest improves the mobile "Add to Home Screen" experience and is expected by modern browser quality checks.