Understanding Web Standards - Screen Resolutions

One of the more cumbersome things to account for in web design is the size of the page in terms of resolution. It used to be that there was really only 2 common resolutions 800x600 and 1024x768, thus if you designed for 800x600 you would have covered both basis. But in the technological revolution, higher screen resolutions and monitor size have become a common place thing.

Of the users that have visited this site, nobody has had a resolution of 800x600. Bravo, you're a bunch of up to date people. Almost 30% of you are still running a resolution of 1024x768. However the vast majority of you are running something greater than that, which is great!

Here is the resolution relative to the viewers of the blog for the pas couple days:


The problem with resolutions is that I have to define areas in terms of pixels or percentages. With pixels, if I design a site based on 1280x1024 and you have a resolution of 1024x786, you would have a lot more scrolling to do, and you could wind up missing something that you needed. When you have a lot of scrolling for users they tend to get annoyed and go elsewhere. Which is what you don't want, obviously.

Some web designers will say using percentage defined space is a better approach. In most cases they are right. That is a great approach because it allows for dynamic content, that is content that changes per viewer, without any interaction. They only downside to this is that when using a large resolution, you can increase the amount of white space, or blank space in the page. On higher resolution monitors this might snow blind some people and hurt their eyes. Now I realize that I am talking about this on a page that is very small horizontally, and has a large white background. I am working on changes so for the almost 30% of you out there running resolutions greater than 1280x1024, the blog won't give you a headache.

Deciding between percentage and pixel based layout can be tough, but there can also be things that help you make that choice. For instance if you know that your clients have low resolution monitors, you can stick with pixel based. This might come in handy if your designing pages where people are still using dial up or somewhere were new technology doesn't have a significant importance. Likewise, if you're living in a big city, you probably want to make sure the site looks ok at a higher resolution.