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
Slideshow view
Report
Share
Slideshow view
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
Pharmaceutical Packaging for the elderly.pdf
Pharmaceutical Packaging for the elderly.pdf
AayushChavan5
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
Aginakm1
NO1 Famous Amil Baba In Karachi Kala Jadu In Karachi Amil baba In Karachi Add...
NO1 Famous Amil Baba In Karachi Kala Jadu In Karachi Amil baba In Karachi Add...
Amil baba
Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)
Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)
jennyeacort
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
z xss
FiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdf
Shivakumar Viswanathan
group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdf
neelspinoy
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一
F dds
How to Be Famous in your Field just visit our Site
How to Be Famous in your Field just visit our Site
galleryaagency
西北大学毕业证学位证成绩单-怎么样办伪造
西北大学毕业证学位证成绩单-怎么样办伪造
kbdhl05e
How to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AI
yuj
定制(RMIT毕业证书)澳洲墨尔本皇家理工大学毕业证成绩单原版一比一
定制(RMIT毕业证书)澳洲墨尔本皇家理工大学毕业证成绩单原版一比一
lvtagr7
Design principles on typography in design
Design principles on typography in design
nooreen17
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
ssuser7cb4ff
Mookuthi is an artisanal nose ornament brand based in Madras.
Mookuthi is an artisanal nose ornament brand based in Madras.
Mookuthi
Abu Dhabi Call Girls O58993O4O2 Call Girls in Abu Dhabi`
Abu Dhabi Call Girls O58993O4O2 Call Girls in Abu Dhabi`
dajasot375
Call Girls in Okhla Delhi 💯Call Us 🔝8264348440🔝
Call Girls in Okhla Delhi 💯Call Us 🔝8264348440🔝
soniya singh
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
Rndexperts
Untitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptx
mapanig881
ARt app | UX Case Study
ARt app | UX Case Study
Sophia Viganò
Recently uploaded
(20)
Pharmaceutical Packaging for the elderly.pdf
Pharmaceutical Packaging for the elderly.pdf
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
NO1 Famous Amil Baba In Karachi Kala Jadu In Karachi Amil baba In Karachi Add...
NO1 Famous Amil Baba In Karachi Kala Jadu In Karachi Amil baba In Karachi Add...
Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)
Call Us ✡️97111⇛47426⇛Call In girls Vasant Vihar༒(Delhi)
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
FiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdf
group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdf
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一
办理学位证(SFU证书)西蒙菲莎大学毕业证成绩单原版一比一
How to Be Famous in your Field just visit our Site
How to Be Famous in your Field just visit our Site
西北大学毕业证学位证成绩单-怎么样办伪造
西北大学毕业证学位证成绩单-怎么样办伪造
How to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AI
定制(RMIT毕业证书)澳洲墨尔本皇家理工大学毕业证成绩单原版一比一
定制(RMIT毕业证书)澳洲墨尔本皇家理工大学毕业证成绩单原版一比一
Design principles on typography in design
Design principles on typography in design
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
Call Girls Aslali 7397865700 Ridhima Hire Me Full Night
Mookuthi is an artisanal nose ornament brand based in Madras.
Mookuthi is an artisanal nose ornament brand based in Madras.
Abu Dhabi Call Girls O58993O4O2 Call Girls in Abu Dhabi`
Abu Dhabi Call Girls O58993O4O2 Call Girls in Abu Dhabi`
Call Girls in Okhla Delhi 💯Call Us 🔝8264348440🔝
Call Girls in Okhla Delhi 💯Call Us 🔝8264348440🔝
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
Untitled presedddddddddddddddddntation (1).pptx
Untitled presedddddddddddddddddntation (1).pptx
ARt app | UX Case Study
ARt app | UX Case Study
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