-1

I know that the mobile bookmark bubble might sort of work for iOS, but it isn't going in the same section. And for Android, bookmarking is really not going to cut it for a mobile HTML5 application install since users just don't think to go to their bookmarks and that bookmark process takes two or three steps.

To me this issue of getting the application (bookmark) installed pretty much makes the rest of the HTML 5 features aimed at mobile HTML much less useful. I can't realistically expect users to prefer the bookmark install and launch process over regular apps, so I can realistically expect them to ignore my mobile HTML5 application and use a native app.

The groups behind mobile HTML 5 features do seem to be pushing for HTML 5 apps adoption with things like Application Cache etc. To me it seems obvious that the bookmark bubble is not going to cut it. Someone please tell me they have addressed this or at least are working on it?

4
  • 1
    Hi Jason, welcome to the site. Since this question is specific to particular technologies it will probably be moved to StackOverflow (where you'll get better answers for it). If you haven't already, have a read through the FAQs programmers.stackexchange.com/faq to make sure you're asking the right sorts of questions so you don't get disheartened by migrated/closed questions.
    – StuperUser
    Commented Nov 15, 2011 at 11:39
  • 2
    I have a feeling Stack Overflow will just delete it if someone moves it there. Actually seems like good questions on Stack Exchange just get shifted around or deleted.
    – Jason Livesay
    Commented Nov 15, 2011 at 11:43
  • Well, I hope this will never be a functionnality of HTML5.
    – deadalnix
    Commented Nov 15, 2011 at 11:46
  • @Jason, perhaps this belongs to the superuser SE site. :-)
    – Danny Varod
    Commented Nov 15, 2011 at 15:56

4 Answers 4

Reset to default
5

Updated

Depending on the iOS version, you need either 72*72 or 114*114 icons. Also, you can specify the icon is precomposed (iOS just adds arounded corners) or not (it also adds a shine effect on top of it).

However Android (2.1+) can only handle precomposed icons.

So if you're looking for a one-code-fits-most, use this snipplet:

<!-- For iPhone 4 with high-resolution Retina display -->
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="apple-touch-icon-114x114-precomposed.png">

<!-- For first-generation iPad -->
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="apple-touch-icon-72x72-precomposed.png">

<!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
<link rel="apple-touch-icon-precomposed" href="apple-touch-icon-precomposed.png">

Android and iOS 4.1 use the last icon in that list, that's why the link without sizes ais at the end.

However, both iOS and Android will add the link only if the user chooses to create the link, there is no way to do it without user interaction currently, nor is there anything in HTML5 to introduce such a feature yet.

And if you're making web application, make sure to add this tag (the webpage will be opened fullscreen on iOS):

<meta name="apple-mobile-web-app-capable" content="yes" />

and furthemore, you can specify a loading screen for iOS:

<!-- 320x460 for iPhone 3GS -->
<link rel="apple-touch-startup-image" media="(max-device-width: 480px) and not (-webkit-min-device-pixel-ratio: 2)" href="startup-iphone.png">

<!-- 640x920 for retina display -->
<link rel="apple-touch-startup-image" media="(max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2)" href="startup-iphone4.png">

<!-- iPad Portrait 768x1004 -->
<link rel="apple-touch-startup-image" media="(min-device-width: 768px) and (orientation: portrait)" href="startup-iPad-portrait.png">

<!-- iPad Landscape 1024x748 -->
<link rel="apple-touch-startup-image" media="(min-device-width: 768px) and (orientation: landscape)" href="startup-iPad-landscape.png">
1
  • Of course I don't want to do it without user interaction. I just want a way to "install" an app that is as convenient as the normal app install process both during the install and when the user wants to launch.
    – Jason Livesay
    Commented Nov 23, 2011 at 3:49
5

HTML 5 is not an app language, but rather a webpage language.

You can of course use it as a client side for web apps, however, I think someone would have to write a real app per mobile platform for wrapping the links with an wrapper app that can be installed, or the OS providers could enable pseudo-installing links.

3
  • Thanks.. I guess the "pseudo-installing links" sounds like what I was hoping someone would say was in the planning stages at least..
    – Jason Livesay
    Commented Nov 15, 2011 at 11:39
  • @Jason, that would have to be done by the OS (iOS/Android), not HTML5. Also, I doubt Apple would put it in iOS, as they cannot control web apps like they can native apps (hello Amazon!), so they have no incentive to make web apps easier to access
    – Dan McGrath
    Commented Nov 15, 2011 at 14:25
  • As Dan clarified, this isn't an HTML 5 issue - it is an OS issue. Windows and Android DO support putting links/bookmarks/favorites on the desktop/springboard.
    – Danny Varod
    Commented Nov 15, 2011 at 15:37
0

I don't think they are planning to add it. This is more of an OS thing; in iOS, a bookmark can be saved within an application wrapper and launched from the Springboard. I assume Android will eventually adopt the same technique -- or it won't, in which case you'll have to develop a workaround on your own.

1
  • Apple reject any lightweight wrapper of a (downloaded) HTML5 app in their T&C. They prohibit dynamically downloading executable code. This would circumvent their review process. PhoneGap et.al. avoid this issue by shipping the HTML and JS with the iOS app.
    – user48956
    Commented Jan 14, 2015 at 19:04
0

You don't make HTML5 itself worry about it -- it isn't a concern for the protocol. In 2011, you launch your HTML5 web app by making a small native app that can perhaps push some alerts, provide contact us info and, last but not least, launch your HTML5 app.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.