One User Experiencefor Better Usability, Accessibility & SEO

John H Douglass

twitter @JDouglassemail jdouglass@apcoworldwide.comwork APCO Worldwide

Introduction

To truly succeed in usability, accessibility or optimization individually, we need to pay attention to them all.

flickr photo: @photolivier

Usability• “I can’t remember where that report is on our intranet.”

• “Why can’t I upload my video?”

• “It takes me forever to enter my time.”

• “What am I supposed to do next?”

• “The search doesn’t work.”

Accessibility • “I can’t distinguish green and red.”

• “My dad is losing his hearing.”

• “My right hand will be in a cast for two months.”

• “I’m using my iPhone.”

• “I don’t know how to use our intranet.”

Optimization (SEO)• “What’s new on the iPad 2?”

• “I need help with my taxes.”

• “Who has the best seafood in the city?”

• “Who else hates the 5 cents bag tax?”

“[User Experience] is a common awareness, a thread that ties together people from different disciplines who care about good design, and who realize that today’s increasingly complex design challenges require the synthesis of different varieties of design expertise.”

Louis RosenfeldRosenfeld Media

ITERATE

VALI

DAT

E

EMPATHIZ

E

A Broken Experience

ITERATE

VALI

DAT

E

EMPATHIZ

E

2006 - 2008

A Broader Picture

ITERATE

VALI

DAT

E

EMPATHIZ

E

1904 - 1962

ITERATE

VALI

DAT

E

EMPATHIZ

E

How Do We Improve Usability, Accessibility and SEO by Focusing on the Holistic Experience?

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Understand and share another person's perspective, feelings and needs

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Empathize

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Understand & Share

Empathize

53 Definitions

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Perspective, Feelings, Needs

Pitch?

Empathize

Best Processes & Practices 1. Identify a Design Challenge

2. Target Your Audience

3. Choose Your Method

4. Identify Patterns & Themes

5. Use Relevant Nomenclature

6. Accommodate for Flow

7. Use Friendly Menus and Navigation

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Empathize

1. Identify a Design Challenge

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Empathize

2. Target Your Audience

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Empathize

3. Choose Your Method

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Empathize

4. Identify Patterns & Themes

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Empathize

4. Use Relevant Nomenclature

• Use meaningful page names, titles and text

• Create friendly URLS

• Avoid jargon

• Always use appropriate anchor, alt and descriptive text

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Empathize

5. Accommodate for Flow

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

• Stay out of people’s way

• Present few choices

• Give a clear scent of information

• Load pages quickly (review via SP developer dashboard)

Empathize

6. Use Friendly Navigation

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

• Avoid using Flash / Silverlight / Javascript for navigation menus.

• Provide alternatives for interactive elements, when possible.

Empathize

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Evaluate, brainstorm, and prototype ideas to find the best

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Iteration

Collaboration Over Artifacts

Iteration

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Best Process & Practices1. Create Opportunity Areas

2. Brainstorm Solutions

3. Follow the Rules

4. Prototype Ideas

5. (But) Don’t Fall in Love

6. Go Mobile First

7. Be Inclusive & Collaborative

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Iteration

1. Create Opportunity Areas

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Iteration

2. Brainstorm Solutions

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Iteration

3. Follow the Rules

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

1. Defer judgement

2. Encourage wild ideas

3. Build on the ideas of others

4. Be visual

5. Stay focused on the topic

6. One conversation at a time

7. Go for quantity

Iteration

4. Prototype Ideas

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

Iteration

5. Don’t Fall in Love

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

• Prototypes should be rough and rapid

• Disposable tools to help validate and generate ideas

• Not just for interface design

• What question is a prototype answering? Usability, findability, accessibility?

Iteration

6. Go Mobile First

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

• Enhancing the mobile experience can also improve accessibility and vice versa.

• Focus on core actions

• Use scalable design

• Focus on innovation

Iteration

7. Be Inclusive & Collaborative

ITERATE

VALI

DAT

