Me and @aarmitage had a little discussion about screen resolution in the office the other day and it’s kind of left me thinking – are we ever going to consistently design websites for screens larger then 1024×768 pixels?
Conventional wisdom as we progressed from 800×600 to 1024×768 was that as bigger screens became affordable and PC usage more common place home users would eventually gravitate to a 1920px width screen and so on so forth. However whilst all your designer mates might have large 1920px screens most home PCs are still 1024×768 and as such web designs are generally fitted to a 960px width to sit comfortably on this size screen. Add into the mix the growth of mobile internet and the announcement of the iPad and we’ve come full circle and are right back designing for smaller screens than ever.
So whilst you may design for designers on larger monitors and we will still have to consider where our background goes beyond the 1024px width will we ever find that a commonplace width for client sites or have we reached our widest “normal” width with our 960px wide site?
Will the transition of internet access from the desktop simply mean that we design more fluid sites and mobile alternatives instead, whilst still sticking to conventional widths?
well I hope not, that will save me having to buy a new monitor. I saw a podcast from css tricks where he said ‘nobody uses 1024 x 800 these days unless they have a really really old computer, your design will be bigger than this … ‘ and got quite worried about it. It could be useful for using graphics programs to have more screen to play with (fit palettes next to pics) but that’s all.
960 does not have to be max. width for 1024px. As long as you have enough right hand space for a vertical scroll bar on the right, you’re OK to go to 980 or 1000 even.
There are other things to consider whether to design for over 1024…
Reading area: This is most important I think. You should not have a wide reading area. When you read magazines, books etc. they are a suitable width for reading. I would not want to read across my whole 22″ screen. Its bad for “scanning” content too. So no matter the width, 960 – 1000(inc. a left or right column) is a good reading width.
Website function: if its a blog for information, reading, news etc. then as stated above, a thinner area is better. But if the website is a game, or photo gallery or something, then wider would be better. So it depends on the site.
Netbooks/Laptops: These will always have smaller screens, on which a much higher resolution would make reading impossible as the text would be too small. So an approx. 1024px would probably stay at a standard on laptops and netbooks.
So I think it is a long time coming before you can design for over 1024, not until the majority have higher res monitors and even then do you really want a very wide reading area for content?
When I eventually have my 50″ screen for the computer 🙂 I will still want to open my browser no more than 1000 for reading purposes, I would never maximise an information website.
Thanks for the comments. Some great points Laurie – I guess I chose 960 as it’s kind of standard to give you a bit of breathing room around the design.
I wonder if the time will ever come when the internet is primarily viewed on screens over 1024. Possibly once people browse on their TVs more but I think the future of the internet lies very much with portable devices.
Either way given the points about readability are we likely to see a lot more fluid layout and alternative layouts for mobile, TV and different resolutions?
I don’t have much to add to what Laurie said except to point out that the iPad etc. tend to load a zoomed out overview of a page and allow easy zooming to sections of interest – don’t rule out larger pages just because of these portable devices. I have few issues on my 320×480 Android phone for simple browsing.
Netbook on the other hand are a different animal. But according to Jobs they serve no useful purpose anyway…
Regardless, I rarely maximise a browser window on my 1680px wide screens, so maybe we’ve found a sweet spot that works for design and readability?
.-= Shaun´s last blog ..How To Setup the Ideal LAMP Development Server using Ubuntu =-.
Good points!
It’s 960 because if any wider it won’t fit on a 1024 screen with IE8 on Vista (with default Vista theme).
Nb. This is my least faviourite setup ever – I don’t like this fact any less than you do.
🙁
.-= Andrew Fox´s last blog ..andrewdavidfox: "If I had asked my customers what they wanted, they would have asked for a faster horse" – Henry Ford =-.
Thanks for the comment Shaun – I completely forget about the fact that you get a zoomed out page on opening. I guess it’s up to people whether they then optimize the page to a smaller resolution a la mobile browsing or do they just let the site show as a zoomed out version and let users then zoom around.
Personally I quite often have my screen maximized when browsing but find that most sites restrict the actual reading area to a small section around 900 pixels wide.
I left a customer site on Monday and I viewed some of my recent work on their 1024×768 monitor… WOW IT LOOKED BIG!!!
I’m staying fixed width and 900-1000 odd pixels wide for the indefinite future.
I think there are 2 major considerations when it comes to thinking about max width…
Firstly (and most importantly), do people with super widescreen monitors actually use the internet with their browsers maximised? I know I don’t and, from the little research I’ve done, I’ve come across quite a few others. One of the beauties of parting with vast sums of money for hideously large screens is the fact that browsers, etc. don’t have to be maximised.
Secondly, think about future pitches… The number of companies (some of them VERY profitable businesses) whose IT departments still believe that IE6, never mind small screens, are still perfectly acceptable is enornmous. I’ve been to plenty of pitches where the client has asked for a few examples of previous work, only to type it into a browser right there and then. It’s never a good thing to say “Well, it looks great on a bigger screen/IE8”.
I’m sticking to 960px(ish) for now. Will that ever change? Probably but not any time soon I don’t think.
.-= Luke Sheppard´s last blog ..Five Web Design Blogs I keep going back to =-.
Oh I’ll have to check that. I dont recall having width issues on my IE8 with Vista on > 960, but I’ll have to make sure to check again just in case.
I was not aware of the “960 grid system” http://960.gs/. Will have to read up a bit more on its advantages. I just usually try to get a maximum screen width for 1024 resolution.
I’ve been designing with a fluid 960 width for a long time, not that I like it, but because it is still a necessity. I’m sure that eventually we’ll design for larger resolutions (look at what happened to 800 wide), but for now, just like IE6, we have to be patient. If you’re designing for other designers that’s one thing, but when it comes to designing for clients then it pays to toe the line on min widths (except of course if you’re designing for small resolutions or extra large resolutions).
.-= Anne´s last blog ..Web Site Design & Development Cost Estimate: Item #1 Planning =-.
For web designers, mobile web design is becoming an easy way to acquire new clients. It amazes me how few web design companies are offering this for their clients.
Hi, very interesting site. I am also leading one’s and I know how hard it is. Your articles are great, although not always I agree with that waht your write, but in spite of that I will visit your site more often. I wish you the success and the perseverance in running the blog, Ann
TY wonderful job! Just the info I had to know.