Friday, May 28, 2010

iphone, blackberry, mobile web pages

When trying to create web pages for web browsers in mobile devices, the initial idea might be to simply create "small" pages which for example contain images with a widths of 480 pixel that should fill the display of a 480-pixel-wide phone.

In reality, that image might then only use about 50% of the screen!

Reason: Mobile web browsers pretend to be like a desktop web browser, for example having close to 1000 pixel screen width, and then scale the web page down to fit onto the physical display, so a 480 pixel images uses 480/1000 = about 50% of the screen.

One important hint is this HTML tag that instructs the mobile web browser to use the phyisical screen widths:


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

See


No comments:

Post a Comment