Evaluating cognitive web accessibility is can be challenging because it is very difficult to measure cognitive load, consistency, and other non-quantitative elements in an automated process. Despite these difficulties, SeoSamba does provide assistance in evaluating cognitive web accessibility.
We assembled all core principles that should be taken into account to bring your website to ADA compliance standards, here are most of them :
Assistive Technology Compatibility
Users with cognitive or learning disabilities often use screen readers or other assistive technologies to access content through various senses or to modify content to be best perceivable to them. Users with other physical or sensory disabilities also have a higher prevalence of cognitive or learning disabilities. The vast majority of error-icons indicate assistive technology errors or alerts . Below are particular items to be aware of when evaluating assistive technology support for users with cognitive disabilities.
Appropriate alternative text (Missing alternative text, Spacer image missing alternative text, Linked image missing alternative text, Image button missing alternative text, Image map missing alternative text, Image map area missing alternative text, Suspicious alternative text, Redundant alternative text, A nearby image has the same alternative text, Very long alternative text, Alternative text, Null or empty alternative text, Null or empty alternative text on spacer, Linked image with alternative text, Image button alternative text, Image map alternative text, Hotspot alternative text)
Form labels (Form label missing, Empty form label, Multiple form labels, Orphaned form label, Fieldset without a legend, Missing fieldset, Unlabeled form element with title, Fieldset, Form label) <input>, <select>, and <textarea> must have descriptive and informative form labels. Ensure that the form label is descriptive and informative and that all necessary information for completing that form element is available within the label. Groups of checkboxes and radio buttons should have a descriptive fieldset/legend.
Tables and table headers (Empty table header, Layout table, Date table, Row header cell , Column header cell) Table headers should adequately describe that column or row. Logical heading structure (Empty heading, Possible heading, Incorrectly ordered headings, Heading level 1 - Heading level 6)
Links make sense out of context (avoid "click here", etc.) (Empty link, Problematic link text)
- Avoid automatic refreshes or redirects.
- Allow users to control content updates or changes.
- Avoid unnecessary time-outs or expiration.
- Allow users to request more time.
Ensure required elements and formatting requirements are identified. Provide associated and descriptive form labels and field-sets/legends.
- Give users clear and accessible form error messages and provide mechanisms for resolving form errors and resubmitting the form.
- Give feedback on a user's actions
- Confirm correct choices and alert users to errors or possible errors.
- Provide instructions for unfamiliar or complex interfaces
- Use breadcrumbs, indicators, or cues to indicate location or progress
Allow users to quickly determine where they are at in the structure of a web site (e.g., a currently active "tab" or Home > Products > Widget, for example) or within a sequence (Step 2 of 4). Next/Previous options should be provided for sequential tasks.
Allow critical functions to be confirmed and/or canceled/reversed, provide adequate instructions and cues for forms (Form label missing, Empty form label, Multiple form labels, Orphaned form label, Field-set without a legend, Missing field-set, Unlabeled form element with title, Field-set, Form label)
Provide adequately-sized clickable targets and ensure functional elements appear clickable, use labels for form elements, particularly small check-boxes and radio buttons, and ensure all clickable elements appear clickable and do not require exactness.
Use underline for links only, provide multiple methods for finding content - a logical navigation, search functionality, index, site map, table of contents, links within body text, supplementary or related links section, etc. all provide multiple ways for users to find content.
Many of the items listed are things that you must check for yourself on the page. Some checkpoints may be difficult to measure or may not have a clear answer (for example, how do you tell if language is "simple"?). This checklist, however, should help you determine the general level of cognitive accessibility and can help you identify areas where improvements can be made.
- Ensure that navigation is consistent throughout a site
- Navigation placement, display, and functionality should not change from page to page.
- Similar interface elements and similar interactions should produce predictably similar results (Problematic link text)
- Support increased text sizes
- Increase the text size 200-300%. The page should remain readable and functional when text is increased.
- Ensure images are readable and comprehensible when enlarged
- Scale the page 200-300%. Content within images, particularly text, should be legible and understandable. Use true text instead of text within images when feasible.
- Provide content in multiple mediums (Link to media , <object> or <embed> , Flash)
- Video or audio alternatives provide an additional method of perceiving content. A text alternative (captions and/or a transcript) should be provided for video and audio content. Closed captioning, which gives users the option to turn off the captions, is optimal.
- Use contextually-relevant images to enhance content, Ensure color alone is not used to convey content
- Images can be used to convey or enhance content. Illustration, diagrams, icons, and animations can convey complex information.
- Pair icons or graphics with text to provide contextual cues and help with content comprehension
The design of a page (white space, color, images, etc.) should focus the user on what is most important (typically the body content of that page). Use white space and visual design elements to focus user attention.
Avoid distractions (Marquee, Blinking content): animation, varying or unusual font faces, contrasting color or images, or other distracters that pull attention away from content should be avoided. Complex or "busy" background images can draw attention away from the content. Avoid pop-up windows and blinking or moving elements. Use stylistic differences to highlight important content, but do so conservatively
Use various stylistic elements (italics, bold, color, brief animation, or differently-styled content) to highlight important content. Overuse can result in the loss of differentiation. Do not use italics or bold on long sections of text. Avoid ALL CAPS.
Organize content into well-defined groups or chunks, using headings, lists, and other visual mechanisms (Empty heading, Possible heading, Incorrectly ordered headings, Heading level 1 - Heading level 6, Ordered list, Unordered list, Definition list)
Break long pages into shorter sections with appropriate headings (use true and visually significant headings rather than simply big bold text). Each page should typically have one <h1> and heading levels should not be skipped. Very long pages may be divided into multiple, sequenced pages. Unordered, ordered, and definition lists provide a visual structuring and convey semantic meaning (e.g., an unordered list conveys a group of parallel items). Use shorter, multi-step forms for complex interactions, rather than lengthy, all-in-one forms.
White space is a design term that refers to empty space between elements in a page. It is not necessarily the color white. White space should be used to separate navigation from main body, body text from side elements and footer, main content from supplementary items (floating boxes, for example) and to separate headings, paragraphs, and other body text.
Avoid background sounds (<object> or <embed> , Flash). Give the user control over playing audio content within the page, or at a minimum, give the user control to stop the background sounds.
Contrast, Readability and Language
Use language that is as simple as is appropriate for the content. Avoid tangential, extraneous, or non-relevant information. Stick to the content at hand. Use correct grammar and spelling, se a spell-checker. Write clearly and simply. Maintain a reading level that is adequate for the audience
Readability tests can be performed on the body text (for accuracy, do not include web site navigation, side bar, footer, or other extraneous text elements in the evaluation).
Generally, web content should be understandable by those with a lower secondary education, though an elementary reading level may be necessary for some users with certain cognitive or learning disabilities. More complex content may necessitate diligence in implementing other recommendations in this list. Be careful with colloquialisms, non-literal text, and jargon.Expand abbreviations and acronyms - provide the full meaning in the first instance and use the <abbr> or <acronym> elements. Complex content may necessitate a glossary. Provide summaries, introductions, or a table of contents for complex or lengthy content. Provide the minimum amount of text necessary to convey the content.
Ensure text readability:
- Line height: The amount of space between lines should generally be no less than half the character height.
- Line length: Very long lines of text (more than around 80 characters per line) are more difficult to read.
Letter spacing, word spacing, and justification: Provide appropriate (but not too much) letter and word spacing. Avoid full justified text as it results in variable spacing between words and can result in distracting "rivers of white" - patterns of white spaces that flow downward through body text. Sans-serif fonts:These fonts are generally regarded to be more appealing for body text.
Adequate text size (Very small text): Text should generally be at least 10 pixels in size. Content appropriate fonts - visually appealing and content-appropriate fonts affect satisfaction, readability, and comprehension. Paragraph length: Keep paragraph length short. Ensure text is easily discerned against the background and that links can be easily differentiated from surrounding text. No horizontal scrolling: Avoid horizontal scrolling when the text size is increased 200-300%
Accessibility of Rich Internet Applications
ARIA enhances accessibility of interactive controls (such as tree menus, drag and drop, sliders, sort controls, etc.), provides content roles for identifying page structure (navigation, search, main content, etc.), areas that can be dynamically updated (called "live regions" in ARIA), better support for keyboard accessibility and interactivity, and much more.
ARIA is supported by most up-to-date browsers and screen readers. It is also supported by many scripting libraries. Although ARIA is not yet universally supported, when used with existing HTML and scripting accessibility techniques, it can provide additional accessibility support where it is supported while not causing compatibility issues where it is not yet supported.