Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll

Accessibility for UX Designers

Well done!

You have completed Accessibility for UX Designers!

Sign up for Treehouse Back to Library
Preview
Video Player
00:00
00:00
00:00
  1. 2x 2x
  2. 1.75x 1.75x
  3. 1.5x 1.5x
  4. 1.25x 1.25x
  5. 1.1x 1.1x
  6. 1x 1x
  7. 0.75x 0.75x
  8. 0.5x 0.5x
Use Up/Down Arrow keys to increase or decrease volume.

WCAG Principles: Understandable

4:24 with Anwar Montasir

People with disabilities must be able to understand your content and use your interfaces.

People with disabilities must be able to 0:00
understand your content and use your interfaces. 0:04
The understandable principle is broken into three guidelines, 0:09
beginning with one called readable. 0:13
The level a requirement is pretty simple. 0:16
Developers should set an appropriate language attribute, so 0:20
screen readers know what language to expect and 0:24
what accent to use in pronouncing page content. 0:28
In the example shown here, the document's primary language is English. 0:32
But this particular paragraph asks the screen reader to switch to 0:38
French pronunciation. 0:42
The readable guideline also covers plain language. 0:44
The website plainlanguage.gov, a resource for keeping body copy clear and 0:51
straightforward on federal government websites, 0:57
recommends using strong, simple words, short paragraphs, 1:02
clearly organized information, and a conversational tone. 1:07
I'm looking at a sample of complex versus plain language. 1:15
The lengthy single paragraph on the left creates 1:20
an intimidating wall of words that few would enjoy reading. 1:24
And check out this sentence: "the fungal material is carried into 1:29
the respiratory tract when airborne particles are inhaled". 1:34
I'm guessing listening to me read that was pretty tedious. 1:39
The presentation on the right delivers the same information, but in clear language. 1:44
Be careful. Watch out for mold in all these materials after a flood. 1:49
Simplifying language like this helps users with cognitive disabilities, low 1:57
reading literacy, and those encountering an unfamiliar topic or language. 2:02
The second guideline, predictable, has to do with keeping app and 2:09
website experiences predictable and navigation schemes consistent, 2:14
something which benefits all users regardless of physical ability. 2:20
In addition, the predictable guideline 2:25
warns against unexpected changes in context. 2:30
To avoid disorienting users, the following should happen only when 2:36
the user initiates a change by interacting with an interface element. 2:41
Opening a new window, loading a new page, 2:47
significantly rearranging page content, or moving focus to a new component. 2:53
As the Mozilla Developer's Network says on the subject, 3:00
people don't want interfaces to surprise them. 3:04
They want things to be intuitive and behave as expected. 3:07
The final understandable guideline is called input assistance. 3:14
Users sometimes make mistakes, 3:19
no matter how well designed the web form or interface. 3:22
Prevent frustration by making errors easy to spot and correct. 3:27
A Nielsen Norman Group article linked in the teacher's notes 3:33
offers three principles for error reporting in forms. 3:38
The error message should be easy to notice and understand. 3:43
The fields in error should be easy to locate. 3:47
And users shouldn't have to memorize the instructions for 3:51
fixing the error. 3:56
We'll take a closer look at designing an accessible form in the second 3:58
stage of this course. 4:02
You might have noticed that the Understandable principle was quite a bit 4:06
shorter than either the Perceivable or Operable principle. 4:10
Our final principle, Robust, is the shortest entry of all in the WCAG. 4:15
We'll take a closer look in our next video. 4:21