WCAG Principles: Understandable4:24 with Anwar Montasir
People with disabilities must be able to understand your content and use your interfaces.
WCAG Understandable Principle
Set HTML language attribute
Use plain language
Create predictable navigation
No unexpected changes in context
Make errors easy to spot and correct
Change in context: To avoid disorienting users, the following should happen only when the user initiates a change by interacting with an interface element:
- opening a new window
- loading a new page
- significantly rearranging page content
- moving focus to a new component.
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
You need to sign up for Treehouse in order to download course files.Sign up