Website Usability - Direct Marketing Association NorCal 042016
-
Upload
john-thyfault -
Category
Business
-
view
74 -
download
0
Transcript of Website Usability - Direct Marketing Association NorCal 042016
Website Usability: Making Your Website Hum
Wednesday, April 20, 2016 - 4:30 - 6:00 PM
1
Presented by John Thyfault• Vice President, Search Engine & Social Media Marketing, Beasley
Direct Marketing, Inc.• Instructor, UC Santa Cruz Silcon Valley Extension and
Online Marketing Institute• Instructor, The Direct Marketing Association
Workshop Overview
• What is website usability & why does it matter • Americans with Disabilities Act Implications on usability • Elements of a usable website – Understanding you user – Accessibility – Identity
– Navigation
– Content
• Tools for usability testing ! Mobile Sites
3
About Beasley Direct Marketing
Beasley Direct Marketing, Inc. provides copywriting, design, programming, and consulting services for the following direct marketing channels:
• !"#$%&'())*'#+,'!-./'
• -0#12'*$"#34"5'6"718+5'6"214"$#9121:;'<=,1:75'#+,'>$?#,%#7:'
• 61$"%:'0#12'(@1:&'#+,'@1:&?=:')ABC7/'
• C#+,1+8')#8"'6"718+'(@1:&'#+,'@1:&?=:')ABC7/'
• D?912"'
• E1,"?'• !?%1#2''
• F"971:"'6"718+'
• *#:#2?8G"*?00"$%"'
• >$?%&=$"5'F&1:"')#H"$5'#+,'I=1,"'%?H;'#+,',"718+'
• C17:'>=12,1+8'#+,'*BD'6#:#9#7"'D#+#8"0"+:'
• J"2"0#$K"3+8'
• J$#+72#3?+'L?$'#22'?L':&"'#9?4"'
• -M"%=34"'6#7&9?#$,'J$#%K1+85'B"H?$3+85'#+,'C"#,'<7718+0"+:''
4
About The Instructor
John ThyfaultVice President, Search Engine & Social Media MarketingBeasley Direct MarketingJohn Thyfault has more than 20 years of marketing, sales and product development experience. His knowledge of search engine optimization (SEO), pay per click (PPC) marketing and social media marketing, combined with an in-depth understanding of customer identification, market analysis and segmentation, allows him to deliver high returns on client marketing investment.
Prior to working with Beasley Direct, John was Senior Client Services Project Director at ThirdAge.com, a first wave baby boomer lifestyle and community website. At ThirdAge he successfully led major client sponsorships for Tylenol, American Century, Intel, IBM, and Revlon.
John has led workshops for the Silicon Valley American Marketing Association, the Direct Marketing Association in Northern and Southern California and the Business Marketing Association. He also teaches Search Engine Marketing at University of California, Santa Cruz, Extension in Silicon Valley and is currently leading day long seminars as part of the Online Marketing Summit's 2011 International Tour.
5
What Is Usability
“Usability is the science of making technology work for people.”
Dr. Peter J. Meyers, President of usereffect (www.usereffect.com)
Making the interface between people & technology seamless
6
Dr. Jakob Nielsen’s Definition
Ph.D. computer-human interaction, Sun Microsystems Distinguished Engineer, All Around GuruComponents of Usability
• Learnability• Efficiency• Memorability• Errors• Satisfaction
7
Why Worry About Usability?
It has impact on your bottom lineVisitors• 85% abandon a site due to poor design
• 83% leave because it takes too many clicks to get what they want
• 62% gave up looking for an item while shopping online
• 40% don’t return due to a negative content experience such as hard to use content
Kathy McShea, Usability Testing: Options to Fit Any Budget, Emerald Strategies, 2008
8
Why Worry About Usability?
It has impact on your bottom lineYour Organization’s• 50% of sales are lost because a visitor can’t find
content• 49% of sites fail to comply with simple usability
principles
Kathy McShea, Usability Testing: Options to Fit Any Budget, Emerald Strategies, 2008
9
National Federation of the Blind vs. Target Corporation• NFB brought suit against Target for having its
site, a “place of public accommodation” not accessible to the visually impaired in 2006
• Target settled out of court in 2008 - $6 million fund for claims plus re-working of the site to accommodate the visually impaired
• Taking care of usability up front for everyone is much less expensive than a forced retro-fit
http://www.aseonline.org/epeopleweek/2008/September/TargetSettlesAccessibilitySuitADAAppliesto.aspx
10
Elements Of A Usable WebsiteDefining The User
• Who are your ideal users? You probably will have more than one
• Where are they in the buying cycle?
• What do you want them to do on your site?
• What will they come to your site?
• What parts of the site will they go to?
• How do they interact with your site?
11
Elements Of A Usable WebsiteDefining The User
• Research the user’s goals
• Support call data
• Field surveys
• Speak with current customers
• Look at web traffic patterns
• Look at referring data from search engines and other sites
12
Elements Of A Usable WebsiteDefining The User
• Define your company’s goals on the site• Sales
• Awareness
• Support
• Lead generation
• You can have multiple goals but map them before you start development
13
Elements Of A Usable WebsiteUnderstanding User Interactions
• Knowing how your user interacts with the site is one of the keys to building a friendly site
• Both quantitative and qualitative info is needed • Methods of info gathering• Eye tracking• Web analytics• Focus groups
• Individual user Q&A session
14
Elements Of A Usable WebsiteUnderstanding User Interactions
• Useful tools for understanding user interaction• Google Analytics
• Google Website Optimizer
• Autonomy Promote/Optimost
• ClickTale• UserTesting.com
• CrazyEgg
• Attention Wizard
15
Google AnalyticsIn Page Analytics
16
Understanding User Interaction
17
Eye Tracking - Heat Maps
18
Heat Maps
191919
Mouse Tracking
202020
Understanding User Interaction - Eye Tracking
21
Before After
Attention Wizard - a virtual tool
Elements Of A Usable WebsiteAccessibility
• Site load speed• http://pagespeed.googlelabs.com/pagespeed/
• Adequate text-to-background contrast• Font spacing/easy to read• Flash and add-ons used appropriately• Images have appropriate ALT tags• Site has a custom 404 (page not found) page• Your average user’s browser size, not screen
resolution
22
Sourced from www.usereffect.com’s 25 point website usability checklist, © 2009, 847-708-6007
Elements Of A Usable WebsiteAccessibility
23
Elements Of A Usable WebsiteAccessibility
24
Elements Of A Usable WebsiteAccessibility
25
Elements Of A Usable WebsiteAccessibility
26
Elements Of A Usable WebsiteAccessibility
27
Elements Of A Usable WebsiteAccessibility
28
Elements Of A Usable WebsiteAccessibility
29
Elements Of A Usable WebsiteAccessibility
30With Flash
Elements Of A Usable WebsiteAccessibility
31Without Flash
Elements Of A Usable WebsiteAccessibility
32
33
1024x768
800x600
Elements Of A Usable WebsiteIdentity
• Company logo is prominently placed• Tagline makes a company’s purpose clear• Home page is digestible in 5 seconds• Clear path to company information• Clear path to contact information
34
Sourced from www.usereffect.com’s 25 point website usability checklist, © 2009, 847-708-6007
35
Elements Of A Usable WebsiteNavigation
• Main navigation is easily identifiable• Navigation labels are clear and concise• Number of buttons/links is reasonable• Company logo is linked to home page• Links are consistent and easy to identify• Site search is easy to access
36
Sourced from www.usereffect.com’s 25 point website usability checklist, © 2009, 847-708-6007
37
38
Elements Of A Usable WebsiteContent
• Major headlines are clear & consistent• Critical content and calls to action are above
the fold• Styles & colors are consistent within sections
and across site• Bold, italic and other emphasis is used only
when needed• Ads & pop ups are unobtrusive
39
Sourced from www.usereffect.com’s 25 point website usability checklist © 2009, 847-708-6007
Elements Of A Usable WebsiteContent
• Main copy is concise and explanatory• Copy is designed for readers, browsers and
skimmers• URLs are meaningful & user friendly• Page titles are explanatory (both on page & in
source code)
40
Sourced from www.usereffect.com’s 25 point website usability checklist, © 2009, 847-708-6007
41
42
http://reviews.cnet.com/dslr-buying-guide/http://reviews.cnet.com/dslr-buying-guide/
• Reduce the amount of content • Single column layouts work best • Present that navigation differently •Minimize text entry • Decide whether you need more than 1 mobile site • Design for touchscreen and non-touchscreen users • Take advantage of inbuilt functionality
43
http://www.webcredible.co.uk/user-friendly-resources/web-usability/mobile-guidelines.shtml
Usability & Mobile DevicesA Whole Workshop By Itself
• Google Webmaster Tools are sending out usability notices now
• A defined viewing area (or viewport) that adjusts to the device’s screen size.
• Content that flows in the viewport, so that users don’t have to scroll horizontally or pinch the screen in order to see the entire page.
• Fonts that scale for easier reading on small screens.• Easy-to-touch elements (e.g., buttons) that are well-
spaced from other touch elements.• Visual design and motion driven by mobile-friendly
technology.
44
Usability & Mobile DevicesA Whole Workshop By Itself
Usability & Mobile DevicesA Whole Workshop By Itself
45
464646
Usability & Mobile DevicesA Whole Workshop By Itself
474747
Usability & Mobile DevicesA Whole Workshop By Itself
48
Usability & Mobile DevicesA Whole Workshop By Itself
49
Top, Product PageMid, Product Page
Usability & Mobile DevicesA Whole Workshop By Itself
50
Very Bottom, Product Page
Usability & Mobile DevicesA Whole Workshop By Itself
Do You Want/Need A Responsive Site?
! Ask the question, “Do I want a responsive design(BestBuy) or do I want to have multiple sites(Facebook)?
! Responsive design takes a dedicated team that is very tuned into maintaining and optimizing across multiple platforms
! Separate sites and can allow for platform specific content easier
51
Conclusions
• A well designed, usable website is vital to achieving your online marketing goals
• Balance design and usability• Try to stay within accepted conventions• Design your site with your users and their goals
in mind• Design for multiple devices...... • Don’t get seduced by the latest “Oh, shiny!”
52
53
Some Resources From Jakob Nielsen
Column• Alertbox column on Web usability
• Usability 101: Introduction to Usability• Top 10 Mistakes in Web Design
Books• Eyetracking Web Usability, 2010• Prioritizing Web Usability, 2006• Homepage Usability: 50 Websites Deconstructed, 2001 (113 guidelines for
homepage design)• Designing Web Usability: The Practice of Simplicity, 1999: a quarter million
copies in print; 22 languages• International User Interfaces, 1996 (co-editor with with Elisa del Galdo)• Multimedia and Hypertext: The Internet and Beyond, 1995: second edition of
textbook on linked online information• Coordinating User Interfaces for Consistency, 1989 (editor): still the best
book on how to get a standard look-and-feel (reprint edition published 2002)
54
Jakob Nielsen’s 10 High Profit Redesign Priorities
• Email newsletters• Informative product pages• High quality photography• Product differentiation & comparisons• Support for on page re-ordering of content• Simplified text• Cater to seniors• Gift giving/gift certificate support• Search• User testing
55
Optimize Your Landing Pages With This Guide
•Optimize your landing pages with this 10-page, hands-on guide offering tips on: –Design –Personalization –Offers –Usability
http://www.BeasleyDirect.com/Landing-Pages-Guide.html
56
Learn How to Optimize Your Emails
Learn how to optimize your emails for delivery through spam filters and for consistency across email browsers in this handy guide. Learn how to:
– Get your email around spam filters – Make your email look consistent across
browsers – Optimize your design for blocked images
and preview pane
http://www.BeasleyDirect.com/Email-Audit-Guide.html
57
New Guide on Multichannel Marketing
Hot off the press, this new guide offers tips on how to save money and optimize effectiveness
http://www.BeasleyDirect.com/Multi-Channel-Marketing
58
Thank You!!
John ThyfaultBeasley Direct Marketing, Inc.http://www.beasleydirect.com/search_marketing.html
[email protected]@JohnThyfault
59