Transcript Principles of Good Web Design

Principles of Good Web Design
Hint: It’s not about the technology.
The Dirty Little Secret

The key elements are the same as other
communication processes



Audience
Message / Content
Delivery / Vehicle
What is user-centered web design?





Appropriate for user needs and
circumstances
Appropriate for the content
Loads fast
Looks good
Leads to a positive communication
experience
© 2008, James P. Gleason
3
Expectations to expect





User
Designer
Client
A good Web designer must be an advocate
for the user.
Be a Digital Ombudsman!
c 2008, James P. Gleason
4
What makes a Web site desirable?

Any Web-based application must be as good
or better than its alternative to succeed.

Desired content




Current news – immediacy
Archive of old news
Community information – notices, forums, etc.
Access to other info – weather, national news, etc.
What makes a Web site desirable?

Reliable content




Quality writing, editing, etc.
Up-to-date information
Solid execution – no broken links, photos, etc.
Desired level of interactivity



Hotlinks within stories
Streaming video / audio
Email links to editor, writers, etc.
What makes a Web site desirable?

Excellent ease of use




Consistent format
Intuitive navigation
Loads fast
Works reliably on any platform
Who’s the audience?



Readers
Community leaders
Advertisers
21 Tips to a Better Website
1. The audience is king.

Only they get to decide if the site works.
All you can do is increase the odds.
Take into account differences in experience,
taste, mood, training, background, language,
location, culture…

You can’t make a fish bite the hook.


c 2008, James P. Gleason
10
2. Wait, isn’t content the king?


The only reason to create a web site is to
communicate its content.
Everything should contribute toward that goal.
c 2008, James P. Gleason
11
3. Trust your gut.



You know if it doesn’t feel right even if you don’t
know why.
That’s the first step toward fixing the issue.
There are always resources to solve the
problem, but it helps to define the problem.
c 2008, James P. Gleason
12
4. Remember that a web site is a tool.

Unless you’re Disney, it’s not really about
entertainment.

Why do people visit the site?
How do they use it when they visit?
What will bring them back?

What does the content demand?


c 2008, James P. Gleason
13
Infrastructure
5. Listen to your content.





It’ll tell you how to design it.
What should the tone of the site be?
How much should you include?
How should you organize it?
Should you include external links? To what?
c 2008, James P. Gleason
14
6. Navigation is key.



It doesn’t exist if they can’t find it.
External navigation vs. internal navigation
Allow for multiple paths to the payoff.
c 2008, James P. Gleason
15
c 2008, James P. Gleason
16
c 2008, James P. Gleason
17
7. Remember the big picture.
Usually, there’s a bigger marketing effort.
How will your site fit into the overall plan?
What else is in the ensemble?






Brochures?
Ads?
Presentations or events?
c 2008, James P. Gleason
18
8. Tie it all in.



Maybe your site shouldn’t be unique.
How should you repurpose other materials?
If the audience and message are the same, why
should the Web site look different?
c 2008, James P. Gleason
19
9. Sweat the details.



Nothing destroys credibility faster than obvious
mistakes and carelessness.
Check your information and proof your copy.
Make it a habit.
c 2008, James P. Gleason
20
10. Be true to your template.


Be consistent. Don’t change your style
randomly.
Avoid surprises.
c 2008, James P. Gleason
21
Design
11. Avoid eye candy.



Stay away from gratuitous displays of selfindulgent Photoshop and programming chops.
Don’t emphasize everything.
Leave the dazzle to gamers.
c 2008, James P. Gleason
22
c 2008, James P. Gleason
23
Ugly site
c 2008, James P. Gleason
24
12. Don’t be afraid of white space.



Use white space for emphasis.
You’re not printing, so pixels are cheap.
Take the space you need.
c 2008, James P. Gleason
25
c 2008, James P. Gleason
26
c 2008, James P. Gleason
27
c 2008, James P. Gleason
28
c 2008, James P. Gleason
29
13. Please, no splash screens.


They don’t enhance communication.
They waste time and development resources.
c 2008, James P. Gleason
30
c 2008, James P. Gleason
31
c 2008, James P. Gleason
32
c 2008, James P. Gleason
33
c 2008, James P. Gleason
34
c 2008, James P. Gleason
35
c 2008, James P. Gleason
36
14. Death to clipart, blinking, animations, etc.



They look amateurish and unprofessional.
They’re never as targeted as you would like.
Don’t use them, I’m begging you!
c 2008, James P. Gleason
37
Here’s why.
c 2008, James P. Gleason
38
Good habits
15. Quality in all things.


Design for what you want to be, not what you are.
Use the best copy, graphics and photos you can
afford.
c 2008, James P. Gleason
39
16. Write for the medium.



Avoid “shovelware.”
Know when enough is enough.
Make navigation your friend.
c 2008, James P. Gleason
40
17. Good writing still counts.



There’s no excuse for sloppy or poor craft.
Avoid jargon, usually.
Avoid clichés like the plague.
c 2008, James P. Gleason
41
18. Give credit where credit is due.


Always credit photos, music, etc.
Don’t forget copyrights.
c 2008, James P. Gleason
42
19. Date your content and update it regularly.


Otherwise, how will they know if it’s current?
Think of your site as a living breathing document.
c 2008, James P. Gleason
43
20. Avoid trendiness.



No horizontal scrolling, auto-play music, etc.
Don’t design for other designers.
Never be clever for clever’s sake.
c 2008, James P. Gleason
44
Finally…
21. Think like a user.


We know more than we think we do.
Our instinct may be our most powerful Web
development tool of all.
c 2008, James P. Gleason
45
A good Web site must attract viewers.

Remember:
The most important thing is not
getting people to visit the Web site.
The most important thing is getting
them to return to the Web site.