Web Accessibility And People With Dyslexia:A Survey On Techniques And Guidelines
Vagner F. de Santana (IC/UNICAMP)Rosimeire de Oliveira (CMCC/UFABC),Leonelo D. A. Almeida (IC/UNICAMP), andProf. M. Cecilia C. Baranauskas (IC/UNICAMP)
W4A 2012, April 17th, 2012
Agenda
• Motivation and Objective
• Understanding dyslexia
• Methodology
• Results
• Discussion
• Conclusion
2
Motivation
• Web accessibility usually refers to visual disabilities
• 15 to 20% of the people have dyslexia (IDA)
• Commonly found in men; 60-80% (APA)
• How to design user interface (UI) also for people with dyslexia?
• How many studies have you heard/read/saw about dyslexia?
3
Objective
• Bring to light some specificities of dyslexia
• Review literature on dyslexia and Web accessibility
• Synthesize techniques and guidelines to avoid/eliminate accessibility barriers
• Organize guidelines considering maintainers’ roleso Developerso Designerso Content producers 4
Understanding dyslexia
• Dyslexia has a Greek origino "dis" means disordero "lexia" means language
• Dyslexia is a language disorder
• Neurology views dyslexia as a neurological disorder of genetic origin
• Dyslexia is also viewed as having multiple factors (biological and functional)
5
Understanding dyslexia
• People with dyslexia have difficulties to understand written words and sentences
• People with dyslexia can benefit from usingo Screen readerso Voice recorderso Voice synthesizerso Spell checkerso Screen magnifiers
6
Understanding dyslexia
• However, dyslexia does not meano Low intellectual levelo Low intelligenceo Low educational attainmento Disease
• It is a specific brain impairment related to language processing.
7
Understanding dyslexia→ Diagnosis
A) Reading achievement [...] is substantially bellow that expected [...].
B) The disturbance in Criterion A significantly interferes with academic achievements or activities of daily living that require reading skills.
C) If a sensory deficit is present, the reading difficulties are in excess of those usually associated with it. (DSM-IV)
8
Methodological→ Stance
• Universal Design (UD): o Design of something that is usable by everyone, in
the widest possible extension, without the need for adaptation or specialized design
• Inclusive Design (ID)o Considering the needs of all users in mainstreams
applications, not only in systems especially designed for people with disabilities
• This work follows UD and considers ID in the whole process
9
Methodology→ Procedure1. Collect outcomes involving dyslexia and
Web accessibility (from organizations, papers, and guidelines)
2. Cluster extracts3. Compile and write them in a guideline style4. Organize guidelines according to UI
elements they refer5. Set a priority level according to website
maintainers’ roles (i.e., developers, designers, and content producers)
10
Results→ Groups identified
1. Navigation
2. Text presentation
3. Writing
4. Layout
5. Images and charts
6. End user customization
7. Markup
8. Colors
9. Videos and audios 11
Results→ Guidelines per group
12
Results→ Relevance levels
13
Results→ Guidelines examples
1. Navigationo Structure index pages considering logical order
involving task sequence or structureo Provide self completion and orthographic correction
in internal search
14
www.google.com
Results→ Guidelines examples
2. Colorso Avoid pure white as the background, because white
can obfuscate the text for people with dyslexia;a close alternative is the light gray (#FFFFE5)
15
Results→ Guidelines examples
3. Text presentationo Do not use justified alignment due to irregular
spacing between wordso Avoid fonts with serif
o How many 8s and Gs are presented bellow?
16
g
gg g
g
g
g8
8
88
8
8
88
Results→ Guidelines examples
4. Writingo Use short and common wordso Use active voice
o Instead of: The login is needed in order to use the system
o Use: You need to login into the system
17
Results→ Guidelines examples
5. Layouto Provide white space among UI elementso Avoid large columns of texts
18
“Horatio says 'tis but our fantasy, And will not let belief take hold of him Touching this dreaded sight, twice seen ofus: Therefore I have entreated him along With us to watch the minutes of this night; That if again this apparitioncome, He may approve our eyes and speak to it.” (Shakespeare)
“Horatio says 'tis but our fantasy,And will not let belief take hold of himTouching this dreaded sight, twice seen of us:Therefore I have entreated him alongWith us to watch the minutes of this night;That if again this apparition come,He may approve our eyes and speak to it. ”(Shakespeare)
Results→ Guidelines examples
6. Images and chartso Avoid moving or blinking imageso Use images, charts, and pictures to complement
textual information
19
Results→ Guidelines examples
7. End user customizationo The website should be easily customizableo Provide color scheme, font type, and text size
customization features
20
www.dyslexia-parent.com/mag35.html
Results→ Guidelines examples
8. Markupo Code so that the website can be read by screen
readerso Guarantee that markup is valid
21validator.w3.org
Results→ Guidelines examples
9. Videos and audioso Do not play them automatically when the page loadso Do not rely only on one media to provide content
22www.uol.com.br
Discussion
• Guidelines show convergence, but some conflicts have occurredo White background x light gray backgroundo Fluid design x width length
• WCAG directly cites dyslexia in success criteria (i.e., 3.1.5 Reading level)
• Lack of explicit consideration of dyslexia might divide users needs from maintainers
• End user customization plays a central role as a conflict solver 23
Conclusion
• Dyslexia is still not well understood
• Its specificities are not addressed by Web Accessibility standards
• Guidelines help on the understanding ofo Limitations of people with dyslexiao How to remove/avoid accessibility barriers
• Future works involveo Integration of the surveyed guidelines into other setso Explore solutions (e.g., end user customization)
24
Thank you!
Acknowledgements: FAPESP (grants #2009/10186-9 and #2011/06399-7) and UFABC for supporting this research
25