暗网禁区

暗网禁区

University Marketing and Communications

How to Create User-Focused Webpages

These are the main points of Steve Krug鈥檚 2013 book:. It's a great read about learning how to put the user first in design and content creation.

FIRST, MOST IMPORTANT RULE

Don鈥檛 make the user think. If you remember nothing else, remember this.听Users spend seconds on a page. Need to make things obvious and easy to use听鈥� especially call to action buttons.

REIN IN YOUR DESIRE TO BE A CREATIVE GENIUS.

鈥淲e鈥檙e thinking great literature while the user is thinking 鈥榖illboard going by at 60 mph.鈥欌�澨齏e want to showcase how talented we are, but the user doesn鈥檛 care. They just want to get to what they鈥檙e looking for.

USER HAS ONLY SO MUCH GOODWILL.

What diminishes goodwill:

  • Hiding details
  • Asking for unnecessary information
  • Not specifiying format requirements (adding dashes in phone numbers, soc sec nos. etc.)
  • Cluttering a page with graphics and images that deter the user's attention away from the main content

What increases goodwill:

  • Making it obvious and easy
  • Answering my questions
  • Saving my steps
  • Tell me what I want to know
  • Make pages printer friendly
  • Help me recover from errors

FACTS OF LIFE ON WEB USAGE

  1. We scan.听 We don鈥檛 read pages. Want to find that button we鈥檙e looking for: to buy, contact, learn more鈥�
  2. We satisfice. We don鈥檛 make optimal choices. We pick the first reasonable option, and then if it doesn鈥檛 work, we hit the back button. No biggie.
  3. We muddle through. We don鈥檛 figure out how things work. We click, back up, click again.

DESIGNING FOR SCANNING

  • Take advantage of conventions. Innovate when you know you have a better idea. Otherwise, use conventional designs -- like button styles, scroll bar, navigation menu on top, etc. Users know the conventional styles. Eliminates confusion. Be consistent, but clarity trumps consistency.
  • 听Create effective visual hierarchies.听
    • Prominence 鈥� most important things are bigger
    • Grouping 鈥� like things go together
    • Nesting 鈥� subsets for each section
  • 听Break up pages into clearly defined areas.
  • 听Make it obvious what鈥檚 clickable.
  • Think about buttons 鈥� shape, location and formatting.
  • Think about touchscreens and how touchscreen users don鈥檛 use cursors (cursors normally change to hand when something is linked).
  • Don鈥檛 use same color for links and non-clickable heds.
  • Eliminate distractions. Start off thinking that everything on the page is noise, and keep only the things that are contributing to your goal.
  • Make content scannable.听
  • Use lots of thoughtfully-written headings to break up copy.
  • Short grafs
  • Use bulleted lists.
  • Bold key terms.

Miscellaneous

  • Number of clicks. There鈥檚 no set rule about the optimal number of times to make a user click. It鈥檚 OK to make them click more as long as they are confident about where they鈥檙e going. To make them confident, you need clearly worded links.

  • Keep mobile in mind. No cursor, no hover, no clue. Same for touch screens.

DESIGNING NAVIGATION

  • Purposes of navigation
    • Tells us what鈥檚 here.
    • Tells us how to use the site.
    • Gives us confidence in the ppl who built it. Make a good first impression.
  • 听Following conventions is important. Helps user know where to find stuff. So it鈥檚 important to make navigation on pages across your site consistent.
  • 听Persistent navigation 鈥� the navigation elements that are on every page (except forms). 听Helps user know they鈥檙e still in same site. Only have to learn it once.
  • 听Show navigation for all potential levels of the site, not just the top pages. People spend time on those lower pages, too. This is important because people need to know where they are on the site and be confident while navigating.
  • 听Name every page. It should match the link, what the user clicked to get there.
  • 听Show me where I am. Highlight where I am in the nav bar. Make it ital., bold, etc.
  • Every page needs to orient them to where they are on the site. They may not enter site thru home page, but still will go there to figure out more about the site and see what else you offer.

Exercise to check on the usability of your page.

Think about being abducted and dropped into the middle of a website. Print out a page and squint at it, try to find:

  • Site id
  • Page name
  • Major sections
  • Local navigation (what are my options)
  • You are here indicators (where am I in the scheme of things)
  • Search function

Other resources