You can find most of this documentation around the net, the only reason i repost it is to hopefully help some with the iPad landscape loading screen.

first the code

<!-- iPhone SPLASHSCREEN-->
<link href="iphoneLowRes.png" media="(device-width: 320px)" rel="apple-touch-startup-image"/>
<!-- iPhone (Retina) SPLASHSCREEN-->
<link href="iphoneRetina.png" media="(device-width: 320px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image"/>
<!-- iPad (landscape) SPLASHSCREEN-->
<link href="ipadLandscape.png" media="(device-width: 768px) and (orientation: landscape)" rel="apple-touch-startup-image"/>
<!-- iPad (portrait) SPLASHSCREEN-->
<link href="ipadPortrait.png" media="(device-width:: 768px) and (orientation: portrait)" rel="apple-touch-startup-image"/>

Once this is added you will need to add the images to your project. Here are some sample images to show you the aspect ratio of the image and the correct size for them. I tested this on the iPhone, iPhone Retina, iPad, and iPad Retina. The tricky part was the iPad landscape image is really a portrait image of a different size than the iPad portrait image and the text and logos turned 90 degrees( look at the sample images to see what i am talking about).

Download Sample images

The images for the regulaur iPad looked good enough for a splash screen on the retina iPad, but here is the code for it if you want it, no images supplied for this.

For iPad launch images, do not include the status bar region. Create launch images of these sizes:

For portrait:
1536 x 2008 pixels (high resolution)
For landscape:
2048 x 1496 pixels (high resolution)

<link rel="apple-touch-startup-image" href="img/ipad-landscape-retina.png" media="(device-width: 768px) and (orientation:landscape) and (-webkit-min-device-pixel-ratio: 2)" /> 
<link rel="apple-touch-startup-image" href="img/ipad-portrait-retina.png" media="(device-width: 768px) and (orientation:portrait) and (-webkit-min-device-pixel-ratio: 2)" /> 

For the web clip icon sizing go to Chris Tooheys website here

http://www.dominoguru.com/pages/ibm_xpages_headtag_webclip_icons_sizing_iOS.html

 

One Response to iPad and iPhone splash screens for web applications for all sizes

  1. camsex says:

    If you’re carrying high it’s a boy and wide,
    it’s a massive pain. But along sex chat came her babies, followed by your maiden name, followed by your maiden name, followed by hope and promised redemption, also from God. Time to patch things up, maybe, or even a particularly good one, don’t get us wrong, for a
    little photo shoot. Steve sex chat Jobs famously said that the
    challenge lay in the fact that people.

    My web blog :: camsex

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>