I just made a LAN webapp, it works great on my computer but i discovers it just doesn't work well with an iPad. I use JQuery and JQuery UI, and know that using JQuery UI for Mobile I would have less to worry, but I also want to know the basics.

  1. What do I need to know about HTML on iPad, or Android tablet, or smartphones?
  2. Any specific markups?
  3. How do they handle orientation change? How my webapp can/should react?
  4. Specifically to iPad, if a user pin the webapp to homescreen, how do I set which icon should it use (I know favicon don't work)?

Lastly, any performance tips? I used iPad 1st gen and autocorrect fields just make it crawl..

  • examples of this that don't work well: selects can't be searched, jquery UI date input triggers keyboard (does the iPad have native date input btw?), the sizes are all wrong.. – Evan Apr 17 '12 at 3:33
  • Just read the FAQ since this was closed so abruptly... My bad, the site is called webapps.stack... who would've thought developing webapps is NOT of concern? On my defense, I signed up here JUST to ask this. I thought stackoverflow is too crowded or something... – Evan Apr 17 '12 at 8:23
  1. You just need HTML (version usually doesn't matter)
  2. Nope. Just use HTML5 as specified. Use those new input types for forms, because they trigger specific keyboard layouts or standard iOS select controls.
  3. Use Media Queries: http://www.w3.org/TR/css3-mediaqueries/
  4. In addition to favicon you have to specify the icons for iOS devices in the meta tags section: https://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html
  • Thank you. Concerning no.3, some examples posted online are using window.onorientationchange, so nice to know we have a CSS3 option. – Evan Apr 17 '12 at 8:29

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