Screen Resolution and CSS Style Sheets
If you're new here, you may want to subscribe to the RSS feed for this blog. Or you can subscribe to a combined news feed for all SMM publications. Thanks for visiting!
Hot Mobile News
The Dell Axim X51v is the ultimate handheld device that delivers performance, connectivity and a brilliant VGA display at an affordable price.
At Microsoft’s annual analyst briefing, chief software architect Ray Ozzie spelt out the company’s vision of putting the Internet and hosted services at the centre of its universe. It has much in common with the converged communications vision that the telecoms sector has been touting for some time.
AskMeNow is your mobile lifestyle network. Get quick and easy access to Weather, Movie Times, 411 listings, Sports Scores, Directions, Horoscopes, Flight Information, Stock Quotes and more?ALL from your mobile phone. All for FREE!
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
 |
Go To Top
in the SEO Services Marketplace
BPWrap
July 30th, 2006 at 8:51 am
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!
July 30th, 2006 at 8:52 am
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.’
July 30th, 2006 at 1:36 pm
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.
July 30th, 2006 at 2:08 pm
[...] A Public DiaryOn The Way To A Patent « Screen Resolution and Stylesheets [...]
February 18th, 2007 at 7:20 am
[...] Many will read his article on Screen Resolution and Page Layout and be in agreement. His simple advice is clear. Optimize for 1024×768, but don’t design solely for this size. Have a fluid design that works at any resolution, from 800×600 to 1280×1024 and beyond. IMHO that simple advice may be clear but it’s wrong. Just look at the prior posts on Good Resolutions and Screen Resolution and Style sheets to see why simple can be too simple. [...]
August 13th, 2008 at 4:41 pm
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!
January 6th, 2009 at 9:14 am
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”