<zhead>

Meta Tags

mobile-web-app-capable

Learn how to use the mobile-web-app-capable meta tag to improve your site.

Indicates to mobile browsers that the website can be run as a standalone application when added to the user’s home screen, offering a more app-like user experience.

Parameters

yes
Enables the website to be run as a standalone web application.
<meta name="mobile-web-app-capable" content="yes" />
no
Prevents the website from being run as a standalone web application.
<meta name="mobile-web-app-capable" content="no" />
export type MobileWebAppCapable =
     /**
   * Enables the website to be run as a standalone web application.
  **/
    'yes'
    /**
   * Prevents the website from being run as a standalone web application.
  **/
    'no'

Code Examples

<meta name="mobile-web-app-capable" content="yes" />
Tells the mobile browser to make the website available in a standalone mode.
<meta name="mobile-web-app-capable" content="no" />
Disables the standalone mode, missing the opportunity to offer an app-like experience.

Recommendations

  • 01
    Combine with Apple-Specific Tags
    For comprehensive support across platforms, combine "mobile-web-app-capable" with "apple-mobile-web-app-capable" and "apple-mobile-web-app-status-bar-style" meta tags to enhance the user experience on iOS devices.
  • 02
    Design Responsive and App-Like UI
    Ensure the website has a responsive design and an app-like user interface to provide a seamless experience when used as a standalone app. This includes correctly setting viewport and handling touch events.

Related Documentation

Related Meta Tags

apple-mobile-web-app-status-bar-style

name

Specifies the style of the status bar for a web application when added to the homescreen of an iOS device. This meta tag influences the appearance of the status bar to either match the web app design or maintain the default iOS style.

<html lang="en">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="apple-mobile-web-app-status-bar-style" content="default">
</html>
Sets the status bar to the default iOS style, providing a consistent look with other applications on the device.

apple-mobile-web-app-capable

name

Specifies whether a web application runs in full-screen mode when added to the homescreen of an Apple device.

<html lang="en">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="apple-mobile-web-app-capable" content="yes">
</html>
Enables full-screen mode when the web app is added to the homescreen, providing a more app-like experience.

apple-mobile-web-app-title

name

Provides a custom title for a web application when added to the home screen on Apple iOS devices. This title appears below the app icon, offering more control over branding and user interface.

<html lang="en">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="apple-mobile-web-app-title" content="MyApp">
</html>
Specifying a concise and descriptive name such as "MyApp" ensures the title is readable at a glance and is easily recognizable by users.

mobile-web-app-capable

name

Indicates to mobile browsers that the website can be run as a standalone application when added to the user’s home screen, offering a more app-like user experience.

<html lang="en">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="mobile-web-app-capable" content="yes">
</html>
Tells the mobile browser to make the website available in a standalone mode.

apple-itunes-app

name

Promotes an iOS app on Apple’s App Store directly within the Safari browser. When added to a web page, it triggers a banner suggesting users to install the app.

<html lang="en">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="apple-itunes-app" content="app-id=123456789">
</html>
Correctly specifies the App Store ID for the app, directing users to the exact app in the store.