Common Web Design Problems
This list contains many of the most common mistakes made by web page designers. These are problems which make it difficult or impossible for many web surfers to use a site efficiently. Remember that your site represents your company or organization to current and
potential clients. They are giving up their time and computing
resources to view it, so it pays to make that experience as pleasant
and efficient as possible by avoiding these issues.
These problems are explained below:
- Deep Linking
- This is the practice of linking directly to someone else's content
from your site without the target's consent. Embedding images
stored on another server in your own page is the most common example.
This is criminal
theft of service, similar to stealing cable TV. Always ask
permission before using other people's content. It's okay to link
to someone else's page, just don't embed their content
within your own.
- Very Large Images
- Important images should never be larger than about 20 kbytes.
Artwork should be linked via small icons and the size of
the full image clearly stated.
- HTML Reduced Images
- The "
height" and "
width" HTML tags
should never be used to
reduce the size of an image as this forces the browser to
download more data than is needed. A
graphics editing program should be used to reduce the image to
the appropriate size.
- Unspecified Image Dimensions
- The actual width and height of every image should be specified
in the tag. This allows the browser to complete its layout and
display the data it has rather than waiting for the entire page
to finish loading.
- No Text Alternatives
- All images should have a text equivalent, either as an ALT tag
or in a separate description. This is especially important if
they represent links. This allows users to see what their
options are without waiting for the entire page to finish
downloading. It also allows users to navigate your site without
downloading any images. Image maps should always have plain text
equivalents. Having text friendly pages has become especially
important as a growing number of web-surfers are using cell phones
and PDAs to view your pages.
- Java Required
- Activation of Java or Java Script should NEVER be required to
navigate your site. Both still have substantial security holes:
asking a user to turn on Java at an unfamiliar site is like
asking them to mail their credit cards to a stranger. Very
few functions truly require Java. Those which do should be
optional and clearly labeled.
- Cookies Required
- Cookies are unreliable and often a nuisance. Users worried about
being targeted by marketing databases usually disable them. Some
functionality performed by cookies can be accomplished via hidden
form variables. Whenever you are using cookies, for any reason,
you should say so clearly. You should also make sure that cookies
are only returned to the server that set them, as many browsers now
disallow other uses.
- Browser Dependent
- HTML extensions specific to one browser should NEVER be relied
upon. Requiring users to switch programs just to read your site
is simply unreasonable.
- Inconsistent Links
- A single document can be referenced by many different URLs,
particularly if your site has multiple names. Be consistent
in how you link to documents so that the browser's cache does
not have to load the same file multiple times. To improve
flexibility and consistency, leave the site name out of your
links. For example, "
http:/my/doc.html". This makes the link independent of which
name was used to access your site and saves you from having
to change hundreds of files if the name changes.
- Broken Links
- Links on your site may refer to documents that are
not available or servers which are down. You should regularly
check your server's error logs for Document Not Found errors.
To help prevent such problems, each document should contain a
commented list of those documents which refer to it. This
allows you to easily update your links when a document moves.
- Long Indexes
- Index pages should be concise and contain a minimum of graphics.
This allows users to quickly find what they are looking for.
- Bad Scaling
- Your site should adapt well to different window
sizes. A page that does not scale itself to a wide range of sizes
forces users to scroll around or to consume excessive desktop
space in order to find what they are looking for. Be sure to
test your page on sizes ranging from 600x400 to 1200x900.
Remember that just because someone has an 1024x768 display doesn't
mean they want your site taking up all of it.You may even want to
try your site on a 160x160 PDA display. It's hard to optimize for
this format, but often you'll find that simple rearrangments can
make your page much more readable even in this limited format.
- Bad Alignment
- Page elements may overlap or become obscured. This is usually
due to an excessive reliance on tables or to differences between
browsers. Be sure to test your page at different window sizes
and on different browsers to make sure it appears correctly.
- They almost never look as good on someone else's browser as they
do on yours. They rarely scale correctly to different display
sizes, often leave unwanted garbage behind, and always mess
up the browser's history trail. Many users hate frames deeply.
If your life just isn't complete without frames, at least provide
"frames free" alternative links.
- Bad Background
- Your background should contrast with the foreground text, but
not garishly. If you are color-blind, please let someone else
choose the colors. Low contrast or clashing colors make a
site almost impossible to read. Do not rely on a background
image to create contrast with your text. Set the page's
background color so that people browsing without image auto-loading
can still read your information.
- Obscure Links
- Important links should be arranged in an easy to read and logical
format. Only incidental links like footnotes or references should
be placed in paragraphs.
- Unnecesary Registration
- Requiring users to submit personal information should only be done
if it is absolutely necessary and only truly necessary information
should be required. There should be a clear statement declaring
why the information is necessary and exactly what it will and
will not be used for. Most of us just lie anyway (see how
many email@example.com addresses get registered). Sending
unsolicited commercial email based upon registration
information without a reader's permission will likely provoke
extremely hostile responses.
- Missing Directory Slash
- Links to directory index pages should always end with a forward
/". For example, if you are linking to the index page of the
/mystuff/subdir", then the correct internal link would be
http:/mystuff/subdir/" or when linking from another server,
http://www.mydomain.com/mystuff/subdir/". If you leave the end
slash off, then browsers will get a directory error and have to
retry with the slash added every time the link is followed. This
creates unnecessary delays, especially during high congestion.
- Obsolete Image Maps
- Image maps should be "client side" to allow users to see the active
areas of the image and reduce link time. For backwards
compatibility, an image could use both client and server side maps,
but there's really no point anymore.
- HTTP File Download
- Avoid using HTTP links for transfering binary or large files.
Some browsers do not process binary files reliably, although
this is not nearly as much of a problem as it used to be. When
possible, uUse FTP, that's what it's for.
- Plug-Ins Required
- If a user installed all the plug-ins proffered by the sites they
visit, their browser would grind to a halt, if it started up at
all. Worse than Java, plug-ins are tremendous security holes.
Even popular ones from "reputable" software houses are often
buggy and can lead to browser crashes and even data loss.
Whenever possible, allow the user to download the data and view
it outside their browser. If a plug-in is necessary for multimedia
content, clearly identify what plug-in is needed and provide a link
to its source.This has become less of an issue since IE no longer
supports plug-ins. Still, you should avoid content which requires
Most of these problems can be avoided by testing your site on a variety of
platforms and checking your server's error logs. Remember that not
everyone has a T1 connection with a 1280x1024 true color display. Keep in
mind that a web savvy user will likely have Java turned off, minimal
plug-ins, and will change their window size frequently. Your readers are
your customers and if you make it a chore for them to view your site, your
customers WILL go elsewhere.
Seth B. Noble -
Web Design Problems -
Updated November, 2002