The Screen Resolution Problem

The Screen Resolution Problem I used to come across this problem almost every time I looked around the web. I would get to a web site that has a nice design, but I could not see everything without scrolling sideways with the bottom scrollbar in my browser! The reason is that the highest screen resolution my old monitor would support was 800x600 pixels. (It was an old monitor). There are also many other surfers out there who have older monitors or video cards. If you have a large target audience, you will want everyone to be able to read the page easily.

So why are webmasters designing sites for larger screen resolutions (1024x768, 1280x1024 etc.) when people are clicking away because they cannot read without scrolling two ways? There are a few answers out there to look at: Webmasters who do not realize what they are doing, those who do not care, and those whose target audience would typically have a high screen resolution.

Yes, there are some webmasters who do not realize that their web site does not look the same on every computer. It took me a bit of time to find that out myself, back when I was creating my first homepage. The problem is that you simply cannot see the problem when you only use your own computer with your personal settings. In this case, I can't really blame the webmaster....if I had a nice monitor, I would set a higher resolution as well.

Webmasters who do this knowingly yet do not care are likely to lose a large number of visitors simply because they refuse to use a smaller graphic or table. The presence of a graphic that is over 600-620 pixels wide will almost surely force the user with a low resolution into using the horizontal scrollbar. The problem is really annoying if the viewer is trying to read a paragraph of text and has to scroll every 5 seconds to see the next few words at the beginning or end of a line. Navigation can be irritating as well, because the navigation menus may be partially hidden or in some cases, entirely hidden from the viewer when they first see the page. If they do not realize the scrollbar on the bottom, they may feel the site is not finished or has nothing there to see. Well, if the webmaster does not care.......

If a webmasters target audience would be people with higher screen resolutions, they may design site to be viewed at that resolution. Usually they will make sure the 640x480 viewer can at least see the important information without the need to scroll, but the site is optimized for their target audience. This is not a major problem, since most of the people viewing that site would have the correct equipment and settings.

So, how can you as a webmaster or homepage creator avoid forcing people to scroll from left to right? One way is to simply not use any graphic with a width greater than 600 pixels, and do not define anything such as an <HR> tag or tables to be greater than 600 pixels wide. Also, do not use the <NOBR> tag on any page unless you need to make a point, such as "this line of javascript needs to be all on one line."

Another option is to use tables to enclose the contents of your page. By using tables with a width of 600 pixels or less, you will be sure that almost anyone can view your page as intended. You can center the tables if you wish, but if you are going to use some of the new features of DHTML or Style Sheets you may want to align the table to the left or right side in order to use absolute positioning without any surprises.

Another problem I have been told about is that viewers of your site may resize their viewing window. There is no way to guess what size they might go to, but you can use a table with a width percentage instead of pixels so that the content resizes along with the window. This one is much harder to deal with, especially with a complicated design scheme that requires exact numbers rather than percentages. Do what you can, but if your viewers use 50x50 windows, there just isn't much you can do stop the scroll bars.

This page used to have a centered table with a width of 550 pixels. I only have a few pages where a bottom scrollbar will show up, usually on examples of the <NOBR> tag and in some javascript tutorials. This article uses style sheets or the browser defaults if style sheets are not supported. Otherwise, I use mostly 550 pixel tables, or I use no tables at all and keep the images and horizontal bars small in width. Just remember, if you want everyone to see your site without scrolling, keep your site inside the 600 pixel width barrier. Those who have old monitors or video cards will definitely appreciate it and return to your site in the future.

The Screen Resolution Problem
I used to come across this problem almost every time I looked around the web. I would get to a web site that has a nice design, but I could not see everything without scrolling sideways with the bottom scrollbar in my browser!
No-one wants to look at the screen
One of the most fundamental factors in designing for screen-based media is: No-one likes looking at a computer screen...
Website Designing with Browser Compatibility
In the early days of the Internet, many sites advertising Best viewed with Netscape or Best viewed with Internet Explorer or the like. These days, such labels seem to be rarer. Web designer today put an inordinate amount of effort to promote their sites on the search engines.
Screen Size Compatibility Can Make Or Break Your Design
Have you ever visited a Web site that looked, well
Is Your Site Too Slow? Why Image Optimization Is Critical When You Create A Web Site
Graphics are fun, but if you put in too many bells and whistles when you create your web site, you may lose a potential audience whose Internet connection can
Anonymous Visitor Marketing
Several kinds of data are attached to each internet users communications. This is known as metadata or supplemental data. This data provides a profile of each visitor to a website that can and should be used as marketing data.
Liquid VS Fixed Layout Debate In Modern Web Design
This very informative article will help you to understand the continued comparison of benefits and liabilities of Liquid VS Fixed Layout. The author explains when a mixed approach works best.
Full Screen
Javascript allows you to display a page in full screen via a button, the script consists of 2 parts, the first one will be inserted between the and tags is:
Avoid Horizontal Scroll Bars
What you see is not always what you get at least with the standard screen sizes. Many new web designers will assume that if they are designing for an 800x600 screen that their web page tables should be 800 pixels wide. If you tried it, and you have to horizontally scroll to read your page content, I...
Top 10 Web Design Mistakes
As a webmaster, you want to keep your visitors content so theyll come back again. Below you will find ten common mistakes made by webmasters that may deter people from returning...