User Interface Best Practice

Contents

What it's All About

  • The Organisation
  • Making things easy
    • Achieving a goal
    • Getting information
    • Taking action
  • "Nudging"

The User!!

Structure

  • Site structure
  • Page structure
  • Semantics
  • Separation of content and style

Signposting

  • Where am I
  • Where have I been
  • Where am I going
  • How long will this take

Validation

  • Form instruction
    • How to get it right first time
  • What's gone wrong
  • How do I fix it?
"Your password is the wrong length or has invalid characters"
  • Client vs Server
  • On submit vs Real Time
  • JavaScript & AJAX
  • Feedback on success

Element hiding

  • Complexity vs usability
  • Hiding features
  • Removing features

AJAX and Scripting

  • Hugely powerful
  • Positive and negative effects on UI
  • Validation and Autocomplete
  • Complete UI

Progressive Enhancement

Why?

  • For older browsers
  • For mobile
  • For those with scripts disabled

How?

  • Libraries and frameworks
  • Enabling extra functionality
  • Good structure and design

Who to cater for?

  • 80:20 rule
  • Analytics - know your audience

Accessibility

  • Structure
  • Semantics
  • Additional information
  • Colour
  • Visual-only elements
  • Input/output devices
  • User's experience
    • Language
  • Guidelines and tools

Summing Up

  • Who's it for?
    • The organisation
    • The user
  • What does it achieve?
    • The users' goals
    • Complexity vs Usability
    • How do we do it?
      • Planning and structure
      • Technology
      • Testing