Smart app banner

Definition

A smart app banner is a native promotional bar that Safari on iOS renders at the top of a web page when the page declares an `apple-itunes-app` meta tag, offering to open or install the associated app.

It is the least intrusive way to convert a mobile web visitor into an app user on iOS, and it costs one line of HTML. Safari renders it itself, so it never obscures your content, is not affected by ad blockers, and carries none of the search ranking risk attached to full-screen install interstitials. Android has no equivalent tag, which is the main thing to know before designing around it.

The tag

The whole feature is one meta element in the document head. Safari reads it, looks up the app, and renders the banner with the correct title, icon, rating and price for the user's storefront — none of which you supply.

<!-- Minimum viable: just the App Store numeric ID. -->
<meta name="apple-itunes-app" content="app-id=525463029">

<!-- With a deep link target, so the app opens on this content. -->
<meta name="apple-itunes-app"
      content="app-id=525463029, app-argument=https://example.com/articles/42">

<!-- With an affiliate token, if you are enrolled. -->
<meta name="apple-itunes-app"
      content="app-id=525463029,
               affiliate-data=ct=web-banner&pt=123456,
               app-argument=https://example.com/articles/42">

What app-argument does, and what it does not

When the app is already installed, the banner's button reads Open, and tapping it launches the app while passing app-argument to it. Your app receives that URL through the standard URL-handling entry point and routes on it exactly as it would a universal link.

// app-argument arrives through the ordinary URL entry point.
// Route on it exactly as you would any inbound deep link, and treat
// the value as untrusted input — it came from a web page.
func application(_ app: UIApplication,
                 open url: URL,
                 options: [UIApplication.OpenURLOptionsKey: Any] = [:]) -> Bool {
    guard let route = DeepLinkRoute(url: url) else { return false }
    router.navigate(to: route)
    return true
}

When the app is not installed, the button reads View and sends the user to the App Store. app-argument is discarded at that point — it is not carried through the store, and no parameter is. Restoring the destination after a fresh install therefore requires deferred deep linking, exactly as covered in web-to-app conversion.

Android has no equivalent, and the alternatives are narrower than they look

There is no meta tag that produces a native app banner in Chrome on Android. Two mechanisms are sometimes offered as substitutes, and each solves a different problem than the smart app banner does.

The practical arrangement is a smart app banner on iOS and a compact, dismissible HTML banner on Android that points at an App Link. Keep the custom one small and inline; a full-screen interstitial that obscures content carries real search ranking risk on mobile, which is the cost the native banner avoids by design.

When the banner does not appear

1. Not Safari. Chrome, Firefox and most in-app browsers on iOS do not render it, and neither does any Android browser.
2. `app-id` is not numeric. A bundle identifier there produces silence rather than an error.
3. The user dismissed it. Safari remembers the dismissal for that site; test in a fresh private window.
4. The tag is injected late. Safari reads the head on load; a tag added by JavaScript afterwards may be missed.
5. The app is unavailable in that storefront. No app for the user's region means no banner.
6. Desktop Safari. The banner is an iOS feature; macOS does not render it.

Because the banner is rendered by the browser rather than by your page, it cannot be styled, positioned, or measured through your own analytics. Impressions are invisible to you. What you can measure is the arrival — traffic reaching the app with the app-argument payload, or store referrals carrying the affiliate token — so instrument the receiving side rather than trying to instrument the banner itself.