UX fundamentals mat-153-web design 1

Intro to UX

Design for usabiliy

  • all your webpages must provide clear answers to the following questions with info easily found above the fold:
    • what are you offering?
    • why should I pick you?
    • what do you want me to do now and/or when I leave the site?
  • Nothing else on the page should distract from this intention or the less likely it will be followed.
  • create visual hierarchies
    • most important things higher up and stand out more
    • group similar things together
  • layout pages into clearly defined areas
    • don't make people have to think!
  • eliminate distractions
    • graphics
      • images must be used only to help illustrate content
      • adverts should be relevant
    • text
      • concise (half of what's in print layout)
      • legible type (san serif)
      • make obvious what is clickable
      • format content to support scanning
  • consistency
    • same layout/navigation/type/colors
    • vistitors learn how to use site faster and can then focus on content
  • follow website conventions
    • use same elements in the same place as major sites do, avoid same elements they avoid
    • know your audience

Conversion centered design

  • attention
    • what do you want your audience to do?
    • does everything on your page communicate this?
    • eliminate anything that distacts from this
  • context
    • are you giving your audience what they are expecting?
    • must be consistent from every source you site visitors come from
  • clarity
    • in 5 seconds, is it clear what the page is about?
    • is it clear what you want your user to do and where they can do it?
  • congruence
    • does everything on the website communicate the desired conversion intention?
  • credibility
    • does your webpage appear trustworthy?
    • does it appear that you can deliver what you promise?
  • closing
    • use positive messages close to desired click region
    • remove anything that may inhibit clicking
  • continuance
    • once a desired action has been completed, clearly communicate what will happen next
    • provide additional resources to keep visitor engaged

What causes visitors to leave?

  • hard to understand names in navigation (technical, puns, plays on words)
  • using techincal jargon instead of layman's terms
  • too much text
  • too much advertising
  • Biggest Mistakes in Web Design