Screen resolutions for websites


Question: I just found out that because my screen resolution was set to 1024×768 when I designed my sites, most people are not seeing what I designed, but instead something extremely large and very badly laid out (I only began in July, so I still have a lot to learn). My pages were designed in various programs – the early ones in Composer (Netscape), the later in Adobe Pagemill – I have now set my screen at 600×800, do I have to go back and re-do all of my pages to make them look decent at this resolution? The idea of the task is daunting as they comprise about 6 months of work!

Answer: Ahh, yes. The wonderful world of resolution. Welcome. This was probably one of the most frustrating arguments I have ever had about web design. Not just with one or two people, but at least ten. 1024×768 is a very large resolution. It is great on your computer, but for the average joe/jane, who views at 640×480 or 800×600 it looks a bit odd. I have a client that almost loses his mind when he sees scroll bars on a web site. I have had another client that screams when his 1024×768 screen is only partially filled with his website. It is a catch 22.

My theory is well, you can’t win them all, but you can win the majority. Even at 600 x 800 you are going to have troubles with some of your viewers. That is why it is a good idea to switch your monitor down to 640×480 and check to see what your site looks like for those who have small monitors. There are a lot of them out there. A well coded site will look good on all screens. Another idea, try taking a pencil and marking on the monitor’s edge lines where the 640×480 screen (on the plastic part) That way, at a bigger rez you can still get an idea of how big your window should be. Resize your window that you work in to fit those dimensions so you don’t lose perspective. Also, try setting your table that you work in to 600 pixels. That way, it will look bad, if you over guesstimate.

Instead of redesigning all of your pages, try to move some of your images around. If that doesnt’ work, try to use tables to rework some of your old design in, and only resize the ones that don’t fit. It is a good rule of thumb, to put a large table around everything you have in your web site, and to center that table so it will automatically center itself when it is in a larger window. Make sure to set that table’s width to 600!

It may sound awful to have to redo all of your sites, but if you do them the right way this time, you can please all of your viewers. 640×480 is the safest rez to work with becasue there isn’t anything smaller!(that counts anyway) Just take it one site at a time, and it won’t seem so bad. Remember to experiment! You may not have to change as much as you think. Oh, and if you are using an editor, think about how much it would take to do it by hand! You have it luckier than you think!

Author: Gina Hutchings
Copyright Lunar Media Inc
Chicago Web Design