Clearly the biggest problem in trying to get both Desktop PCs and Mobile Devices to display web pages in a satisfactory way is the vastly different size of screen. There’s an excellent AListApart article on that, which describes the problem as follows:
Because their screens are small and the device may not always have a horizontal scrolling mechanism, overflow in the horizontal direction is a major problem on handhelds. In addition to letting content wrap into a single column, you need to make sure wide elements fit the narrow screen.
The solution which the article describes well is to use different CSS style sheets. You include both a style sheet for ‘screen‘ that applies to Desktop PCs and a style sheet for ‘handheld‘ that applies to Mobile Devices. It sounds fine in theory. However look at that first Hot Mobile News Item. Microsoft Mobile is touting the Dell Axim X51v. It looks absolutely magnificent. It has a Display Resolution of 640 x 480. It would be a shame with all that resolution to put everything in one column.
So we have a Mobile Device that shouldn’t really behave like a ‘handheld’. Has anyone got a solution for that?
Related: The One Web Principle
sorry but the reality of small screen devices is that the designer does not get to use lots of pretty graphics and fancy formatting and font styles. people use small screen devices to QUICKLY access information. the only design considerations should be saying what needs to be said in as few words as possible in as few screens as possible!
http://www.mobiletechreview.com/Dell-Axim-X51v.htm
From the link above,
‘The Dell has a VGA 640 x 480 resolution display, while standard QVGA Pocket PCs have QVGA (quarter VGA) 240 x 320 resolution displays. That means you’ll see more on screen, but not four times more, even though VGA is four times higher resolution than QVGA. Why? Microsoft’s implementation of VGA is designed to make the display very attractive and readable rather than cram true VGA into a small screen.’
That’s a good point, ryan, however I don’t think that’s the way the world will go.
Ben C, you raise a whole other issue that is fascinating and got me exploring. I’ll be posting shortly on that issue of how the resolution gets to be used, particularly on ultra-portables as they’re being called.
Pingback: Good Resolutions | StayGoLinks
Pingback: Screen Resolution - Some Simple Advice | StayGoLinks
We are getting ready to start developing in Drupal but we have been researching the differences between Drupal and WordPress and the effects of CSS with both… Can anyone provide any feedback between the pros and cons of each? Thanks!
The solution is simple but not likely to be used, which seems to be the murphy’s law of the internet. The device should have an option that allows you to set the browser to interpret or act as either a handheld or screen device. If a website is css created for handheld devices, your handheld may or may not read it (depending on how they created it)
Having a simple setting that says “Handheld” or “Screen” would determine how your handheld presents itself to the website thus affecting which CSS style sheet it gets.
If the site sucks one way, switch to the other. In the magical world of corporations (esp microsoft) they some how always seem to miss out on what should be the golden rule of technology – “let the user decide”