principles of good web design hint: it’s not about the technology

47
Principles of Good Web Design Hint: It’s not about the technology.

Upload: rolf-mills

Post on 11-Jan-2016

215 views

Category:

Documents


1 download

TRANSCRIPT

Page 1: Principles of Good Web Design Hint: It’s not about the technology

Principles of Good Web Design

Hint: It’s not about the technology.

Page 2: 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

Page 3: Principles of Good Web Design Hint: It’s not about the technology

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

3© 2008, James P. Gleason

Page 4: Principles of Good Web Design Hint: It’s not about the technology

Expectations to expect

User Designer Client

A good Web designer must be an advocate for the user.

Be a Digital Ombudsman!

4c 2008, James P. Gleason

Page 5: Principles of Good Web Design Hint: It’s not about the technology

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.

Page 6: Principles of Good Web Design Hint: It’s not about the technology

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.

Page 7: Principles of Good Web Design Hint: It’s not about the technology

What makes a Web site desirable? Excellent ease of use

Consistent format Intuitive navigation Loads fast Works reliably on any platform

Page 8: Principles of Good Web Design Hint: It’s not about the technology

Who’s the audience?

Readers Community leaders Advertisers

Page 9: Principles of Good Web Design Hint: It’s not about the technology
Page 10: Principles of Good Web Design Hint: It’s not about the technology

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.

10c 2008, James P. Gleason

Page 11: Principles of Good Web Design Hint: It’s not about the technology

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.

11c 2008, James P. Gleason

Page 12: Principles of Good Web Design Hint: It’s not about the technology

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.

12c 2008, James P. Gleason

Page 13: Principles of Good Web Design Hint: It’s not about the technology

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?

13c 2008, James P. Gleason

Page 14: Principles of Good Web Design Hint: It’s not about the technology

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?

14c 2008, James P. Gleason

Page 15: Principles of Good Web Design Hint: It’s not about the technology

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.

15c 2008, James P. Gleason

Page 16: Principles of Good Web Design Hint: It’s not about the technology

c 2008, James P. Gleason 16

Page 17: Principles of Good Web Design Hint: It’s not about the technology

c 2008, James P. Gleason 17

Page 18: Principles of Good Web Design Hint: It’s not about the technology

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?

18c 2008, James P. Gleason

Page 19: Principles of Good Web Design Hint: It’s not about the technology

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?

19c 2008, James P. Gleason

Page 20: Principles of Good Web Design Hint: It’s not about the technology

9. Sweat the details. Nothing destroys credibility faster than obvious

mistakes and carelessness. Check your information and proof your copy. Make it a habit.

20c 2008, James P. Gleason

Page 21: Principles of Good Web Design Hint: It’s not about the technology

10. Be true to your template. Be consistent. Don’t change your style

randomly. Avoid surprises.

21c 2008, James P. Gleason

Page 22: Principles of Good Web Design Hint: It’s not about the technology

Design

11. Avoid eye candy. Stay away from gratuitous displays of self-

indulgent Photoshop and programming chops. Don’t emphasize everything. Leave the dazzle to gamers.

22c 2008, James P. Gleason

Page 23: Principles of Good Web Design Hint: It’s not about the technology

c 2008, James P. Gleason 23

Page 24: Principles of Good Web Design Hint: It’s not about the technology

Ugly site

c 2008, James P. Gleason 24

Page 25: Principles of Good Web Design Hint: It’s not about the technology

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.

25c 2008, James P. Gleason

Page 26: Principles of Good Web Design Hint: It’s not about the technology

c 2008, James P. Gleason 26

Page 27: Principles of Good Web Design Hint: It’s not about the technology

c 2008, James P. Gleason 27

Page 28: Principles of Good Web Design Hint: It’s not about the technology

c 2008, James P. Gleason 28

Page 29: Principles of Good Web Design Hint: It’s not about the technology

c 2008, James P. Gleason 29

Page 30: Principles of Good Web Design Hint: It’s not about the technology

13. Please, no splash screens. They don’t enhance communication. They waste time and development resources.

30c 2008, James P. Gleason

Page 31: Principles of Good Web Design Hint: It’s not about the technology

c 2008, James P. Gleason 31

Page 32: Principles of Good Web Design Hint: It’s not about the technology

c 2008, James P. Gleason 32

Page 33: Principles of Good Web Design Hint: It’s not about the technology

c 2008, James P. Gleason 33

Page 34: Principles of Good Web Design Hint: It’s not about the technology

c 2008, James P. Gleason 34

Page 35: Principles of Good Web Design Hint: It’s not about the technology

c 2008, James P. Gleason 35

Page 36: Principles of Good Web Design Hint: It’s not about the technology

c 2008, James P. Gleason 36

Page 37: Principles of Good Web Design Hint: It’s not about the technology

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!

37c 2008, James P. Gleason

Page 38: Principles of Good Web Design Hint: It’s not about the technology

Here’s why.

38c 2008, James P. Gleason

Page 39: Principles of Good Web Design Hint: It’s not about the technology

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.

39c 2008, James P. Gleason

Page 40: Principles of Good Web Design Hint: It’s not about the technology

16. Write for the medium. Avoid “shovelware.” Know when enough is enough. Make navigation your friend.

40c 2008, James P. Gleason

Page 41: Principles of Good Web Design Hint: It’s not about the technology

17. Good writing still counts. There’s no excuse for sloppy or poor craft. Avoid jargon, usually. Avoid clichés like the plague.

41c 2008, James P. Gleason

Page 42: Principles of Good Web Design Hint: It’s not about the technology

18. Give credit where credit is due. Always credit photos, music, etc. Don’t forget copyrights.

42c 2008, James P. Gleason

Page 43: Principles of Good Web Design Hint: It’s not about the technology

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.

43c 2008, James P. Gleason

Page 44: Principles of Good Web Design Hint: It’s not about the technology

20. Avoid trendiness. No horizontal scrolling, auto-play music, etc. Don’t design for other designers. Never be clever for clever’s sake.

44c 2008, James P. Gleason

Page 45: Principles of Good Web Design Hint: It’s not about the technology

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.

45c 2008, James P. Gleason

Page 46: Principles of Good Web Design Hint: It’s not about the technology

A good Web site must attract viewers.

Remember:

The most important thing is not getting people to visit the Web site.

Page 47: Principles of Good Web Design Hint: It’s not about the technology

The most important thing is getting them to return to the Web site.