PC Alamode
Reviews Columns Features Archives

 PC Alamode

The seven best web design tips

Susan Ives is a web developer

1: View Source  
    Surgeons get their start dissecting frogs. Web designers get their start dissecting pages. You can look at the source HTML code for most web pages by clicking on view | page source. John Daigle gave me this tip about fifteen minutes after I started designing, and I use it constantly. Find something you like and donít know how to do, look at the source and learn from it. 
2: Check on other systems, browsers, screens 
    I often use the analogy that HTML is like music. Beethoven wrote the music for his 9th Symphony and probably envisioned it played by the Berlin Philharmonic. Your Uncle Freddie could pick up the same sheet music and plunk it on his ukulele. Same music, different instrument. On the World Wide Web, the instrument is every computer that calls up your web page for viewing. Everything will affect the way the page looks. It will look slightly different in Netscape and Internet Explorer. It will look different at 640x480 resolution than it will at 800x600. It will look different on a PC and a MAC. Some drag-and-drop HTML editors (Netscape Composer and FrontPage are infamous for this) may point to a graphic using an absolute reference to your hard drive. It will show up fine on your computer, but display a broken graphic icon on everyone elseís. You might have used an unusual font. A plugin might be missing. The Java might not function, or cause a security error. Whenever you have the chance, look at your site on other computers and troll for errors, malfunctions and just plain ugly. Itís worth it.
3: Look Over Some Shoulders 
    Before I let a site go public I invite a few beta-testers to have a look. Ideally, I will watch them use the page and see how they navigate around it ó my husband makes an excellent crash-test dummy. Do they understand what all of the buttons, icons and clickable graphics mean and where they lead? Do frames and popups confuse them? If you ask them to find something, can they follow your organization scheme or are they clueless? Do they know when to use the scrollbar? In technical terms, this is a test of your information architecture. Confused visitors donít return.
4: Keep it Small 
    Now that fast Internet connections are becoming the norm there is a tendency to bulk-up web pages. Restrain yourself. Make your entry-level page ó index.html ó lightening fast. At the most, 30KB, including all of the graphics. As visitors delve deeper into your sight they might be willing to wait longer for a stunning photo, but donít bet on it. 
5: Spend Time Planning 
    I have found that an hour spent planning a site will save me five hours in false starts and repairs. Before you begin, do a storyboard, or sketch, of the site. Decide what you will name the files. Determine if you will have subdirectories, and if so, what will go into them. Remember how your 9th grade teacher taught you to outline a term paper? She was right.
6: Gutenberg Was Right 
    Books are printed with black text on a white page for a reason. Itís legible. Screens are harder to read than books ó experts estimate that the legibility is about 20 percent less. If you have large areas of text, bigger than a headline, use very dark text on a very light background. Your viewers will thank you.
7: Leave Room for Growth 
    The beauty of the World Wide Web is its flexibility. You can update a page in a minute. Donít make your design so tight and structured that you canít easily change it, add categories and buttons, change text, insert a link or a add couple of new pages. 

Copyright© 1996-2010
Alamo PC Organization, Inc.
San Antonio, TX USA