Introduction
Clinical diagnoses of cognitive disabilities include autism, Down Syndrome, traumatic brain injury (TBI), and even dementia. Less severe cognitive conditions include attention deficit disorder (ADD), dyslexia (difficulty reading), dyscalculia (difficulty with math), and learning disabilities in general.
For the purposes of web accessibility, classifying cognitive disabilities by functional disability is more useful. Functional disabilities focus on the resulting abilities and challenges. Some of the main categories of functional cognitive disabilities include deficits or difficulties with:
- Memory
- Problem-solving
- Attention
- Reading, linguistic, and verbal comprehension
- Math comprehension
- Visual comprehension
- Language comprehension by everyone
We would also consider Language; most people living in Qatar do not comprehend Arabic or English as a first Language. For many people living in Qatar, Language itself can be an impairment.
ICT Platforms
- Websites
- Mobile / Devices and Applications
- Computer Applications
- eLearning
- Kiosk / ATM
Assistive Technology (AT) Devices for people; Cognitive and Learning
- Screen, Magnifier / Reader
AT used for testing
- Zoomtext with Speech; https://www.zoomtext.com/
Making content accessible for people who are; Cognitive and Learning
- Language; Arabic and English Website:
- In Qatar, all websites must be bi-lingual; Arabic and English
- The written languages of web content in Arabic and English must be simple and concise as Arabic and English languages are not the first languages of all residents living in Qatar
- It is possible that some people with Cognitive and Learning disabilities also use screen reading software to assist with comprehension of Arabic and English text;Language of Page
Use Arabic and English language specifications in both Web Sites, this is required for usability of Assistive Technology (AT) users.
Use the following code:
Arabic text; < HTML lang=”ar” xml:lang=”ar” dir=”rtl” >
English text; < HTML lang=”en” xml:lang=”en” dir=”ltr” >Arabic and English Website: Language of Parts
If English text is written in the Arabic website, make sure the Language and Reading Direction attribute is used for all English text;
English text; lang=”en” xml:lang=”en” dir=”ltr”
If Arabic text is written in the English website, make sure the Language and Reading Direction attribute is used for all Arabic text;
Arabic text; lang=”ar” xml:lang=”ar” dir=”rtl”
Attributes may be applied to; <p>, <span>, <div>, etc…
Whenever there is a change in language, use the language attribute so Assistive Technology (AT) users are able to differentiate between Arabic and English text. This especially applies to AT users who use text to speech technology such as screen readers.
- Navigation and Functionality
- Ensure all navigation and functions are simple and consistent in appearance, location
- All dynamic content and functionality behave and operate in a predictable manner
- Multiple ways; Providing an opportunity to navigate sites in more than one way can help people find information faster
- Provide site map
- Use breadcrumb navigation
- Timing Adjustable: For each time limit that is set by the content, the user should have the ability to; Turn Off, Adjust or Extend the time. There are exceptions on online time dependent functions such as; Online Auctions
- Pause, Stop, Hide: For moving, blinking, scrolling, or auto-updating information / content;
- There is a clear mechanism to pause, stop or hide the content
- Auto updating information: control the frequency of the update
- Text
- Minimum Text Size should be CSS 95-100 % on English website, for Arabic website; 125-140 %
- Use Arial or Verdana font
- Use Bold text on all Menus
- Avoid using styles such as; drop shadow, strike through
- Use italic styles with Bold text
- Color contrast minimum ratio must be 4.5:1 and higher. High colour contrast between text and background must be achieved
- Use descriptive link phrases, avoid using link phrases like; “click here”, “More”, “Read More”, etc and avoid repeating duplicate link phrases that link to different URL’s. Use accessible link phrases like; “Read More About Mada”
- Links in the content body of the document should be underlined so it is easily distinguishable from read only text. Never use Underline only for styling effects. All other links; underline links on focus from keyboard or mouse
- Document Structure, Layout and Design
- Use nested Heading elements for document structure; best practice; H1 page title, H2 headings, H3 sub-headings
- Use List element; ordered or unordered for list of items
- CSS disabled mode, all web pages must usable. Make sure all pages display and function properly with CSS disabled
- Consider creating multi modal Accessibility features in the website for adjusting Text Size and Colour Schemes by creating several different style schemes in CSS. Some people with Dyslexia prefer low contrast text
- Use the ABBR element to denote and expand any acronyms that are present. Example; <abbr title=”World Wide Web”>WWW</abbr>
- Layout and Design
- Keep web content minimal and simple
- Provide a good balance of graphic elements and text
- Reduce the number of colours and keep the website design simple
- If possible, try to use at most; 2 column layout in all web pages
- Avoid using strong busy backgrounds, example: Using a busy photo as a background.
- Keep the website design and layout consistent and simple
- Clearly define different sections of a webpage with headings and organize content so it is located consistently on repeating pages
- Create simple, usable, visual layout of all web content and use a consistent style of presentation between pages.
- Space: minimize space in between content to 1 or 2 space; character space
- Left Align English content, also left align table headers, buttons and headings, etc … Right align all Arabic content
- Page Titles. All title elements must be uniquely labeled to describe content of each webpage. Use page level descriptions, similar to way breadcrumb navigation is described. Examples of good practice;
<Title> Ministry of Public Health, Home </Title> <Title> Ministry of Public Health, Services, Department </Title> - Data Tables; If possible, avoid using Tables only for layout purposes. Tables should be used to present tabular data. Make sure the following table structure elements are used; Table Header TH and Table Caption, title of table
- Form Fields
- Labels must be visible and placed above form controls
- Form Validation messages must be accessible and usable. The error messages must be grouped and placed above the form fields starting the message with Required field; Attention or Error.
OR Create accessible dialogue window message for each instance of failed validation. It is very important to clearly identify which form field failed to validate - Avoid using Red colour by itself to communicate error messages; Best practice to actually write word Error, Attention or Required field with Red colour text. When using read text, use darker shade with at-least 6:1 colour contrast.
- Always provide a button for submitting forms whenever the form element is used. As a best practice, avoid creating only input fields by itself. If image buttons are used, describe the form process / action
- Multimedia
- All downloadable documents must be accessible (Word, PDF)
- If Audio is embedded or used in any way to add context; provided separate link to accessible text transcript file; Word, PDF or HTML page. Ensure the text transcript uses document structure; Headings at the least
- If videos are used and there is no Spoken Dialogue;
- Ensure there is Narration / Audio description of visual
- Do not substitute Narration / Audio description with only music
- If videos are used; provide synchronized Subtitle / Caption for;
- Spoken Dialogue
- Narration / Audio description
- Describe sounds that add context to video content
If possible, provide information in multiple formats with more emphasis on visuals; E.g. text, images and video