How does Forecast.io get its own system icon?

May 31, 2013 4:56 PM

Just poking around the forecast.io web app on my iPhone, and I noticed that it gets its own icon in the app tray that shows recent apps. As far as I can tell, normally sites installed as apps just point to Safari down there. How does forecast.io finagle its own icon?
posted by dubadubowbow to Computers & Internet (3 answers total)

Best answer: "A web application is designed to look and behave in a way similar to a native application—for example, it is scaled to fit the entire screen on iOS. You can tailor your web application for Safari on iOS even further, by making it appear like a native application when the user adds it to the Home screen. You do this by using settings for iOS that are ignored by other platforms."
posted by GuyZero at 5:05 PM on May 31, 2013 [2 favorites]

Response by poster: Astounding. I can't believe I never knew about this before. Thanks!
posted by dubadubowbow at 5:08 PM on May 31, 2013 [1 favorite]

Guyzero has it.

The forecast.io src code sets the following

  apple-mobile-web-app-capable content="yes"
  apple-mobile-web-app-status-bar-style content="black"
  link rel="apple-touch-icon-precomposed" href="images/icons/54.png"
  link rel="apple-touch-icon-precomposed" sizes="72x72" href="images/icons/72.png"
  link rel="apple-touch-icon-precomposed" sizes="114x114" href="images/icons/114.png"
  link rel="apple-touch-icon-precomposed" sizes="144x144" href="images/icons/144.png"

posted by inflatablekiwi at 5:09 PM on May 31, 2013