E

EMPATHIZ

E

ITERATE

VALI

DAT

E

EMPATHIZ

E

• Remember the holistic experience

• Include admins, analysts, designers, developers, managers

• Illustrate complexity of issues to stakeholders

• Get buy-in early

Iteration

ITERATE

VALI

DAT

E

EMPATHIZ

E

Fail early and fail often

ITERATE

VALI

DAT

E

EMPATHIZ

E

Validate

Validatephoto: Jimmy Chandler (uxprinciples.com)

Best Processes & Practices 1. Choose Your Test

2. Follow the Analytics Trinity

3. Conduct Evaluative Interviews

4. Include Disabled in Testing

5. Follow Principle of One

6. Go Remote

7. Focus on a Continuum

ITERATE

VALI

DAT

E

EMPATHIZ

E

Validate

1. Choose Your TestTuxedo

ITERATE

VALI

DAT

E

EMPATHIZ

E

Guerilla

Validate

2. Follow the Analytics Trinity

ITERATE

VALI

DAT

E

EMPATHIZ

E

• Experience

• Behavior

• Outcomes

image: Avinash Kaushik

Validate

3. Conduct Evaluative Interviews

ITERATE

VALI

DAT

E

EMPATHIZ

E

• Solicit honest feedback, even if negative

• Improvise on the fly

• Build on ideas. Ask “should”.

Validate

4. Include Disabled in Testing Including at least one person in testing:

• Provides insight into mental models, behaviors & habits

• Transcends “checklist” development mentality

• Brings struggles to life

• Increase buy-in potential

ITERATE

VALI

DAT

E

EMPATHIZ

E

Validate

5. Follow Principle of One

1. Test or talk to one person, at least

2. Go guerilla

3. Fight intimation

4. Leverage the many resources available

ITERATE

VALI

DAT

E

EMPATHIZ

E

Validate

6. Go Remote

ITERATE

VALI

DAT

E

EMPATHIZ

E

Validate

7. Focus on a Continuum

Accessibility, optimization and usability operate on sliding scale.

ITERATE

VALI

DAT

E

EMPATHIZ

E

Validate

APCO IN - Challenge

APCO IN - Solution

APCO IN - Results

“We were under real time pressure – APCO IN was easy to use and we found all the documents really easily.  Without it, we would really have struggled to meet the deadline on what was an important new business prospect.”

APCO Employee

ITERATE

VALI

DAT

E

EMPATHIZ

E

ResourcesIntroduction• Peter Morville’s honeycomb: http://semanticstudios.com/• A Project Guide to User Experience (Unger / Chandler)• Information Architecture for the World Wide Web (Morville / Rosenfeld)• About Face 3: Essentials of Interaction Design (Cooper / Reimann / Cronin)• UXExchange.com / Alltop - User Interface / Quora.com

Empathize • Observing the User Experience (Kuniavsky)• Design of Everyday Things & Emotional Design (Norman)• Card Sorting (Spencer)• Mental Models (Young)

ITERATE

VALI

DAT

E

EMPATHIZ

E

ResourcesIterate • Gamestorming (Gray) (http://www.gogamestorm.com/) • Prototyping: A Practitioner's Guide (Warfel)• Paper Prototyping (Snyder) • Luke Wroblewski’s on “Designing for Mobile First” (http://bit.ly/4j9TXI) • Sketching User Experiences (Buxton) • Mental Notes (http://getmentalnotes.com/)

Validate • Rocket Surgery Made Easy (Krug)• Web Analytics in an Hour a Day (Kaushik)• Just Ask: Integrating Accessibility Throughout Design (http://www.uiaccess.com/

JustAsk/) • Remote testing Google spreadsheet: http://bit.ly/hPNUrl

ITERATE

VALI

DAT

E

EMPATHIZ

E

John H Douglass

twitter @JDouglassemail jdouglass@apcoworldwide.comwork APCO Worldwide

Thank YouRate my presentation! http://spkr8.com/t/5819