Skip to content

Instantly share code, notes, and snippets.

@MrUzu
Created June 24, 2011 14:29
Show Gist options
  • Star 4 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save MrUzu/1044867 to your computer and use it in GitHub Desktop.
Save MrUzu/1044867 to your computer and use it in GitHub Desktop.
WebApp meta for Icons and Startup screens
<!-- HTML5 DOCTYPE, IMPORTANT -->
<!DOCTYPE html>
<html dir="ltr" lang="en-EN">
<head>
<meta charset="UTF-8" />
<title>Title</title>
<!-- VIEWPORT, AVOID BROWSER NAV BAR, AND HANDHELD DECLARATIONS -->
<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="HandheldFriendly" content="true" />
<!-- STARTUP SCREENS -->
<!-- startup image for web apps (320x480)-->
<link rel="apple-touch-startup-image" href="/images/startup_320x480.png" />
<!-- startup image for web apps - high res (640x940) -->
<link rel="apple-touch-startup-image" href="/images/startup_640x940.png" media="screen and (-webkit-min-device-pixel-ratio: 2)" />
<!-- startup image for web apps - iPad - landscape (748x1024) -->
<link rel="apple-touch-startup-image" sizes="748x1024" href="/images/startup_748x1024.png" />
<!-- startup image for web apps - iPad - portrait (768x1004) -->
<link rel="apple-touch-startup-image" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)" href="/images/startup_768x1004.png" />
<!-- startup image for web apps - iPhone, iPod - only portrait (320x460) -->
<link rel="apple-touch-startup-image" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)" href="/images/startup_320x460.png" />
<!-- WEBAPP HOME SCREEN ICONS -->
<!-- home screen icon precomposed - 128x128 -->
<link rel="apple-touch-icon-precomposed" href="/images/logo_webapp_128.png"/>
<!-- home screen icon defaults - 48x48 -->
<link rel="apple-touch-icon" href="/images/logo_webapp.png"/>
<link rel="icon" href="/images/logo_webapp.png" />
<!-- favicon - 16x16 -->
<link rel="shortcut icon" href="/images/favicon.ico" />
@MrUzu
Copy link
Author

MrUzu commented Jun 24, 2011

Thanks to @jdaihl
Source : https://gist.github.com/472519

@MrUzu
Copy link
Author

MrUzu commented Dec 9, 2011

don't work for ipad, i made a mistake - this is the right code:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment