Created
June 10, 2011 07:18
-
-
Save sindre/1018379 to your computer and use it in GitHub Desktop.
Mobile meta & links
This file contains hidden or 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
| <!-- Mobile meta & links --> | |
| <!-- Reference | |
| Custom Icon and Image Creation Guidelines: | |
| http://developer.apple.com/library/safari/#documentation/UserExperience/Conceptual/MobileHIG/IconsImages/IconsImages.html | |
| Configuring Web Applications: | |
| http://developer.apple.com/library/safari/#documentation/appleapplications/reference/safariwebcontent/configuringwebapplications/configuringwebapplications.html | |
| Configuring the Viewport: | |
| http://developer.apple.com/library/safari/#documentation/appleapplications/reference/safariwebcontent/UsingtheViewport/UsingtheViewport.html | |
| Optimizing Web Content: | |
| http://developer.apple.com/library/safari/#documentation/appleapplications/reference/safariwebcontent/OptimizingforSafarioniPhone/OptimizingforSafarioniPhone.html | |
| --> | |
| <!-- VIEWPORT --> | |
| <!-- optimized for mobile --> | |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | |
| <!-- optimized for mobile, zoom/scaling disabled --> | |
| <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" /> | |
| <!-- BROWSER CHROME --> | |
| <!-- status bar styles: default, black, or black-translucent --> | |
| <meta name="apple-mobile-web-app-status-bar-style" content="black" /> | |
| <!-- hides browser chrome --> | |
| <meta name="apple-mobile-web-app-capable" content="yes" /> | |
| <!-- HOME SCREEN ICONS --> | |
| <!-- home screen icon --> | |
| <link rel="apple-touch-icon" href="/customIcon.png" /> | |
| <!-- home screen icon - ipad --> | |
| <link rel="apple-touch-icon" href="/customIcon.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px)" /> | |
| <!-- or --> | |
| <link rel="apple-touch-icon" sizes="72x72" href="/customIcon.png" /> | |
| <!-- home screen icon - high res --> | |
| <link rel="apple-touch-icon" href="/customIcon.png" media="screen and (-webkit-min-device-pixel-ratio: 2)" /> | |
| <!-- or --> | |
| <link rel="apple-touch-icon" sizes="114x114" href="/customIcon.png" /> | |
| <!-- home screen icon, omits iOS embellishments, works in Android --> | |
| <link rel="apple-touch-icon-precomposed" href="/customIcon.png" /> | |
| <!-- home screen icon, omits iOS embellishments - ipad --> | |
| <link rel="apple-touch-icon-precomposed" href="/customIcon.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px)" /> | |
| <!-- or --> | |
| <link rel="apple-touch-icon-precomposed" sizes="72x72" href="/customIcon.png" /> | |
| <!-- home screen icon, omits iOS embellishments - high res --> | |
| <link rel="apple-touch-icon-precomposed" href="/customIcon.png" media="screen and (-webkit-min-device-pixel-ratio: 2)" /> | |
| <!-- or --> | |
| <link rel="apple-touch-icon-precomposed" sizes="114x114" href="/customIcon.png" /> | |
| <!-- STARTUP IMAGES --> | |
| <!-- startup image for web apps (320x480) --> | |
| <link rel="apple-touch-startup-image" href="/customIcon.png" /> | |
| <!-- startup image for web apps - high res (640x940) --> | |
| <link rel="apple-touch-startup-image" href="/customIcon.png" media="screen and (-webkit-min-device-pixel-ratio: 2)" /> | |
| <!-- or --> | |
| <link rel="apple-touch-startup-image" sizes="640x940" href="/customIcon.png" /> | |
| <!-- startup image for web apps - iPad - landscape (1024x748) --> | |
| <link rel="apple-touch-startup-image" href="/customIcon.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)" /> | |
| <!-- or --> | |
| <link rel="apple-touch-startup-image" sizes="748x1024" href="/customIcon.png" /> | |
| <!-- startup image for web apps - iPad - portrait (768x1004) --> | |
| <link rel="apple-touch-startup-image" href="/customIcon.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)" /> | |
| <!-- or --> | |
| <link rel="apple-touch-startup-image" sizes="768x1004" href="/customIcon.png" /> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment