Accessibility Fundamentals - Disabilities, Guidelines, and Laws Flashcards
(31 cards)
What are the types of Disabilities
- Blind
- Low Vision
- Color-blind
- Deaf
- Deafblind
- Motor Disabilities
- Speech Disabilities
- Cognitive Disabilities
- Reading Disabilities
- Seizures
- Multiple Disabilities
Source: https://dequeuniversity.com/class/fundamentals/personas/
What do screen readers do?
They convert the text on the web page into spoken words
Source: https://dequeuniversity.com/class/fundamentals/personas/blind
What are the design considerations for Blindness?
- All content must be presented in text or via text equivalent
- Information must not be conveyed by visual atrributes alone
- All functionality must be available using only the keyboard
- The content must use markup with good structure and semantic
- All custom controls must have the corret name/label, role, and value, and must change value when appropriate
- Users must receive immediate feedback after all actions, via their screen reader.
- Videos require audio descriptions if the video’s original audio track does not explain everything that a person who is blind would need to know to understand the video
- On mobile devices:
- All feature require a click action
- Custom sqipe actions on web pages will not work with the screen reader turned on
Source: https://dequeuniversity.com/class/fundamentals/personas/blind
Design Considerations - Why?
All content must be presented in text or via a text equivalent
Screen readers cannot read non-text content (e.g images) directly, but they can read alt text that you provide
Source: https://dequeuniversity.com/class/fundamentals/personas/blind
Design Considerations - Why?
Information must not be conveyed by visual attributes alone
Not all visual information is available to screen readers. Even the visual attributes which are available to some screen readers , such as text color, are typically not announced by default.
Source: https://dequeuniversity.com/class/fundamentals/personas/blind
Design Considerations - Why?
Information must not be conveyed by visual attributes alone
Not all visual information is available to screen readers. Even the visual attributes which are available to some screen readers , such as text color, are typically not announced by default.
Source: https://dequeuniversity.com/class/fundamentals/personas/blind
Design Considerations - Why?
Design Considerations - Why?All custom controls (e.g., expand/collapse buttons, media player volume control, dialogs, etc.) must have the correct name/label, role (either with HTML or with ARIA), and value, and must change value when appropriate (e.g. aria-expanded=”false” changes to aria-expanded=”true” after activating the button).
Unlike native HTML elements, custom controls have no semantic parts natively, so screen readers can’t tell users what the widget is and can’t update users on the properties of the widget unless you supply that information via ARIA names, roles, states, and properties.
Source: https://dequeuniversity.com/class/fundamentals/personas/blind
Design Considerations - Why?
Users must receive immediate feedback after all actions, via their screen reader. Silence after activating a feature is always bad!
Examples of feedback: Expanded/collapse region, value changed on a control (e.g., on a slider, successful/unsuccessful form submission, notification that a new “page” has loaded in single-page applications, etc.).
Source: https://dequeuniversity.com/class/fundamentals/personas/blind
Design Considerations - Why?
Videos require audio descriptions (additional narration of visual content) if the video’s original audio track (dialog, sounds, narration) does not explain everything that a person who is blind would need to know to understand the video.
Users who are blind can hear the dialog, narration, and other sounds in videos, but they can’t see the visual parts of a video. So, if the visual parts convey important information, those parts will need to be described out loud for blind users to understand them.
Source: https://dequeuniversity.com/class/fundamentals/personas/blind
Design Considerations - Why?
On mobile devices:
* All features require a click action.
* Custom swipe actions on web pages will not work with the screen reader turned on.
When a blind screen reader user is on a mobile device, swipe actions are used by the screen reading software. All features (controls, widgets) on a mobile web page require a click action to work at all.
Source: https://dequeuniversity.com/class/fundamentals/personas/blind
List some low vision characteristics
- Blur
- Blur with low contrast
- Cataracts
- Diabetic Retinopathy
- Glaucoma
- Hemianopia
- Macular Degeneration
- Retinal Detachment
Source: https://dequeuniversity.com/class/fundamentals/personas/low-vision
Web Accessibility options for Low Vision
- Screen magnification
- Screen Readers
- Color Customization
https://dequeuniversity.com/class/fundamentals/personas/low-vision
What are the design considerations for low vision
- The pinch-to-zoom feature must not be disabled (avoid <meta></meta>).
- All text must pass contrast guidelines against the background (verify using Deque’s axe DevTools accessibility browser extension or a similar tool).
- Links, buttons, and controls must have a visible :focus state and should have a visible :hover state.
- The user interface should provide a clear visual distinction between content (e.g., text) and controls (e.g., buttons, links, etc.).
https://dequeuniversity.com/class/fundamentals/personas/low-vision
Design considerations - why?
The pinch-to-zoom feature must not be disabled (avoid <meta></meta>).
When zooming is disabled on a web page, which the parameter user-scalable=no does, low vision users who use screen magnifiers to read content may be unable to properly see information on a web page.
Design considerations - why?
All text must pass contrast guidelines against the background (verify using Deque’s axe DevTools accessibility browser extension or a similar tool).
Some users who have low vision may see in low contrast. So, text, borders, and other elements may appear as the same or similar shades of brightness to them. Textual elements that are too close in brightness to background colors may be extremely difficult to read for these users.
Links, buttons, and controls must have a visible :focus state and should have a visible :hover state.
Some low vision users may use a keyboard or a mouse, or both, as input methods. Having visible :focus and :hover states helps users to know where the keyboard/mouse focus is on a web page. The default browser :focus state is acceptable per the WCAG guidelines, but users with low vision benefit greatly from enhanced CSS :focus and :hover states.
What is a design consideration for color blindness?
All information must be understandable without needing to distinguish between colors. Reds and greens are especially problematic when used as the only way to convey information.
https://dequeuniversity.com/class/fundamentals/personas/colorblind
What are some design considerations for deafness?
- All videos must have captions
- All audio only content must have transcripts
- Sign language interpretation of videos can be very helpful
https://dequeuniversity.com/class/fundamentals/personas/deaf
What are some design considerations for deaf blindness?
- All of the considerations for blindness apply
- All of the considerations for deafness apply.
- In addition, a transcript must be provided for audio and video content
What are some design considerations for motor disabilities?
- All functionality must be available using only the keyboard.
- Links, buttons, and controls must have a visible :focus state and should have a visible :hover state
- With session time-outs, warn users before the time expires (e.g an accessible dialog or alert), and give them the option to extend the session. Ensure the warning itself allows for slow responses. A recommended minimum response time is 2 minutes.
- Provide large click targets (links, buttons, controls) for users who have movements that are difficult to control.
What are some different types of speech disabilities?
- Stuttering
- Cluttering
- Apraxia
- Dysarthria
- Speech sound disorders
- Non-vocal
What is a deisgn consideration for speech disabilities?
Don’t depend on voice input
What are some design considerations for users with lower comprehension?
- Simplify the interface as much as possible
- Simplify the content as much as possible
- Keep videos and audio as short as possible
- Limit the number of choices on the screen
- Provide help features.
- Design for ease of use.
- Test the usability of the interface with actual users, preferably including users with cognitive disabilities
What are some design considerations for users with memory loss?
- Retain information across screens, and within a path
- Provide help features
