| |
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.
|
|
