Krug 47

1
Krug 4-7
2
Chapter 4

• It doesnt matter how many times I have to
  click, as long as each click is a mindless,
  unambiguous choice.
• Krugs 2nd Law
• What could be the virtue of allowing more clicks?
• What remains a virtue of requiring very few
  clicks?

3
Chapter 5

• Get rid of half the words on each page, then get
  rid of half of whats left.
• Krugs 3rd Law
• Reduces noise
• Emphasizes useful content
• Makes pages shorter

4
Cut These Words

• Happy talk must die
• Dont try to make small talk
• Convey useful information and lose the rest
• http//www.preferredconcrete.com/index2.html

5
Cut These, Too

• Instructions must die
• Make things obvious or let people muddle
• If you must explain, be briefhttp//www.fabrics.
  net/fabricca.asp

6
Chapter 6 Navigation

• People wont use your Web site if they cant
  find their way around it.
• Navigation how people find their way around
• Two ways to do it
• Browsing
• Searching

7
Navigation

• It is the site
• It can help us find what were looking for
• It can tell us where we are
• It can reveal content
• It can serve as the necessary instructions
• It can create a good impression of the site
• It can make us feel grounded

8
Browsing

• Making ones way through a hierarchy of pages
• How is it done?
• Things to like about it?
• Things not to like?

9
Searching

• Submitting a query to a database of pages
• Formula
• a box
• a button
• search
• Avoid fancy wording, instructions, options

10
Navigation Conventions

• Page name
• Site ID
• Primary navigation (links to content hierarchy)
• You are here indicator
• Local Navigation
• Utilities (links to non-content hierarchy)
• Small text version

11
Persistent Navigation

• Five elements, always there
• Site ID
• A way home
• A way to search
• Primary navigation
• Utilities
• Can be absent on home page and forms

12
Navigation at Level 3

• Not usually as well designed as for levels 1 2
• Its difficult to design
• Designing the 1st 2 levels is time consuming
• Its perceived as less important
• Its hard to get 3 level content while design is
  occurring

13
Page Names

• Every page needs one (not just a highlight in the
  navigation)
• Needs to frame the content that is unique to the
  page
• Needs to be prominent
• Needs to match what is clicked to get to the page

14
You Are Here

• Highlight the current page in the
  navigationdont be subtle
• Put a pointer next to item in navigation list
• Change its text color
• Bold its text
• Reverse its button
• Change the button color

15
Breadcrumbs

• Show the path from the home page to the current
  page
• Placed at top
• Levels separated by gt
• Tiny type
• Labeled with you are here
• Last item boldfaced
• Not a replacement for page names (or other
  aspects of navigation)

16
Tabs

• Self-evident purpose
• Hard to miss
• Visually interesting
• Suggestive of physical space
• Draw them correctly (Have them pop to front on
  selection)
• Color code them
• Have one selected on entering site

17
Trunk Test

• What site is this?
• What page am I on?
• What are the major site sections?
• What are my options here?
• Where am I re rest of site?
• How can I search?

18
Krug Rosenfeld

• Luminary Lecture 5/5/04
• Deconstruction of LOC site
• krugrosenfeld.ram

19
LOC site May 2004 http//web.archive.org/web/20
040401125232/http//www.loc.gov/index.html
20
Current Version of LOC www.loc.gov
21
Chapter 7 Home Page

• Home page design is almost doable
• Demands for required characteristics is large
• Set of people making such demands is large
• Area to work with is small
• Balancing demands is difficult

22
Some Necessary Characteristics

• Site identity and mission
• Site hierarchy
• Search
• Teases for content and features
• Timely content
• Deals (ads, promotions, co-branding)
• Shortcuts
• Registration

23
Other necessary characteristics

• Show visitor how to get to what she/he is looking
  for
• Show her/him things she/he may not be looking for
• Show visitor where to start
• Establish credibility/trust with visitor

24
Things that Add Difficulty

• Its prime real estate and everyone wants some
  (especially above the fold)
• Everyone has an opinion about its design
• It must appeal to all visitors

25
Common Home Page Flaw

• The Big Picture gets lost
• What is this site?
• What do they have here?
• What can I do here?
• Why should I be here?

26
Bad Excuses

• The big picture is too obvious to state
• Explanations will annoy repeat visitors
• Our audience will just get the site
• Our advertising will provide the big picture
• We can use a first time visitor link

27
How to Express the Big Picture

• Tagline
• Welcome blurb
• Use whatever space is needed
• But no more than necessary
• Dont use mission statement (Zzzzz)
• Test with real people if you convey it

28
Taglines

• Concise statement of sites purpose
• 6-8 words long
• Clear and informative
• Convey differentiation and benefit
• Personable, lively, and clever
• Not vague
• Not generic
• Not a motto

29
Home Page Navigation

• Can be different from other pages, which use
  persistent navigation
• Section descriptions
• Different orientations
• More space for identity
• Avoid pulldown menus (most of the time)

30
http//web.archive.org/web/20010519151549/http//w
ww.boeing.com/
31
http//www.boeing.com/