Design and screen resolution
2007 was the year most agencies and clients really started to think of 1024 pixels and upwards as the primary horizontal screen resolution, rather than 800.
Of course the stats have shown that higher screen resolutions have been growing rapidly over the last few years, but until recently many clients still defaulted to the safety of 800 pixels.
However with the work that we’ve been doing lately, we’ve been using a liquid layout, optimum appearance for 1024 with a design that scales nicely to an 800 pixel width. You can scale in a number of ways but the most obvious routes are to reduce each column width or to take one column and move its contents somewhere else (eg. to the bottom of the page). It’s relatively easy to do, but you need to think carefully about moving a column that suddenly gets demoted to the foot of the page.
Screen depth is equally important and if you want to make sure people read all the content, ensure that you don’t make a clean content break on the fold. Otherwise your reader will think they’ve seen everything and fail to scroll. As always make sure all critical navigation and content appears in the 800x600 viewable area, and remember the browser is not always expanded to fit the entire screen, whatever the screen resolution.
A number of new online designs have contributed to this change in thinking, including the new beta design for bbc.co.uk which takes a bold stance in being designed for 1024 – and not scaling nicely to an 800 pixel width. Go from the new beta to an existing news page and you really notice a difference!
Also the growth in browsing the web with mobile devices means that we also need to design specifically for smaller screens – although it does get tricky with the variations in screen resolutions and which style sheets the mobile browser reads.
So designing with larger screen sizes in mind is definitely the way to go – but you need to take on board all these other factors whilst doing so.
Of course the stats have shown that higher screen resolutions have been growing rapidly over the last few years, but until recently many clients still defaulted to the safety of 800 pixels.
However with the work that we’ve been doing lately, we’ve been using a liquid layout, optimum appearance for 1024 with a design that scales nicely to an 800 pixel width. You can scale in a number of ways but the most obvious routes are to reduce each column width or to take one column and move its contents somewhere else (eg. to the bottom of the page). It’s relatively easy to do, but you need to think carefully about moving a column that suddenly gets demoted to the foot of the page.
Screen depth is equally important and if you want to make sure people read all the content, ensure that you don’t make a clean content break on the fold. Otherwise your reader will think they’ve seen everything and fail to scroll. As always make sure all critical navigation and content appears in the 800x600 viewable area, and remember the browser is not always expanded to fit the entire screen, whatever the screen resolution.
A number of new online designs have contributed to this change in thinking, including the new beta design for bbc.co.uk which takes a bold stance in being designed for 1024 – and not scaling nicely to an 800 pixel width. Go from the new beta to an existing news page and you really notice a difference!
Also the growth in browsing the web with mobile devices means that we also need to design specifically for smaller screens – although it does get tricky with the variations in screen resolutions and which style sheets the mobile browser reads.
So designing with larger screen sizes in mind is definitely the way to go – but you need to take on board all these other factors whilst doing so.
Topic:
1 February 2008 by Nikki Barton
Nikki Barton is the Creative Director responsible for the ground breaking design of Internet Explorer 5 for the Mac, Tate website and Malcolm McLarens' Casino of Authenticity. She is regarded as one of the leading experience designers in digital media in the UK.
Nikki Barton is the Creative Director responsible for the ground breaking design of Internet Explorer 5 for the Mac, Tate website and Malcolm McLarens' Casino of Authenticity. She is regarded as one of the leading experience designers in digital media in the UK.
