Created
February 8, 2015 12:28
-
-
Save eyecatchup/6dd1236ae6415b1180e9 to your computer and use it in GitHub Desktop.
Insanity of Apple-specific meta tags..
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Apple Meta Insanity</title> | |
| <!-- | |
| APPLE WEB APP META TAGS | |
| --> | |
| <!-- Sets whether a web application runs in full-screen mode. | |
| See: https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html#//apple_ref/doc/uid/TP40008193-SW3 --> | |
| <meta name="apple-mobile-web-app-capable" content="yes"> | |
| <!-- Sets the style of the status bar for a web application. | |
| See: https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html#//apple_ref/doc/uid/TP40008193-SW4 --> | |
| <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> | |
| <!-- Sets the display title of a web app (undocumented by Apple). | |
| See: http://www.mobilexweb.com/blog/iphone-5-ios-6-html5-developers --> | |
| <meta name="apple-mobile-web-app-title" content="page title"> | |
| <!-- Possible values are: "portrait", "portrait-upside-down", "landscape-right", "landscape-left", "portrait-any" | |
| See: https://github.com/WebKit/webkit/blob/master/Source/WebCore/html/HTMLMetaElement.cpp#L79 | |
| See: http://www.opensource.apple.com/source/WebCore/WebCore-855.7.1/html/HTMLMetaElement.cpp | |
| See: https://trac.webkit.org/changeset/160679/trunk/Source/WebCore/dom/Document.cpp | |
| See: https://trac.webkit.org/browser/trunk/Source/WebCore/ChangeLog?rev=160679 --> | |
| <meta name="apple-mobile-web-app-orientations" content="portrait-any"> | |
| <!-- | |
| WEB APP ICON AND SHORTCUT ICON META TAGS | |
| --> | |
| <!-- Web clip icon for Android homescreen shortcuts. Available since Chrome 31+ for Android. | |
| See: https://developers.google.com/chrome/mobile/docs/installtohomescreen --> | |
| <link rel="shortcut icon" sizes="196x196" href="/assets/images/icons/touch/chromeapp-touch-icon-196x196-precomposed.png"> | |
| <!-- For a full list of Apple icon sizes, see: | |
| https://developer.apple.com/library/safari/documentation/UserExperience/Conceptual/MobileHIG/IconMatrix.html#//apple_ref/doc/uid/TP40006556-CH27-SW1 | |
| https://developer.apple.com/library/safari/documentation/UserExperience/Conceptual/MobileHIG/WebClipIcons.html#//apple_ref/doc/uid/TP40006556-CH29-SW1 --> | |
| <!-- Web clip icon for iPad 3+ with high-resolution Retina displays running iOS >= 7 --> | |
| <link rel="apple-touch-icon-precomposed" sizes="152x152" href="/assets/images/icons/touch/apple-ipad-retina-ios7-touch-icon-152x152-precomposed.png"> | |
| <!-- Web clip icon for iPad 3+ with high-resolution Retina displays running iOS <= 6 --> | |
| <link rel="apple-touch-icon-precomposed" sizes="144x144" href="/assets/images/icons/touch/apple-ipad-retina-ios6-touch-icon-144x144-precomposed.png"> | |
| <!-- Web clip icon for iPhone 4+ and iPod touch with high-resolution Retina displays running iOS >= 7 --> | |
| <link rel="apple-touch-icon" sizes="120x120" href="/assets/images/icons/touch/apple-iphone4+-ipod-touch-retina-ios7-touch-icon-120x120-precomposed.png"> | |
| <!-- Web clip icon for iPhone 4+ and iPod touch with high-resolution Retina displays running iOS <= 6 --> | |
| <link rel="apple-touch-icon-precomposed" sizes="114x114" href="/assets/images/icons/touch/apple-iphone4+-ipod-touch-retina-ios6-touch-icon-114x114-precomposed.png"> | |
| <!-- Web clip icon for iPad mini and the first- and second-generation iPad with standard-resolution displays running iOS >= 7 --> | |
| <link rel="apple-touch-icon-precomposed" sizes="76x76" href="/assets/images/icons/touch/apple-ipad1-ipad2-ipad-mini-non-retina-ios7-touch-icon-76x76-precomposed.png"> | |
| <!-- Web clip icon for iPad mini and the first- and second-generation iPad with standard-resolution displays running iOS <= 6 --> | |
| <link rel="apple-touch-icon-precomposed" sizes="72x72" href="/assets/images/icons/touch/apple-ipad1-ipad2-ipad-mini-non-retina-ios6-touch-icon-77x72-precomposed.png"> | |
| <!-- Web clip icon for non-iOS devices that support Apple's touch icons (and if not Chrome 31+ for Android) --> | |
| <link rel="apple-touch-icon-precomposed" sizes="60x60" href="/assets/images/icons/touch/universal-touch-icon-60x60-precomposed.png"> | |
| <!-- Web clip icon for iPhone 1-3 and iPod touch with standard-resolution non-Retina displays running iOS <= 6 --> | |
| <link rel="apple-touch-icon-precomposed" sizes="57x57" href="/assets/images/icons/touch/fallback-touch-icon-57x57-precomposed.png"> | |
| <!-- Web clip icon for iPad 1 with standard-resolution non-Retina displays --> | |
| <link rel="apple-touch-icon-precomposed" href="/assets/images/icons/touch/fallback-touch-icon-57x57-precomposed.png"> | |
| <!-- Fallback web clip icon for all devices --> | |
| <link rel="shortcut icon" href="/assets/images/icons/touch/fallback-touch-icon-57x57-precomposed.png"> | |
| <!-- Favicon --> | |
| <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico"> | |
| <link rel="icon" type="image/ico" href="/assets/images/icons/icon-32x32.png"> | |
| <!-- | |
| APPLE WEB-APP STARTUP IMAGE META TAG | |
| --> | |
| <!-- iOS web application startup image | |
| See: https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW6 --> | |
| <!-- iOS 6 & 7 iPad (retina, portrait) --> | |
| <link rel="apple-touch-startup-image" href="/assets/images/icons/apple-appstart/apple-touch-startup-image-1536x2008.png" | |
| media="(device-width: 768px) and (device-height: 1024px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)"> | |
| <!-- iOS 6 & 7 iPad (retina, landscape) --> | |
| <link rel="apple-touch-startup-image" href="/assets/images/icons/apple-appstart/apple-touch-startup-image-1496x2048.png" | |
| media="(device-width: 768px) and (device-height: 1024px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2)"> | |
| <!-- iOS 6 iPad (portrait) --> | |
| <link rel="apple-touch-startup-image" href="/assets/images/icons/apple-appstart/apple-touch-startup-image-768x1004.png" | |
| media="(device-width: 768px) and (device-height: 1024px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 1)"> | |
| <!-- iOS 6 iPad (landscape) --> | |
| <link rel="apple-touch-startup-image" href="/assets/images/icons/apple-appstart/apple-touch-startup-image-748x1024.png" | |
| media="(device-width: 768px) and (device-height: 1024px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 1)"> | |
| <!-- iOS 6 & 7 iPhone 5 --> | |
| <link rel="apple-touch-startup-image" href="/assets/images/icons/apple-appstart/apple-touch-startup-image-640x1096.png" | |
| media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)"> | |
| <!-- iOS 6 & 7 iPhone (retina) --> | |
| <link rel="apple-touch-startup-image" href="/assets/images/icons/apple-appstart/apple-touch-startup-image-640x920.png" | |
| media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2)"> | |
| <!-- iOS 6 iPhone --> | |
| <link rel="apple-touch-startup-image" href="/assets/images/icons/apple-appstart/apple-touch-startup-image-320x460.png" | |
| media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 1)"> | |
| <link rel="apple-touch-startup-image" href="/assets/images/icons/apple-appstart/apple-touch-startup-image-fallback.png"> | |
| <!-- | |
| APPLE "SMART APP BANNER" META TAG | |
| --> | |
| <!-- Add an Apple "Smart App Banner" when displaying a page on iOS devices. | |
| See: https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/PromotingAppswithAppBanners/PromotingAppswithAppBanners.html#//apple_ref/doc/uid/TP40002051-CH6-SW2 --> | |
| <meta name="apple-itunes-app" content="app-id=myAppStoreID"> | |
| <!--<meta name="apple-itunes-app" content="app-id=myAppStoreID, app-argument=myURL">--> | |
| <!--<meta name="apple-itunes-app" content="app-id=myAppStoreID, app-argument=myURL, affiliate-data=myAffiliateData">--> | |
| <!-- | |
| APPLE FEATURE DETECTION META TAGS | |
| --> | |
| <!-- Disables automatic detection of possible phone numbers in a webpage in Safari on iOS. | |
| See: https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html#//apple_ref/doc/uid/TP40008193-SW5 | |
| See: https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html#//apple_ref/html/const/format-detection --> | |
| <meta name="format-detection" content="telephone=no"> | |
| <meta name="format-detection" content="address=no"> | |
| </head> | |
| <body> | |
| <h1>Apple Meta Insanity</h1> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment