Win a copy of Design for the Mind this week in the Design forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

Features in HTML5 that might help a better mobile web pages

 
Jagadeesh Balasubramanian
Greenhorn
Posts: 13
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
With ever growing mobile web space, what all features in HTML5 you see will be good help in mobile web development?
 
Eric Freeman
author
Ranch Hand
Posts: 33
5
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
For starters the geolocation API, along with local storage and offline support. Beth will probably have some comments on the CSS side.

Eric
 
Elisabeth Robson
author
Ranch Hand
Posts: 173
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Well a key new feature of HTML is the media query. This is something you can add to HTML through the link element, using the media attribute, or to CSS using the @media selector. For instance, you can write:

<link media="only screen and (max-device-width: 480px)" href="mobile.css" rel="stylesheet">

and the file mobile.css will only be loaded if the user is on a device with a maximum screen width of 480px.

It's also a good idea to use the viewport meta tag. For instance, if you do this:

<meta name="viewport" content="width=device-width">

the mobile browser will automatically size the page for the device width.

These aren't really "HTML5" specific things, but new additions to the link and meta tags.

In addition to these, browser makers are working on adding support for touch events and orientation changes in JavaScript. So just like you can add a handler for a click event, you can add a handler for an orientation change event. A tap is equivalent to a click, but, for instance, Apple has also added support for "gesture" events. Again, this isn't really an HTML5 thing, but a new feature that may be specific to the browser maker. There is a W3 standard in development for Touch Events, but it's not clear that all the browser makers have signed on to it (and indeed there may be some patent issues that will cause problems with this, unfortunately!).

Elisabeth
 
Elisabeth Robson
author
Ranch Hand
Posts: 173
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Oh, I should also add that the W3C (primarily driven by Mozilla) is working on a Device APIs specification, that would add JavaScript APIs to support things like phone calls, vibration, access to device contacts and other device apps, in order to support an HTML5-only phone interface! Which is pretty cool... a long ways off though, but coming!
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic