Packt+ | Advance your knowledge in tech

Explore Products

Best Sellers

New Releases

Books

Videos

Audiobooks

Free Learning

101 UX Principles

You're reading from 101 UX Principles A definitive design guide

Product type Paperback

Published in Aug 2018

Publisher Packt

ISBN-13 9781788837361

Length 414 pages

Edition 1st Edition

Concepts

User Experience

Author (1):

Will Grant

View More author details

Table of Contents (108) Chapters

101 UX Principles

Contributors

Preface

Other Books You May Enjoy

1. Anyone Can Be a User Experience (UX) Professional FREE CHAPTER

Learning points

2. Don't Use More Than Two Typefaces

Learning points

3. Users Already Have Fonts on Their Computers, So Use Them

Learning points

4. USE TYPE SIZE TO DEPICT INFORMATION HIERARCHY

5. Use a Sensible Default Size for Body Copy

Learning points

6. Use an Ellipsis to Indicate That There's a Further Step

Learning points

7. Make Your Buttons Look Like Buttons

Learning points

8. Make Buttons a Sensible Size and Group Them Together by Function

Learning points

9. Make the Whole Button Clickable, Not Just the Text

Learning points

10. Don't Invent New, Arbitrary Controls

Learning points

11. Search Should be a Text Field with a Button Labeled "Search"

Learning points

12. Sliders Should Be Used Only for Non-Quantifiable Values

Learning points

13. Use Numeric Entry Fields for Precise Integers

Learning points

14. Don't Use a Drop-Down Menu If You Only Have a Few Options

Learning points:

15. Allow Users to Undo Destructive Actions

Learning points

16. Think About What's Just off the Screen

Learning points

17. Use "Infinite Scroll" for Feed–Style Content Only

Learning points

18. If Your Content Has a Beginning, Middle, and End, Use Pagination

Learning points

19. If You Must Use Infinite Scroll, Store the User's Position and Return to It

Learning points

20. Make "Blank Slates" More Than Just Empty Views

Learning points

21. Make "Getting Started" Tips Easily Dismissable

Learning points

22. When a User Refreshes a Feed, Move Them to the Last Unread Item

Learning points

23. Don't Hide Items Away in a "Hamburger" Menu

Learning points

24. Make Your Links Look Like Links

Learning points

25. Split Menu Items Down into Subsections, so Users Don't Have to Remember Large Lists

Learning points

26. Hide "Advanced" Settings From Most Users

Learning points

27. Repeat Menu Items in the Footer or Lower Down in the View

Learning points

28. Use Consistent Icons Across the Product

Learning points

29. Don't Use Obsolete Icons

Learning points

30. Don't Try to Depict a New Idea With an Existing Icon

Learning points

31. Never Use Text on Icons

Learning points

32. Always Give Icons a Text Label

Learning points

33. Emoji are the Most Recognized Icon Set on Earth

Learning points

34. Use Device-Native Input Features Where Possible

Learning points

35. Obfuscate Passwords in Fields, but Provide a "Show Password" Toggle

Learning points

36. Always Allow the User to Paste into Password Fields

Learning points

37. Don't Attempt to Validate Email Addresses

Learning points

38. Don't Ever Clear User-Entered Data Unless Specifically Asked To

Learning points

39. Pick a Sensible Size for Multiline Input Fields

Learning points

40. Don't Ever Make Your UI Move While a User is Trying to Use It

Learning points

41. Use the Same Date Picker Controls Consistently

Learning points

42. Pre-fill the Username in "Forgot Password" Fields

Learning points

43. Be Case-Insensitive

Learning points

44. If a Good Form Experience Can Be Delivered, Your Users will Love Your Product

Learning points

45. Validate Data Entry as Soon as Possible

Learning points

46. If the Form Fails Validation, Show the User Which Field Needs Their Attention

Learning points

47. Be Forgiving – Users Don't Know (and Don't Care) How You Need the Data

Learning points

48. Pick the Right Control for the Job

Learning Points

49. Allow Users to Enter Phone Numbers However They Wish

Learning points

50. Use Drop Downs Sensibly for Date Entry

Learning points

51. Capture the Bare Minimum When Requesting Payment Card Details

Learning points

52. Make it Easy for Users to Enter Postal or ZIP Codes

Learning points

53. Don't Add Decimal Places to Currency Input

Learning points

54. Make it Painless for the User to Add Images

Learning points

55. Use a "Linear" Progress Bar if a Task will Take a Determinate Amount of Time

Learning points

56. Show a "Spinner" if the Task Will Take an Indeterminate Amount of Time

Learning points

57. Never Show an Animated, Looping Progress Bar

Learning points

58. Show a Numeric Progress Indicator on the Progress Bar

Learning points

59. Contrast Ratios Are Your Friends

Learning points

60. If You Must Use "Flat Design" then Add Some Visual Affordances to Controls

Learning points

61. Avoid Ambiguous Symbols

Learning points

62. Make Links Make Sense Out of Context

Learning points

63. Add "Skip to Content" Links Above the Header and Navigation

Learning points

64. Don't Only Use Color to Convey Information

Learning points:

65. If You Turn Off Device Zoom with a Meta Tag, You're Evil

Learning points

66. Give Navigation Elements a Logical Tab Order

Learning points

67. Write Clear Labels for Controls

Learning points

68. Let Users Turn off Specific Notifications

Learning points

69. Make Tappable Areas Finger-Sized

Learning points

70. A User's Journey Should Have a Beginning, Middle, and End

Learning points

71. The User Should Always Know at What Stage They Are in Any Given Journey

Learning points

72. Use Breadcrumb Navigation

Learning points

73. If the User is on an Optional Journey, Give Them a Control to "Skip This"

Learning points

74. Users Don't Care About Your Company

Learning points

75. Follow the Standard E-Commerce Pattern

Learning points

76. Show an Indicator in the Title Bar if the User's Work is Unsaved

Learning points

77. Don't Nag Your Users into Rating Your App

Learning points

78. Don't Use a Vanity Splash Screen

Learning points

79. Make Your Favicon Distinctive

Learning points

80. Add a "Create from Existing" Flow

Learning points

81. Make it Easy for Users to Pay You

Learning points

82. Categorize Search Results into Sections

Learning points:

83. Your Users Probably Don't Understand the File System

Learning points

84. Show, Don't Tell

Learning points

85. Be Consistent with Terminology

Learning points:

86. Use "Sign in" and "Sign out", Not "Log in" and "Log out"

Learning points

87. "Sign up" Makes More Sense Than "Register"

Learning points

88. Use "Forgot Password" or "Forgotten Your Password", Not Something Obscure

Learning points

89. Write Like a Human Being

Learning points

90. Choose Active Verbs over Passive

Learning points

91. Search Results Pages Should Show the Most Relevant Result at the Top of the Page

Learning points

92. Pick Good Defaults

Learning points

93. Don't Confound Users' Expectations

Learning points

94. Reduce the Number of Tasks a User Has to Complete by Using Sensible Defaults

Learning points

95. Build Upon Established Metaphors – It's Not Stealing

Learning points

96. Decide Whether an Interaction Should Be Obvious, Easy, or Possible

Learning points

97. "Does it Work on Mobile?" is Obsolete

Learning points

98. Messaging is a Solved Problem

Learning points

99. Brands Are Bullshit

Learning points

100. Don't Join the Dark Side

Learning points

101. Test with Real Users

Learning points

102. Bonus – Strive for Simplicity

Index

Chapter #48. Pick the Right Control for the Job

UI designers have an extensive palette of controls and UI elements to choose from, so it's surprising to see, fairly often, poor choices of controls on forms.

You can enhance the UX of a product considerably by using the right control for the job. HTML5 has extensive form controls, supported by all modern browsers, including color pickers, telephone input, URL input with validation, and so on.

It's not always the most obvious control that you're looking for. Here are some examples:

Showing users two radio buttons for a yes or no choice, when a checkbox or toggle switch would be simpler
Overusing drop-down controls when there are only a few options (it would be better to use virtually any other control because a drop-down obscures the available choices from the user see #14 Don't Use a Drop-Down Menu If You Only Have a Few Options)
"Build your own" UI for color selection when the HTML color input type is widely supported and shows a bespoke control...

The rest of the chapter is locked

Register for a free Packt account to unlock a world of extra content!

A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.

Unlock this book and the full library FREE for 7 days

Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of

Start free trial

Renews at $19.99/month. Cancel anytime

Authors (1)

Will Grant

Will Grant

Will Grant is a British UI/UX expert and a digital product designer. He is a web technology entrepreneur with over 25 years' experience, leading teams (and products) at the intersection of technology and usability. After his Computer Science degree, Will trained with Jakob Nielsen and Bruce Tognazzini at the Nielsen Norman Group – the world leaders in usable design. Since then, Will has overseen the user experience and interaction design of several large-scale web sites and apps, reaching over a billion users in the process. Will is a "design purist" and obsessed with building beautiful, compelling, and familiar products that customers intuitively know how to use.

See other products by Will Grant

Other recommended products

Related to this chapter

Skill Up: A Software Developer's Guide to Life and Career

Skill Up: A Software Developer's Guide to Life and Career

This book is an all-purpose toolkit for your programming career. It is split up into three main topic areas: Coder Skills, Freelancer Skills, and Career Skills to help you identify and answer the key questions and stumbling blocks that programmers encounter. It is a comprehensive guide containing more than 50 insights and methodologies that you can use to improve the work you produce, your relationships with the people you work with, and your own career.

Jul 2017 10h 4m

Skill Up: A Software Developer's Guide to Life and Career

Skill Up: A Software Developer's Guide to Life and Career

This book is an all-purpose toolkit for your programming career. It is split up into three main topic areas: Coder Skills, Freelancer Skills, and Career Skills to help you identify and answer the key questions and stumbling blocks that programmers encounter. It is a comprehensive guide containing more than 50 insights and methodologies that you can use to improve the work you produce, your relationships with the people you work with, and your own career.

Jul 2017 10h 4m

Testing Practitioner Handbook

Testing Practitioner Handbook

Software testing is a crucial aspect of any development process if one wants to build a high-quality product. With the increase in app usage, the need for testing has only grown leaps and bounds.

Mar 2017 11h 40m

Testing Practitioner Handbook

Testing Practitioner Handbook

Software testing is a crucial aspect of any development process if one wants to build a high-quality product. With the increase in app usage, the need for testing has only grown leaps and bounds.

Mar 2017 11h 40m

Testing Practitioner Handbook

Testing Practitioner Handbook

Software testing is a crucial aspect of any development process if one wants to build a high-quality product. With the increase in app usage, the need for testing has only grown leaps and bounds.

Mar 2017 11h 40m

Testing Practitioner Handbook

Testing Practitioner Handbook

Software testing is a crucial aspect of any development process if one wants to build a high-quality product. With the increase in app usage, the need for testing has only grown leaps and bounds.

Mar 2017 11h 40m

Testing Practitioner Handbook

Testing Practitioner Handbook

Software testing is a crucial aspect of any development process if one wants to build a high-quality product. With the increase in app usage, the need for testing has only grown leaps and bounds.

Mar 2017 11h 40m

Testing Practitioner Handbook

Testing Practitioner Handbook

Software testing is a crucial aspect of any development process if one wants to build a high-quality product. With the increase in app usage, the need for testing has only grown leaps and bounds.

Mar 2017 11h 40m

Testing Practitioner Handbook

Testing Practitioner Handbook

Software testing is a crucial aspect of any development process if one wants to build a high-quality product. With the increase in app usage, the need for testing has only grown leaps and bounds.

Mar 2017 11h 40m

Testing Practitioner Handbook

Testing Practitioner Handbook

Software testing is a crucial aspect of any development process if one wants to build a high-quality product. With the increase in app usage, the need for testing has only grown leaps and bounds.

Mar 2017 11h 40m

Testing Practitioner Handbook

Testing Practitioner Handbook

Software testing is a crucial aspect of any development process if one wants to build a high-quality product. With the increase in app usage, the need for testing has only grown leaps and bounds.

Mar 2017 11h 40m

Testing Practitioner Handbook

Testing Practitioner Handbook

Software testing is a crucial aspect of any development process if one wants to build a high-quality product. With the increase in app usage, the need for testing has only grown leaps and bounds.

Mar 2017 11h 40m

Personalised recommendations for you

Based on your interests and search pattern

Mastering Customer Success

Mastering Customer Success

This guide unveils strategies to cultivate enduring customer relationships. Grounded in effective communication and problem-solving, it shows you how to harness cross-functional collaboration for competitive advantage.

May 2024 5h 40m

Mastering Customer Success

Mastering Customer Success

This guide unveils strategies to cultivate enduring customer relationships. Grounded in effective communication and problem-solving, it shows you how to harness cross-functional collaboration for competitive advantage.

May 2024 5h 40m

Mastering Customer Success

Mastering Customer Success

This guide unveils strategies to cultivate enduring customer relationships. Grounded in effective communication and problem-solving, it shows you how to harness cross-functional collaboration for competitive advantage.

May 2024 5h 40m

Mastering Customer Success

Mastering Customer Success

This guide unveils strategies to cultivate enduring customer relationships. Grounded in effective communication and problem-solving, it shows you how to harness cross-functional collaboration for competitive advantage.

May 2024 5h 40m

Mastering Customer Success

Mastering Customer Success

This guide unveils strategies to cultivate enduring customer relationships. Grounded in effective communication and problem-solving, it shows you how to harness cross-functional collaboration for competitive advantage.

May 2024 5h 40m

Mastering Customer Success

Mastering Customer Success

This guide unveils strategies to cultivate enduring customer relationships. Grounded in effective communication and problem-solving, it shows you how to harness cross-functional collaboration for competitive advantage.

May 2024 5h 40m

Mastering Customer Success

Mastering Customer Success

This guide unveils strategies to cultivate enduring customer relationships. Grounded in effective communication and problem-solving, it shows you how to harness cross-functional collaboration for competitive advantage.

May 2024 5h 40m

Mastering Customer Success

Mastering Customer Success

This guide unveils strategies to cultivate enduring customer relationships. Grounded in effective communication and problem-solving, it shows you how to harness cross-functional collaboration for competitive advantage.

May 2024 5h 40m

Mastering Customer Success

Mastering Customer Success

This guide unveils strategies to cultivate enduring customer relationships. Grounded in effective communication and problem-solving, it shows you how to harness cross-functional collaboration for competitive advantage.

May 2024 5h 40m

Mastering Customer Success

Mastering Customer Success

This guide unveils strategies to cultivate enduring customer relationships. Grounded in effective communication and problem-solving, it shows you how to harness cross-functional collaboration for competitive advantage.

May 2024 5h 40m

Mastering Customer Success

Mastering Customer Success

This guide unveils strategies to cultivate enduring customer relationships. Grounded in effective communication and problem-solving, it shows you how to harness cross-functional collaboration for competitive advantage.

May 2024 5h 40m

Mastering Customer Success

Mastering Customer Success

This guide unveils strategies to cultivate enduring customer relationships. Grounded in effective communication and problem-solving, it shows you how to harness cross-functional collaboration for competitive advantage.

May 2024 5h 40m