Last active
July 29, 2016 09:55
-
-
Save alessandroraffa/a56045da8aaa9900f79a5cbcbc162ba9 to your computer and use it in GitHub Desktop.
HTML5 <head> tags for web application
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
| <!doctype html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
| <title>web app name</title> | |
| <meta content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width" name="viewport"> | |
| <link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-precomposed.png"><!-- Add to homescreen for Safari on iOS --> | |
| <link rel="apple-touch-icon-precomposed" sizes="114x114" href="/apple-touch-icon-precomposed-114x114.png"><!-- iPhone retina icon (iOS< 7) --> | |
| <link rel="apple-touch-icon-precomposed" sizes="120x120" href="/apple-touch-icon-precomposed-120x120.png"><!-- iPhone 6 Plus icon --> | |
| <link rel="apple-touch-icon-precomposed" sizes="144x144" href="/apple-touch-icon-precomposed-144x144.png"><!-- iPad retina icon (iOS< 7) --> | |
| <link rel="apple-touch-icon-precomposed" sizes="152x152" href="/apple-touch-icon-precomposed-152x152.png"><!-- iPad retina icon --> | |
| <link rel="apple-touch-icon-precomposed" sizes="180x180" href="/apple-touch-icon-precomposed-180x180.png"> | |
| <link rel="apple-touch-icon-precomposed" sizes="57x57" href="/apple-touch-icon-precomposed-57x57.png"><!-- iPhone non-retina icon (iOS< 7) --> | |
| <link rel="apple-touch-icon-precomposed" sizes="72x72" href="/apple-touch-icon-precomposed-72x72.png"><!-- iPad non-retina icon (iOS< 7) --> | |
| <link rel="apple-touch-icon-precomposed" sizes="76x76" href="/apple-touch-icon-precomposed-76x76.png"><!-- iPad non-retina icon --> | |
| <link rel="apple-touch-icon" href="/apple-touch-icon.png"><!-- Add to homescreen for Safari on iOS --> | |
| <link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png"> | |
| <link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png"> | |
| <link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png"> | |
| <link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png"> | |
| <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180x180.png"> | |
| <link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png"> | |
| <link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png"> | |
| <link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png"> | |
| <link rel="apple-touch-startup-image" href="/startup.png"> | |
| <link rel="apple-touch-startup-image" href="/startup-1182x2208.png" media="(device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)"><!-- iPhone 6 Plus landscape startup image --> | |
| <link rel="apple-touch-startup-image" href="/startup-1242x2148.png" media="(device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"><!-- iPhone 6 Plus portrait startup image --> | |
| <link rel="apple-touch-startup-image" href="/startup-1496x2048.png" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)"><!-- iPad retina landscape startup image --> | |
| <link rel="apple-touch-startup-image" href="/startup-1536x2008.png" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"><!-- iPad retina portrait startup image --> | |
| <link rel="apple-touch-startup-image" href="/startup-320x460.png" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 1)"><!-- iPhone< 5 non-retina startup image --> | |
| <link rel="apple-touch-startup-image" href="/startup-640x1096.png" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)"><!-- iPhone 5 startup image --> | |
| <link rel="apple-touch-startup-image" href="/startup-640x920.png" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2)"><!-- iPhone< 5 retina startup image --> | |
| <link rel="apple-touch-startup-image" href="/startup-748x1024.png" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 1) and (orientation: landscape)"><!-- iPad non-retina landscape startup image --> | |
| <link rel="apple-touch-startup-image" href="/startup-750x1294.png" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2)"><!-- iPhone 6 startup image --> | |
| <link rel="apple-touch-startup-image" href="/startup-768x1004.png" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 1) and (orientation: portrait)"><!-- iPad non-retina portrait startup image --> | |
| <link rel="icon" sizes="192x192" href="/chrome-touch-icon-192x192.png"><!-- Add to homescreen for Chrome on Android --> | |
| <link rel="manifest" href="/manifest.json"><!-- Web Application Manifest --> | |
| <link rel="shortcut icon" href="/favicon.png"> | |
| <meta http-equiv="cleartype" content="on"> | |
| <meta name="apple-mobile-web-app-capable" content="yes"><!-- Allow web app to be run in full-screen mode and add to homescreen for Safari on iOS --> | |
| <meta name="apple-mobile-web-app-status-bar-style" content="#3f51b5"><!-- Configure the status bar (usually "black") --> | |
| <meta name="apple-mobile-web-app-title" content="web app name"><!-- Make the app title different than the page title. --> | |
| <meta name="application-name" content="web app name"><!-- Add to homescreen for Chrome on Android --> | |
| <meta name="format-detection" content="telephone=no"><!-- Disable automatic phone number detection. --> | |
| <meta name="HandheldFriendly" content="True"> | |
| <meta name="mobile-web-app-capable" content="yes"><!-- Add to homescreen for Chrome on Android --> | |
| <meta name="MobileOptimized" content="320"> | |
| <meta name="msapplication-tap-highlight" content="no"><!-- Disable tap highlight on IE --> | |
| <meta name="msapplication-TileColor" content="#3f51b5"><!-- Tile icon for Win8 (144x144 + tile color) --> | |
| <meta name="msapplication-TileImage" content="/ms-touch-icon-144x144-precomposed.png"><!-- Tile icon for Win8 (144x144 + tile color) or "/apple-touch-icon-144x144.png" --> | |
| <meta name="theme-color" content="#3f51b5"><!-- Color the status bar on mobile devices --> | |
| </head> | |
| <body></body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment