Top Web Design Do S and Don Ts

Top Web Design Do’s and Don’ts

Top Web Design Do’s

Color: Do use background and foreground color combinations that provide sufficient contrast for ease of reading. Lightly colored text is very difficult to read on a white background.

Graphics: Do use graphics as an integral part of the user’s experience. Graphical content makes the site interesting.

Identity: A site's character or identity is expressed through the judicious use of visuals.

Graphic Identity: Repetition is not boring when it gives the site a consistent graphic identity that creates and reinforces the overall site identity.

Animation: Do use discrete animation used to develop the concepts in the Web page. It can be very effective.

Load time: Including clips and animation greatly increases the size and loading time of a page so they should be kept to a minimum.

Buttons: Do include buttons for specific reasons such as moving between pages.

Links: Do use the links to describe the path the user should take. The number of links should be kept to a minimum.

Navigation: Do use intuitive and consistent methods to move between top and sub-pages.

Excessive scrolling resulting from excessive page dimensions distracts from the task at hand. If scrolling through long pages is necessary, some information might be lost on many users
Pages that do not link back to the top page are left to the mercy of the

back arrow (these are called Orphan pages).

Top Web Design Don’ts

Technology: Don’t necessarily use the latest and greatest technology available, especially when it may not be well tested in all situations. This can lead to crashes, which must be avoided. Sites tend to increase in size with the over use of technology and users will avoid sites that take too long to load.

Animation: Don’t use constantly moving text or marquees that tend to distract the user from the actual content of the page.

Audio: Don’t constantly repeat the same audio clip. It becomes very annoying.

Movies and Sounds: Don’t include large files that are inaccessible to many visitors. People browsing with dial-up connections should always be considered. If students want to provide a large media clip, they must consider presenting a low and high quality version, giving visitors their choice of download. Also remember that more video is not necessarily better video.

Graphics: Don’t start developing a site based solely on graphics and other multimedia techniques. The original design can include these features but they should only be used to enhance the site when the design is complete.

Do not use graphics just to enliven a page. Graphics alone do not make a site more interesting.
Not every piece of text or graphics has to move.
Adding numerous visuals detracts from the main message of the site and slows page loading.

Text: Don’t use unnecessary words like "click here to continue". The context of the page should lead the user to the next action without unnecessary prompts.

Capture the users' interest by writing concise content in a “scannable” fashion. Web pages are scanned, not read.
Underlining words should be avoided. Underlining indicates a hyperlink.

Fonts: Do not use too many fonts or fonts that are fancy but hard to read.

Color: Don’t use a rainbow of color. Too many colors lead to clashes and clutter.

Patterned backgrounds: Don’t use patterned backgrounds. They tend to make text harder to read and complicate diagrams.

This computer science resource was developed through a collaboration between IBM Corporation and CSTA.