Submit Search
Upload
An introduction to Usability
•
41 likes
•
14,170 views
Erlend Debast
Follow
A basis introduction to usability with examples & how to's.
Read less
Read more
Design
Report
Share
Report
Share
1 of 65
Download now
Download to read offline
Recommended
Logos & standards
Logos & standards
Philip Tan
Web usability
Web usability
8raystech
Landing Pages Basics: What, Why and How
Landing Pages Basics: What, Why and How
Kate Kotenko Lengold
Redesigning Deliveroo – Simon Rohrbach, Deliveroo
Redesigning Deliveroo – Simon Rohrbach, Deliveroo
JAM London
Achieving Beautiful Typography in eBooks
Achieving Beautiful Typography in eBooks
digitalbindery
Debbie Goulding Makeup Artist Brand Style Guide
Debbie Goulding Makeup Artist Brand Style Guide
Cassie Martinez Pastorfide
CSS3 Media Queries: Mobile Elixir or CSS Snake Oil
CSS3 Media Queries: Mobile Elixir or CSS Snake Oil
jameswillweb
Neuro Web Design: What makes them click
Neuro Web Design: What makes them click
Susan Weinschenk
Recommended
Logos & standards
Logos & standards
Philip Tan
Web usability
Web usability
8raystech
Landing Pages Basics: What, Why and How
Landing Pages Basics: What, Why and How
Kate Kotenko Lengold
Redesigning Deliveroo – Simon Rohrbach, Deliveroo
Redesigning Deliveroo – Simon Rohrbach, Deliveroo
JAM London
Achieving Beautiful Typography in eBooks
Achieving Beautiful Typography in eBooks
digitalbindery
Debbie Goulding Makeup Artist Brand Style Guide
Debbie Goulding Makeup Artist Brand Style Guide
Cassie Martinez Pastorfide
CSS3 Media Queries: Mobile Elixir or CSS Snake Oil
CSS3 Media Queries: Mobile Elixir or CSS Snake Oil
jameswillweb
Neuro Web Design: What makes them click
Neuro Web Design: What makes them click
Susan Weinschenk
Responsive Web Design & Workflows for Todays Web (THE UX-MEN at The Hive, Hon...
Responsive Web Design & Workflows for Todays Web (THE UX-MEN at The Hive, Hon...
Holger Bartel
The Ultimate Guide to Font Pairing
The Ultimate Guide to Font Pairing
Guy Kawasaki
Wireframes for WordPress
Wireframes for WordPress
John Housholder
Typography in Web Design (WordCamp Toronto 2014)
Typography in Web Design (WordCamp Toronto 2014)
Jasmine Vesque
Designing for a Better User Experience
Designing for a Better User Experience
BuiltByHQ
Up to Speed on HTML 5 and CSS 3
Up to Speed on HTML 5 and CSS 3
M. Jackson Wilkinson
Website Architecture Presentation from Web Strategy Workshops
Website Architecture Presentation from Web Strategy Workshops
Charles Edmunds
Digital Accessibility
Digital Accessibility
Charlotte (Bobi) Robson
International seo and content clustering
International seo and content clustering
Enterprise Ireland
International seo and content clustering | John Caldwell | CreatorSEO
International seo and content clustering | John Caldwell | CreatorSEO
Enterprise Ireland
International Seo and Content Clustering
International Seo and Content Clustering
Eoin O Siochru
Building a Powerful Small Business Website
Building a Powerful Small Business Website
Real Time Web Marketing
Enterprise Ireland presentation - International seo and content June 2018
Enterprise Ireland presentation - International seo and content June 2018
John Caldwell
Going Global Without Going Insane
Going Global Without Going Insane
Kevin Potts
Adobe AEM - Global SEO
Adobe AEM - Global SEO
Eli Schwartz
BcnDevCon13 - No Designer? No Problem!
BcnDevCon13 - No Designer? No Problem!
Edin Kapic
International SEO and Content Silos | John Caldwell | CreatorSEO
International SEO and Content Silos | John Caldwell | CreatorSEO
Enterprise Ireland
nternational SEO and Content Clustering | John Caldwell | CreatorSEO / ABC Di...
nternational SEO and Content Clustering | John Caldwell | CreatorSEO / ABC Di...
Enterprise Ireland
SEO + UX + CRO : les bonnes pratiques de 2022
SEO + UX + CRO : les bonnes pratiques de 2022
Semrush France
International Search Engine Optimisation - SEO
International Search Engine Optimisation - SEO
Enterprise Ireland
International SEO | John Caldwell | CreatorSEO
International SEO | John Caldwell | CreatorSEO
Enterprise Ireland
Your website roadmap
Your website roadmap
Raaker
More Related Content
Viewers also liked
Responsive Web Design & Workflows for Todays Web (THE UX-MEN at The Hive, Hon...
Responsive Web Design & Workflows for Todays Web (THE UX-MEN at The Hive, Hon...
Holger Bartel
The Ultimate Guide to Font Pairing
The Ultimate Guide to Font Pairing
Guy Kawasaki
Wireframes for WordPress
Wireframes for WordPress
John Housholder
Typography in Web Design (WordCamp Toronto 2014)
Typography in Web Design (WordCamp Toronto 2014)
Jasmine Vesque
Designing for a Better User Experience
Designing for a Better User Experience
BuiltByHQ
Up to Speed on HTML 5 and CSS 3
Up to Speed on HTML 5 and CSS 3
M. Jackson Wilkinson
Viewers also liked
(6)
Responsive Web Design & Workflows for Todays Web (THE UX-MEN at The Hive, Hon...
Responsive Web Design & Workflows for Todays Web (THE UX-MEN at The Hive, Hon...
The Ultimate Guide to Font Pairing
The Ultimate Guide to Font Pairing
Wireframes for WordPress
Wireframes for WordPress
Typography in Web Design (WordCamp Toronto 2014)
Typography in Web Design (WordCamp Toronto 2014)
Designing for a Better User Experience
Designing for a Better User Experience
Up to Speed on HTML 5 and CSS 3
Up to Speed on HTML 5 and CSS 3
Similar to An introduction to Usability
Website Architecture Presentation from Web Strategy Workshops
Website Architecture Presentation from Web Strategy Workshops
Charles Edmunds
Digital Accessibility
Digital Accessibility
Charlotte (Bobi) Robson
International seo and content clustering
International seo and content clustering
Enterprise Ireland
International seo and content clustering | John Caldwell | CreatorSEO
International seo and content clustering | John Caldwell | CreatorSEO
Enterprise Ireland
International Seo and Content Clustering
International Seo and Content Clustering
Eoin O Siochru
Building a Powerful Small Business Website
Building a Powerful Small Business Website
Real Time Web Marketing
Enterprise Ireland presentation - International seo and content June 2018
Enterprise Ireland presentation - International seo and content June 2018
John Caldwell
Going Global Without Going Insane
Going Global Without Going Insane
Kevin Potts
Adobe AEM - Global SEO
Adobe AEM - Global SEO
Eli Schwartz
BcnDevCon13 - No Designer? No Problem!
BcnDevCon13 - No Designer? No Problem!
Edin Kapic
International SEO and Content Silos | John Caldwell | CreatorSEO
International SEO and Content Silos | John Caldwell | CreatorSEO
Enterprise Ireland
nternational SEO and Content Clustering | John Caldwell | CreatorSEO / ABC Di...
nternational SEO and Content Clustering | John Caldwell | CreatorSEO / ABC Di...
Enterprise Ireland
SEO + UX + CRO : les bonnes pratiques de 2022
SEO + UX + CRO : les bonnes pratiques de 2022
Semrush France
International Search Engine Optimisation - SEO
International Search Engine Optimisation - SEO
Enterprise Ireland
International SEO | John Caldwell | CreatorSEO
International SEO | John Caldwell | CreatorSEO
Enterprise Ireland
Your website roadmap
Your website roadmap
Raaker
Becoming a-filemaker-designer-in-60-minutes
Becoming a-filemaker-designer-in-60-minutes
DB Services
J105 Web Design
J105 Web Design
Chris Snider
Creating a World-class Translation Strategy
Creating a World-class Translation Strategy
Jose Palomares
International SEO and Content Silos | John Caldwell | CreatorSEO
International SEO and Content Silos | John Caldwell | CreatorSEO
Enterprise Ireland
Similar to An introduction to Usability
(20)
Website Architecture Presentation from Web Strategy Workshops
Website Architecture Presentation from Web Strategy Workshops
Digital Accessibility
Digital Accessibility
International seo and content clustering
International seo and content clustering
International seo and content clustering | John Caldwell | CreatorSEO
International seo and content clustering | John Caldwell | CreatorSEO
International Seo and Content Clustering
International Seo and Content Clustering
Building a Powerful Small Business Website
Building a Powerful Small Business Website
Enterprise Ireland presentation - International seo and content June 2018
Enterprise Ireland presentation - International seo and content June 2018
Going Global Without Going Insane
Going Global Without Going Insane
Adobe AEM - Global SEO
Adobe AEM - Global SEO
BcnDevCon13 - No Designer? No Problem!
BcnDevCon13 - No Designer? No Problem!
International SEO and Content Silos | John Caldwell | CreatorSEO
International SEO and Content Silos | John Caldwell | CreatorSEO
nternational SEO and Content Clustering | John Caldwell | CreatorSEO / ABC Di...
nternational SEO and Content Clustering | John Caldwell | CreatorSEO / ABC Di...
SEO + UX + CRO : les bonnes pratiques de 2022
SEO + UX + CRO : les bonnes pratiques de 2022
International Search Engine Optimisation - SEO
International Search Engine Optimisation - SEO
International SEO | John Caldwell | CreatorSEO
International SEO | John Caldwell | CreatorSEO
Your website roadmap
Your website roadmap
Becoming a-filemaker-designer-in-60-minutes
Becoming a-filemaker-designer-in-60-minutes
J105 Web Design
J105 Web Design
Creating a World-class Translation Strategy
Creating a World-class Translation Strategy
International SEO and Content Silos | John Caldwell | CreatorSEO
International SEO and Content Silos | John Caldwell | CreatorSEO
Recently uploaded
Q4-W4-SCIENCE-5 power point presentation
Q4-W4-SCIENCE-5 power point presentation
ZenSeloveres
Design Inspiration for College by Slidesgo.pptx
Design Inspiration for College by Slidesgo.pptx
TusharBahuguna2
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
Abortion pills in Kuwait Cytotec pills in Kuwait
Booking open Available Pune Call Girls Kirkatwadi 6297143586 Call Hot Indian...
Booking open Available Pune Call Girls Kirkatwadi 6297143586 Call Hot Indian...
Call Girls in Nagpur High Profile
VIP Model Call Girls Kalyani Nagar ( Pune ) Call ON 8005736733 Starting From ...
VIP Model Call Girls Kalyani Nagar ( Pune ) Call ON 8005736733 Starting From ...
SUHANI PANDEY
Booking open Available Pune Call Girls Nanded City 6297143586 Call Hot India...
Booking open Available Pune Call Girls Nanded City 6297143586 Call Hot India...
Call Girls in Nagpur High Profile
8377087607, Door Step Call Girls In Kalkaji (Locanto) 24/7 Available
8377087607, Door Step Call Girls In Kalkaji (Locanto) 24/7 Available
dollysharma2066
Hire 💕 8617697112 Meerut Call Girls Service Call Girls Agency
Hire 💕 8617697112 Meerut Call Girls Service Call Girls Agency
Nitya salvi
💫✅jodhpur 24×7 BEST GENUINE PERSON LOW PRICE CALL GIRL SERVICE FULL SATISFACT...
💫✅jodhpur 24×7 BEST GENUINE PERSON LOW PRICE CALL GIRL SERVICE FULL SATISFACT...
sonalitrivedi431
Sector 105, Noida Call girls :8448380779 Model Escorts | 100% verified
Sector 105, Noida Call girls :8448380779 Model Escorts | 100% verified
Delhi Call girls
Call Girls Basavanagudi Just Call 👗 7737669865 👗 Top Class Call Girl Service ...
Call Girls Basavanagudi Just Call 👗 7737669865 👗 Top Class Call Girl Service ...
amitlee9823
RT Nagar Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Bang...
RT Nagar Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Bang...
amitlee9823
How to Build a Simple Shopify Website
How to Build a Simple Shopify Website
mark11275
Book Paid In Vashi In 8976425520 Navi Mumbai Call Girls
Book Paid In Vashi In 8976425520 Navi Mumbai Call Girls
modelanjalisharma4
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
eeanqy
Recommendable # 971589162217 # philippine Young Call Girls in Dubai By Marina...
Recommendable # 971589162217 # philippine Young Call Girls in Dubai By Marina...
home
Jordan_Amanda_DMBS202404_PB1_2024-04.pdf
Jordan_Amanda_DMBS202404_PB1_2024-04.pdf
amanda2495
Peaches App development presentation deck
Peaches App development presentation deck
tbatkhuu1
Vip Mumbai Call Girls Bandra West Call On 9920725232 With Body to body massag...
Vip Mumbai Call Girls Bandra West Call On 9920725232 With Body to body massag...
amitlee9823
UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...
UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...
RitikaRoy32
Recently uploaded
(20)
Q4-W4-SCIENCE-5 power point presentation
Q4-W4-SCIENCE-5 power point presentation
Design Inspiration for College by Slidesgo.pptx
Design Inspiration for College by Slidesgo.pptx
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
Booking open Available Pune Call Girls Kirkatwadi 6297143586 Call Hot Indian...
Booking open Available Pune Call Girls Kirkatwadi 6297143586 Call Hot Indian...
VIP Model Call Girls Kalyani Nagar ( Pune ) Call ON 8005736733 Starting From ...
VIP Model Call Girls Kalyani Nagar ( Pune ) Call ON 8005736733 Starting From ...
Booking open Available Pune Call Girls Nanded City 6297143586 Call Hot India...
Booking open Available Pune Call Girls Nanded City 6297143586 Call Hot India...
8377087607, Door Step Call Girls In Kalkaji (Locanto) 24/7 Available
8377087607, Door Step Call Girls In Kalkaji (Locanto) 24/7 Available
Hire 💕 8617697112 Meerut Call Girls Service Call Girls Agency
Hire 💕 8617697112 Meerut Call Girls Service Call Girls Agency
💫✅jodhpur 24×7 BEST GENUINE PERSON LOW PRICE CALL GIRL SERVICE FULL SATISFACT...
💫✅jodhpur 24×7 BEST GENUINE PERSON LOW PRICE CALL GIRL SERVICE FULL SATISFACT...
Sector 105, Noida Call girls :8448380779 Model Escorts | 100% verified
Sector 105, Noida Call girls :8448380779 Model Escorts | 100% verified
Call Girls Basavanagudi Just Call 👗 7737669865 👗 Top Class Call Girl Service ...
Call Girls Basavanagudi Just Call 👗 7737669865 👗 Top Class Call Girl Service ...
RT Nagar Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Bang...
RT Nagar Call Girls Service: 🍓 7737669865 🍓 High Profile Model Escorts | Bang...
How to Build a Simple Shopify Website
How to Build a Simple Shopify Website
Book Paid In Vashi In 8976425520 Navi Mumbai Call Girls
Book Paid In Vashi In 8976425520 Navi Mumbai Call Girls
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
Recommendable # 971589162217 # philippine Young Call Girls in Dubai By Marina...
Recommendable # 971589162217 # philippine Young Call Girls in Dubai By Marina...
Jordan_Amanda_DMBS202404_PB1_2024-04.pdf
Jordan_Amanda_DMBS202404_PB1_2024-04.pdf
Peaches App development presentation deck
Peaches App development presentation deck
Vip Mumbai Call Girls Bandra West Call On 9920725232 With Body to body massag...
Vip Mumbai Call Girls Bandra West Call On 9920725232 With Body to body massag...
UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...
UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...
An introduction to Usability
1.
Don’t make me
think
2.
3.
Erlend Debast Web designer
at Proximity BBDO erlend.debast@proximity.bbdo.be twitter.com/erlend artueel.be
4.
Us•a•bil•i•ty “... is the
effectiveness, efficiency, and satisfaction with which users can achieve tasks in a particular environment of a product.”
5.
Bringing ease, joy and
fun to the people around us.
6.
Usability is Anger Management
7.
Internet has become
part of our daily lives. Yet, with very poor usability.
8.
4 common situations
& solutions
9.
5 actually
4 common situations & solutions
10.
1 Where the
hell am I
11.
Site logo ★
Is expected “top-left” ★ Clickable, back to home
12.
Near-perfect
13.
Goes back to home
or news?
14.
“Home” ★
Is expected ★ First item in main navigation ★ English terminology is accepted
15.
Home is first
& selected
16.
First item &
selected
17.
Main Navigation ★
Is expected (horizontal) ★ Limit the number of items ★ “Selected” status
18.
Simple & straightforward
19.
Lovely icons
Clearly selected
20.
Sub Navigation ★
Is expected (vertically) ★ Close to main navigation ★ Selected status
21.
Close to main nav
clearly selected
22.
Breadcrumbs ★
Indicates “traveled” path ★ Show site/content hierarchy ★ Alternative way of going “back”
23.
Shows traveled path
24.
Plain & Simple
25.
Language ★
Expected near main navigation ★ ISO Standards (NL-FR-EN) ★ Indicate current language
26.
Top right & selected
27.
top right, but
not selected
28.
2 I can’t
find what I’m looking for...
29.
Typography ★
Difference between titles & paragraphs ★ Links should look like links ★ Use colors & fonts to show importance
30.
Titles orange
links in blue Price in red Meta information in grey
31.
Sans-font
Clear CTA italic for quotes
32.
Copywriting ★
Use keywords for titles (Google loves that too) ★ Match navigation & page titles ★ Avoid duplicate content ★ Group your content, wisely
33.
Keywords as navigation
Selected
34.
Whitespace ★
Use whitespace to create structure ★ More screensize doesn’t mean more content ★ Whitespace is sexy
35.
36.
37.
Search box ★
Expected top-right ★ Average search query is 35 chars
38.
Top right as
exptected
39.
Close the navigation
40.
3 What’s next
please?
41.
Forms ★
Default OS design is expected ★ Different length for each input format ★ Pre-format input fields/data
42.
Where is home?
This ain’t default
43.
this field is
needed Length that matches input
44.
Error recovery ★
Show what the user did wrong ★ Indicate how they can fix the mistake ★ Stop punishing your users ★ Use inline errors with care
45.
Inline errors
Default design
46.
Interactive
inline error Obvious Red color to CTA indicate error
47.
Progress ★
Show a process indicator ★ People love making progress ★ Group your information (obvious vs personal)
48.
3 clear steps
Selected Default design What happens with my info?
49.
4 Where should
I click?
50.
Call to action’s ★
People should know how to join ★ People should know why to join ★ Consistent style for your CTA’s
51.
Consistent style
52.
Consistent style
53.
Consistent
style Color usage baby!
54.
5 The ever-lasting
“above the fold” discussion
55.
Life below the
fold ★ People scroll, yes they do ★ Your lay-out should look “cut” ★ Make your footer usable
56.
37signals
57.
Search as backup
Contact us information
58.
Functional sitemap
Switch language
59.
product Line up
60.
Get to know
your audience
61.
It takes between
2 & 5 people to fix 70% of the most common usability issues.
62.
Share your site
statistics with all the people involved. Not only with marketing.
63.
A usable website
can result in higher ROI
64.
Everyone’s happy!
65.
Erlend Debast Web designer
at Proximity BBDO erlend.debast@proximity.bbdo.be twitter.com/erlend artueel.be
Download now