Creating a Web Page X: Design Tips
Created | Updated Sep 15, 2002
Please refer to previous entries in the "Creating a Web Page" series:
- I: Getting Started
- II: Learning HTML
- III: Text
- IV: Links
- V: Formatting Text and Lists
- VI: Tables
- VII: Colour
- VII.5: Images
- VIII: Sound
- IX: Promoting Your Website
Not that this is carved in stone, mind you...
As the last instalment in the “Creating a Web Page” series, this entry will discuss some common design faux pas made by beginners. Please take all of the following with a grain of salt, or with a whole shaker if you like. While business web sites need to worry about their site design since bad design could cost them customers, a personal site is a creative playground and can cheerfully break or ignore these rules – it’s only ultimate purpose is to be fun for both the author and the visitor.
That said, here are some recommendations to avoid a page that blares “newbie” from the outset:
Reduce the loading time for your page
If your page takes too long to load, people will become bored and go elsewhere. Here are some ways to make your page load faster…
- Don't put too many large images on one page. If you really want to, use thumbnails (tiny samples, clicking on the thumbnail takes you to a separate page with the full image) or use something like Netmechanic's Toolbox to reduce the file size of the images. (They do it by eliminating unused layers of colours. They also allow you to see a sample of the alterations before changing the image.)
- Avoid too many moving images on one page. It's distracting as well as slowing down the load time.
- Avoid long pages that require a lot of scrolling. Break up the page with targets or into several smaller pages.
Don't give your viewers eyestrain
- Choose a colour scheme that is easy to read: black on white, red on white, and blue on white are best for large amounts of text. Textured backgrounds (ones that have a repeating pattern) are also very difficult to read text on.
- Choose your font and font size carefully
Consider browser compatibility
Will your page look right or best only when viewed by a particular browser? Test out your page in at least Explorer and Netscape to make sure it looks how you want it to in both.
Use gizmos sparingly
Not everyone can view QuickTime videos or have the plugins1 you want to use. If you are using a plugin, or require your viewer to have software such as a Flash player, tell them this and provide a link for them to download the required plugin.
Be aware of copyright issues
Don't steal peoples' stuff. If in doubt, ask permission.
Organization of your site
Make sure that it's easy for your viewers to find their way around your site by including navigation links ("home", "section1", "section2", etc) on each page. For your own sanity's sake, be sure to keep the site organized for you, too- make the filenames short, logical, and easy to remember.
Check your spelling and grammar
You'd be amazed how many people don't do this. Throw the text into a word document, and let the spell checker do the rest. A couple extra minutes can save a lot of embarrassment.
Miscellaneous nuisances
- Large chunks of blinking or italicised text
- Underlined text mistaken for a link : don’t use underlines for emphasis; use bold or italic or a colour change instead
- Looped sound files that can't be shut off easily
- Long pages or large images that need scrolling (especially left/right scrolling) to view the entire thing
- Lack of interesting content (highly subjective, true...)
[Still to do: add some links to useful resources]