WhatisUsability? - Foster Web Marketing...HowToConductUserTesng...
Transcript of WhatisUsability? - Foster Web Marketing...HowToConductUserTesng...
What is Usability? Making something USEFUL and EASY TO USE
How is Usability Determined? 1. Learnability – how easy to use? Need instruc@ons? 2. Efficiency – how many steps to accomplish the task? 3. Memorability – how easy to remember how to use? 4. Errors – how many mistakes are made? How oEen
happen? How serious? Can the user recover? 5. SaBsfacBon – how do people feel aEer using the
product? Greatly influenced by 1-‐4. People like things they are good at.
If something needs instruc1ons, there is a problem.
Why Focus on Usability? When on the web, users are TASK ORIENTED. They want to: • Find the answer to their ques@on • Buy something
Does your website help them achieve their goals?
Your “perfect client” may miss something on your website in plain site because they are focused on their TASK.
InaGenBonal blindness
Are you uninten1onally hiding important informa1on on your website?
1. Sensory memory – lasts 1 second 2. Short term memory – lasts 1 sec to 1 min 3. long term memory – longer than 1 min (need
to rehearse to remember)
Do NOT Rely on Web Visitor’s Memories!
Deliver informa1on in chunks, so when visitors get distracted they can easily re-‐engage when they return!
Users should never have to ask these ques@ons:
• Where do I start? • Why did they call it that? • Can I click on that? • Where is the naviga@on?
BE DIRECT! Don’t force people to infer what they want. Users get frustrated by was9ng 9me!
Embrace the Obvious
Shorter forms can increase conversion by 160%
Usability Can Improve CONVERSION
Forms: Power of Persuasion
Consider Reward vs. Reciprocity
• Reward condiBon: users asked to complete form before receiving informa@on
• Reciprocity condiBon: users see guidelines first and then asked to provide contact informa@on
Result: Users are two 9mes as likely to complete process with reciprocity
Second Chance Forms • Request the MINIMUM amount of informa@on
first (name, email address) • Provide the informa@on promised – then make
a more compelling offer to get addi@onal informa@on from the user (mailing address, phone number)
Give the User Value to Get More Informa1on
1. Show visited links as a different color
2. To compare different items without memorizing – use tables
3. Horizontal lines discourage scrolling 4. Open PDFs in new browser window 5. Don’t break the “back” budon:
• Power users know to open new tabs on their own.
• Open in the same tab / window even for external sites
Follow Website Standards
You are trying to win your web visitor’s trust. Don’t throw it away with radically different designs for different sec@ons of your website!
Branding: Consistency MaGers
What is fun for you (“ohh I am sooo crea1ve!”) may be frustraBng for your users (“is this the same
website???”)
The Elusive Website FOLD Forget “Above the Fold!” • Different size monitors;
have the “fold” in different places
• With phablets, laplet, tabtop, giant screens, @ny screens, mobile – there is no universal fold placement.
Don’t Forget! Important items s9ll go near the top.
has popularized “infinite scrolling”: • Allows for con@nuous absorp@on of content • Doesn’t interrupt user flow; eliminates the
need to click “next page”
Usability and Infinite Scrolling
• Works best with images • Con: no permanent links
to appended pages • Con: some users like
footers for naviga@on
Usability, Scrolling and Footers • Infinite scrolling misses out on footers • Footers give a visual clue that the page is fully
loaded • Footers provide helpful naviga@on
Infinite Scrolling / Footer Compromise: Allow users to choose to load more content. Enables them to access the footer, where they might look for important informa9on.
Test Your Site Good usability is a compe@@ve advantage: • User saBsfacBon – their ques@ons are
answered • Increased trust – you understand them • Increased traffic – tell others; Google rewards
your site with higher placement on search results
Test compe1tor’s sites – learn from their mistakes!
Look at your analy@cs to decide what to test first: • Pages with a high exit rate • High bounce rate pages • High-‐traffic pages with low conversion?
If you solve the wrong problem, it doesn’t maGer how you solve it.
Remember: you are not the user! Don’t assume you know what your users want.
How Do You Know What to Test?
Who Are Your Users? • New or returning • Novice or advanced • Age • Gender • Specializa@ons/jobs • Online habits and experience • Interests or ac@vi@es Define your “Perfect Client” to target the right
users for your website.
How Many Users to Test? • 4-‐5 users can find most of the problems (85%
of the issues) • They’ll find the biggest, most common issues • You can use more than 5, however more users
means diminishing returns • Best to test with 5, fix the issues and re-‐test
How To Conduct User TesBng Prepare users that you want to know their thoughts – “I want to make this interface beJer. You won’t offend me. If you have sugges9ons please let me know. It’s beJer if you tell me the nega9ve and the posi9ve.”
REMEMBER: people try harder in a tes9ng experience because they don’t want to disappoint you. Ask them when they would have stopped if you weren’t there.
Test one user at a @me and sit with them: • Observe only! Don’t influence the user • Don’t interrupt and sit out of line of site • Make recordings to review later • Ask user to think out loud as they test: • What are you thinking? • Does it seem easy or difficult? • Speak up if you have ques@ons!
• If users ask ques@ons, turn it around and ask “what do you think is the right way?”
How To Conduct User TesBng (cont’d)
Content Usability – Understand Users • There are three types of readers: • Normal • Speed • Skimmers
• At least 79% of users scan text • People read 25% slower onscreen than paper • Only 28% of the words are read • Users skip text they think is less interes@ng or
not relevant
Make Content Easy to Read • Users look for signposts to “interes@ng” content:
Headings Links Bolded words Lists
• Headers: 22-‐23-‐28 pt font to break up content • ALL CAPS IS HARD TO READ DON’T YELL! • Front-‐load sentences & paragraphs for skimmers
Good typography makes content easier to consume!
Audit Your Content 1. What content do you have now? 2. How is the content organized? 3. Who creates the content? 4. Is the content effec@ve? 5. Can the content be found? (SEO principles) 6. Is the content structured with metadata?
Be courageous with content! Ruthlessly cut informa9on from your pages and include only the MOST important items!
Use Content to Build Trust • Add detailed Case Studies to show users
you have handled cases like theirs • Add TesBmonials to show that other
people trust you • Online Reviews confirm a budding feeling
of trust – invest in a review strategy
Build trust with content that resonates with your users and shows you understand their pain
• Only design and build one website that can flex for various types of devices (desktop, tablet, mobile)
• Responsive sites priori@ze how content and site elements display on different size screens
• Our sites have 20-‐50% traffic from mobile • Tablet traffic accounts for 2-‐10% of visits • Mobile traffic spikes on weekends when
people are away from their desks
NEW: Responsive Designs
NEW: Carousels • Carousels showcase a set of content when
there is a limited amount of space. • Examples:
Book / offer carousels Video carousels Badge carousels Tes@monial carousels
• Avoid carousel overload!
NEW: Toast • Toast is a way to display related content when
you scroll to a specified XY site coordinate on • Allows you to show relevant content to a user
based on where on your site they pause to engage.
Further Reading
• “Don't Make Me Think: A Common Sense Approach to Web Usability” by Steve Krug
• www.Useit.com • www.boxesandarrows.com for usability topics • www.whatmakesthemclick.net for 100 things
you should know about people
QuesBons?