Top 11 usability recommendations for 2011
Upcoming SlideShare
Loading in...5
×
 

Top 11 usability recommendations for 2011

on

  • 1,273 views

User Experience (UX) professionals know that audiences are demanding ever increasing levels of sophistication from your websites. ...

User Experience (UX) professionals know that audiences are demanding ever increasing levels of sophistication from your websites.

However, before you invest big bucks in the latest [social/mobile/local] solution, let's make sure your site passes 11 basic tests for usability.

A majority of sites still make Usability 101 mistakes. Are you leaving customers frustrated or losing business because of errors that can be fixed hours or days?

Join our webinar and take our 2011 Usability Test to find out how you score (then call us to help with the social/mobile/local project).

Statistics

Views

Total Views
1,273
Views on SlideShare
1,270
Embed Views
3

Actions

Likes
0
Downloads
13
Comments
0

2 Embeds 3

http://www.linkedin.com 2
https://www.linkedin.com 1

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

CC Attribution License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Top 11 usability recommendations for 2011 Top 11 usability recommendations for 2011 Presentation Transcript

  • Top 11 Usability Recommendationsfor 2011
    June 10, 2011
  • Agenda
    Introduction
    Top 11 Usability Issues
    Q & A with your sites
    Interactive Technology Solutions
  • Introducing Bridgeline Digital
    We help our customers achieve their key initiatives by leveraging web technologies
    The Building Blocks For Web Success
    Interactive Technology Solutions
  • Introducing our Speakers
    John Whalen
    VP User Experience
    Brian Lantz
    EVP & General Manager
    Interactive Technology Solutions
  • Webinar Series
    The Secrets to a Great Web Redesign: Getting the ROI from your investmentThu, Jun 16, 2011 10:00 AM - 11:00 AM EDT
    ROI of Web Engagement Management; iAPPS DemonstrationThu, Jun 23, 2011 1:00 PM - 2:00 PM EDT
    Interactive Technology Solutions
  • ForeSee Satisfaction Scores Are Not Improving
    Interactive Technology Solutions
  • Maybe we need…
    Interactive Technology Solutions
  • Or maybe we need… SoLoMo?
    Interactive Technology Solutions
  • Let’s not forget what we are we trying to avoid?
    Interactive Technology Solutions
  • Let’s not forget what we are we trying to avoid?
    Interactive Technology Solutions
  • Time to revisit Usability 101
    Navigation
    Content
    Interaction
    Visual Design
    …And now on to the Top 11…
    Interactive Technology Solutions
  • 1. Provide strong cues about where I am on site
    Interactive Technology Solutions
  • 1. Provide strong cues about where I am on site
    • Top Nav + SelectedNav visual cue
    • Breadcrumbs
    • Secondary Nav location
    • Page Title Prominent
    Interactive Technology Solutions
  • 2. Effective Search + Refine
    Interactive Technology Solutions
  • 2. Effective Search + Refine
    • Location of search box
    • Search results ordered by relevance
    • No extraneous information on page
    • Provide option to “Search + Refine”
    Interactive Technology Solutions
  • 3. Make it clear where I can and can’t click (affordances)
    Interactive Technology Solutions
  • 3. Make it clear where I can and can’t click (affordances)
    Interactive Technology Solutions
  • 3. Make it clear where I can and can’t click (affordances)
    Interactive Technology Solutions
  • 4. Support www.____.com and ___.com
    Interactive Technology Solutions
  • 5. Make it easy to navigate to the “Top Tasks” on your site
    Interactive Technology Solutions
  • 6. Create a clear visual hierarchy
    Interactive Technology Solutions
  • 6. Create a clear visual hierarchy
    Pretty good…
    Interactive Technology Solutions
  • 6. Create a clear visual hierarchy
    Well…
    Interactive Technology Solutions
  • 6. Create a clear visual hierarchy
    I’ve never seen all three done correctly…
    Use multiple cues:
    Visual Contrast
    Color
    Shape
    Interactive Technology Solutions
  • 7. Make Content Easy to Scan
    Classic “F-pattern” when scanning
    Interactive Technology Solutions
  • 7. Make Content Easy to Scan
    Not easy to scan…no hierarchy, no contrast.
    Interactive Technology Solutions
  • 7. Make Content Easy to Scan
    What do you think?
    Interactive Technology Solutions
  • 7. Make Content Easy to Scan
    Middle section isn’t bad…
    Interactive Technology Solutions
  • 7. Make Content Easy to Scan
    …except it keeps going and going.
    Interactive Technology Solutions
  • 8. Make content a reasonable size, font and contrast
    Am I that old, or is that a small font!
    Interactive Technology Solutions
  • 8. Make content a reasonable size, font and contrast
    Center column pretty good, if there wasn’t so much else on the page…
    Interactive Technology Solutions
  • 9. Create well structured form and provide clear assistance
    Let’s consider this in detail – it’s a million dollar page for Geico.
    Interactive Technology Solutions
  • 9. Create well structured form and provide clear assistance
    • Good that they provide help and a phone number.
    • Let me know where problem is, what problem is, example of how to fix.
    • Provide error message where problem is.
    • Don’t let the names of the fields disappear as I type the information.
    Interactive Technology Solutions
  • 10. Make sure you’re covering SEO 101
    Really nicely done…
    • Have a strong, meaningful page title on each page
    • Use H1, H2 tags for key content.
    Interactive Technology Solutions
  • 11. Pass SEO 101: link, title, H1/H2 tags
    …so what happened?
    • Have a strong, meaningful page title on each page.
    • Have a human-understandable linking structure.
    • Use H1, H2 tags for key content.
    Interactive Technology Solutions
  • 11. Accessibility 101: Alt tags, Alt Nav, Degrades Gracefully
    • Each image should have an alt tag.
    • Navigation, major titles should be text.
    • Ensure you can use alternate means of entry (e.g., keyboard only OR iPad)
    Interactive Technology Solutions
  • 11. Accessibility 101: Alt tags, Alt Nav, Degrades Gracefully
    • Took 115 tab presses & 4 enter presses but I got to this page.
    • Then, enter won’t work on ADD TO CART!!!!
    • No image alt tags.
    • Do accessibility for those in need, and those with mobile!
    Interactive Technology Solutions
  • Top 11 Critical Usability Tips for 2011
    Provide strong cues about where I am on site.
    Effective search + refine.
    Make it clear where I can and can’t click (affordances).
    Support www.____.com and ___.com.
    Make it easy to navigate to the “Top Tasks” on your site.
    Create a clear visual hierarchy (visual contrast, size, shape).
    Make content easy to scan.
    Make content a reasonable size, font and contrast.
    Create well structured form and provide clear assistance
    Pass SEO 101: link, title, H1/H2 tags
    Accessibility 101: Alt tags, Alt Nav, Degrades Gracefully
    Interactive Technology Solutions
  • Thank you
    John Whalen
    jwhalen@blinedigital.com
    @johnwhalen
    Brian Lantz
    blantz@blinedigital.com
    http://www.bridgelinedigital/resource-center
    Interactive Technology Solutions