CSS Media Queries

Nary a month on from the UK launch of the iPad it’s iPhone 4 day. Beyond the sight of people getting giddy over expensive consumer electronics the proliferation of mobile devices with all sorts of different resolutions and orientations raises the question of how best to serve web content that can be viewed as nature intended on all these devices. We’re not even past clients asking for pages that “fit on one screen” to which we invariably point to articles such as this – http://www.cxpartners.co.uk/thoughts/the_myth_of_the_page_fold_evidence_from_user_testing.htm –  so how do we build for everyone ?

One answer are CSS media queries. Simply put these allow you to supply different CSS depending upon queries about the devices resolution and orientation. For more information see http://broadcast.oreilly.com/2010/04/using-css-media-queries-ipad.html and http://www.alistapart.com/articles/responsive-web-design/