Development of Accessible Edocuments and Programs for the

Development of Accessible Edocuments and Programs for the Visually Impaired Accessibility on the web (v 2011)

1. Important from last session • All webpages are processed before serving to a user, and served in special environment • Multiple columns are linearized (second is below the first. . . ) • Two-dimensional objects (tables, form fields with labels, horizontally ordered links. . . ) are linearized • Tables are linearized line by line

2. What is web accessibility? • Web accessibility refers to the practice of making websites usable by people of all abilities and disabilities. When sites are correctly designed, developed and edited, all users can have an equal access to information and functionality.

3. Different disabilities (1) • when a site is coded with semantically meaningful HTML, with textual equivalents provided for images and with links named meaningfully, this helps blind users using text-tospeech software and/or text-to-Braille hardware. • When text and images are large and/or enlargable, it is easier for users with poor sight to read and understand the content. When links are underlined (or otherwise differentiated) as well as coloured, this ensures that color-blind users will be able to notice them.

4. Different disabilities (2) • When pages are coded so that users can navigate by means of a keyboard alone, or a single switch access device alone, this helps users who cannot use a mouse or even a standard keyboard. • When videos are closed captioned or a sign language version is available, deaf and hard of hearing users can understand the video. • When clickable links and areas are large, this helps users who cannot control a mouse with precision.

5. Different disabilities (3) • When flashing effects are avoided or made optional, users prone to seizures caused by these effects are not put at risk. • When content is written in plain language and illustrated with instructional diagrams and animations, users with dyslexia and learning difficulties are better able to understand the content.

6. Web accessibility guidelines: WCAG (1) • There are different rule sets in different countries Web Content Accessibility Guidelines (WCAG 1. 0): • Published in 1999 • By Web Accessibility Initiative (WAI) a project by the W 3 C • Set of guidelines on making contents accessible, primarily for disabled users, but also for all user agents, including highly limited devices

7. Web accessibility guidelines: WCAG (2) • Rules are organized in three different priorities • 1: A Web content developer must satisfy this checkpoint. Otherwise, one or more groups will find it impossible to access information inthedocument. Satisfying this checkpoint is a basic requirement for some groups to be able to use Web documents.

8. Web accessibility guidelines: WCAG (3) • 2. A Web content developer should satisfy this checkpoint. Otherwise, one or more groups will find it difficult to access information in the document. Satisfying this checkpoint will remove significant barriers to accessing web documents. • 3. A web content developer may address this checkpoint. Otherwise, one or more groups will find it somewhat difficult to access information in the document. Satisfying this checkpoint will improve access to web documents.

9. Web accessibility guidelines: WCAG (4) • In recent years widely accepted as the definitive guidelines on how to create accessible websites • Frequently criticized because of getting out of step increasingly with today's technologies and techniques for creating and consuming the web • Since 2003 the WAI has been working on the second edition which aims to be up-to-date and more technology neutral • WCAG 2 was Released at the end of 2008 • Web (WCAG 1. 0): http: //www. w 3. org/TR/WAIWEBCONTENT/

10. WCAG 2 • 12 guidelines • Organized under 4 principles: perceivable, operable, understandable and robust • There are testable "success" criteria for each guideline • these are at three levels: A, AA, and AAA

11. Conformance • There are five requirements that must be met in order for the content to be classified as 'conforming' to WCAG 2. 0.

12. Requirement 1 • 1. Conformance Level: One of the following levels of conformance is met in full. • Level A: For Level A conformance (the minimum level of conformance), the Web page satisfies all the Level A Success Criteria, or a conforming alternative version is provided. • Level AA: For Level AA conformance, the Web page satisfies all the Level A and

13. requirement 2 • 2. Full pages: • Conformance (and conformance level) is for full Web page(s) only, and cannot be achieved if part of a Web page is excluded. • For the purpose of determining conformance, alternatives to part of a page's content are considered part of the page when the alternatives can be obtained directly from the page, e. g. , a long description or an alternative

14. requirement 3 3. Complete processes: • When a Web page is one of a series of Web pages presenting a process (i. e. , a sequence of steps that need to be completed in order to accomplish an activity), all Web pages in the process conform at the specified level or better. (Conformance is not possible at a particular level if any page in the process does not conform at that level or better. )

15. requirement 4 4. Only Accessibility-Supported Ways of Using Technologies: • Only accessibility-supported ways of using technologies are relied upon to satisfy the success criteria. Any information or functionality that is provided in a way that is not accessibility supported is also available in a way that is accessibility supported.

16. requirement 5 5. Non-Interference: • If technologies are used in a way that is not accessibility supported, or if they are used in a non-conforming way, then they do not block the ability of users to access the rest of the page.

17. Partial Conformance and Conformance Claims • page can partially conforming (third party content) • claims can cover more pages • claims are not mandatory • covered pages can be described by a list of urls, or by a regex

18. WCAG 2 Resources • wcag 2. 0: http: //www. w 3. org/TR/WCAG/ • Customizable quick reference: http: //www. w 3. org/WAI/WCAG 20/quickref/ • Česká verzia: http: //blindfriendly. cz/wcag 20 • Seriál Radka Pavlíčka zameraný na wcag 2: http: //zdrojak. root. cz/serialy/wcag 2 -0/

19. Web accessibility guidelines: U. S. Section 508 • "In 1998, Congress amended the Rehabilitation Act to require Federal agencies to make their electronic and information technology accessible to people with disabilities" • "Section 508 was enacted to eliminate barriers in information technology, to make available new opportunities for people with disabilities, and to encourage development of technologies that will help achieve these goals. " • "Under Section 508 (29 U. S. C. ‘ 794 d), agencies must give disabled employees and members of the public access to information that is comparable to the access available to others. " • url: http: //www. section 508. gov/

20. Web accessibility in Slovak legislation (1) • In 2006 Ministry of Transport and Telecommunications accepted a decree no. 1706/M-2006 covering standards for information systems of public administration The document also covers web accessibility standards What is mandatory: • The following first priority rules of WCAG: 1. 1, 1. 2, 1. 3, 1. 4, 2. 1, 2. 2, 3. 5, 3. 6, 4. 3, 5. 1, 5. 2, 6. 1, 6. 2, 6. 3, 7. 1, 9. 1, 10. 4, 11. 4, 12. 1, 12. 4, 13. 6, 14. 1 and 8. 1 if necessary. • The rules 5, 7, 9, 10, 11, 13, 14 defined in the document "Dokumentácia zásad prístupnosti webových stránok pre používateľov s ťažkým zrakovým postihnutím" (http: //www. blindfriendly. sk/blind-friendlyweb-navod. php)

21. Web accessibility in Slovak legislation (2) What is recommended: • The following list of WCAG 1. 0 rules (with priority 2 and 3): 1. 5, 3. 1, 3. 2, 3. 3, 3. 4, 3. 7, 4. 1, 4. 2, 5. 3, 5. 4, 5. 5, 5. 6, 6. 4, 6. 5, 7. 2, 7. 3, 7. 4, 7. 5, 8. 1, 9. 2, 9. 3, 9. 4, 9. 5, 10. 1, 10. 2, 10. 3, 10. 5, 11. 1, 11. 2, 11. 3, 12. 2, 12. 3, 13. 1, 13. 2, 13. 3, 13. 4, 13. 5, 13. 7, 13. 8, 13. 9, 13. 10, 14. 2, 14. 3 • See also this site: http: //www. blindfriendly. sk

22. Latest documents • Stránka s výnosom a všetkým čo k nemu patrí: http: //www. informatizacia. sk/standardyisvs/596 s#vynos_STD Výnos o štandardoch pre ISVS [č. 312/2010 Z. z. ]: http: //www. informatizacia. sk/ext_dok -vynos_a_prilohy_2010 -312/7431 c Metodický pokyn zatiaľ neexistuje

23. 1. Provide equivalent alternatives to auditory and visual content • Provide content that, when presented to the user, conveys essentially the same function or purpose as auditory or visual content • 1. 1[1] Provide a text equivalent for every non-text element (e. g. , via "alt", "longdesc", or in element content). This includes: images, graphical representations of text (including symbols), image map regions, animations (e. g. , animated GIFs), applets and programmatic objects, ascii art, frames, scripts, images used as list bullets, spacers, graphical buttons, sounds (played with or without user interaction), stand-alone audio files, audio tracks of video, and video.

24. 1. Provide equivalent alternatives to auditory and visual content • 1. 2[1] Provide redundant text links for each active region of a server-side image map. • 1. 3[1] Until user agents can automatically read aloud the text equivalent of a visual track, provide an auditory description of the important information of the visual track of a multimedia presentation. • 1. 4[1] For any time-based multimedia presentation (e. g. , a movie or animation), synchronize equivalent alternatives (e. g. , captions or auditory descriptions of the visual track) with the presentation.

25. 2. Don't rely on color alone • Ensure that text and graphics are understandable when viewed without color. • 2. 1[1] Ensure that all information conveyed with color is also available without color, for example from context or markup. • 2. 2[2 for images, 3 for text] Ensure that foreground and background color combinations provide sufficient contrast when viewed by someone having color deficits or when viewed on a black and white screen.

26. 3. Use markup and style sheets and do so properly. • Mark up documents with the proper structural elements. Control presentation with style sheets rather than with presentation elements and attributes. • 3. 5[2] Use header elements to convey document structure and use them according to specification. For example, in HTML, use H 2 to indicate a subsection of H 1. Do not use headers for font effects. • 3. 6[2] Mark up lists and list items properly. For example, in HTML, nest OL, UL, and DL lists properly.

27. 4. Clarify natural language usage • Use markup that facilitates pronunciation or interpretation of abbreviated or foreign text. • 4. 3[3] Identify the primary natural language of a document. For example, in HTML set the "lang" attribute on the HTML element. In XML, use "xml: lang". Server operators should configure servers to take advantage of HTTP content negotiation mechanisms ([RFC 2068], section 14. 13) so that clients can automatically retrieve documents of the preferred language.

28. 5. Create tables that transform gracefully • Ensure that tables have necessary markup to be transformed by accessible browsers and other user agents. • 5. 1[1] For data tables, identify row and column headers. For example, in HTML, use TD to identify data cells and TH to identify headers. • 5. 2[1] For data tables that have two or more logical levels of row or column headers, use markup to associate data cells and header cells. For example, in HTML, use THEAD, TFOOT, and TBODY to group rows, COL and COLGROUP to group columns, and the "axis", "scope", and "headers" attributes, to describe more complex relationships among data.

29. Table example (1) • How is this table processed by screenn reader? • What is wrong concerning the non-linear reading of this table?

30. Table example (2) Department Name Number It Jozef 53 Management Paľo 128 Logistics Lucia 34

31. Table example (3) • Problems with reading cel by cel • First column is automatically accepted as a row header • And is anounced after cursor moves to another line • wrong in third column • This can be fixed by using axis and headers options

32. Table example (4) • <table> <tr> • <th>Department</th> <th>Name</th> <th>Phone</th> • </tr> • <td id="dep 1" axis="Department: ">It</td> • <td id="nam 1" headers="dep 1" axis="Name: ">Jozef</td> • <td headers="nam 1">53</td> </tr>

33. Table example (5) • • <tr> <td id="dep 2" axis="Department: ">Management</td> <td id="nam 2" headers="dep 2" axis="Name: ">Paľo</td> <td headers="nam 2">99</td> </tr> • • <tr> <td id="dep 3" axis="Department: ">Logistics</td> <td id="nam 3" headers="dep 3" axis="name: ">Lucia</td> <td headers="nam 3">125</td> </tr> </table>

34. 6. Ensure that pages featuring new technologies transform gracefully. • Ensure that pages are accessible even when newer technologies are not supported or are turned off. • 6. 1[1] Organize documents so they may be read without style sheets. For example, when an HTML document is rendered without associated style sheets, it must still be possible to read the document. When content is organized logically, it will be rendered in a meaningful order when style sheets are turned off or not supported. • 6. 2[1] Ensure that equivalents for dynamic content are updated when the dynamic content changes.

35. 6. Ensure that pages featuring new technologies transform gracefully. • 6. 3[1] Ensure that pages are usable when scripts, applets, or other programmatic objects are turned off or not supported. If this is not possible, provide equivalent information on an alternative accessible page. For example, ensure that links that trigger scripts work when scripts are turned off or not supported (e. g. , do not use "javascript: " as the link target). If it is not possible to make the page usable without scripts, provide a text equivalent with the NOSCRIPT element, or use a serverside script instead of a client-side script, or provide an alternative accessible page as per checkpoint 11. 4.

36. 7. Ensure user control of timesensitive content changes • Ensure that moving, blinking, scrolling, or autoupdating objects or pages may be paused or stopped. • 7. 1[1] Until user agents allow users to control flickering, avoid causing the screen to flicker. Note. People with photosensitive epilepsy can have seizures triggered by flickering or flashing in the 4 to 59 flashes per second (Hertz) range with a peak sensitivity at 20 flashes per second as well as quick changes from dark to light (like strobe lights).

37. 9. Design for deviceindependence • Use features that enable activation of page elements via a variety of input devices. • 9. 1[1] Provide client-side image maps instead of server-side image maps except where the regions cannot be defined with an available geometric shape.

38. 10. Use interim solutions • Use interim accessibility solutions so that assistive technologies and older browsers will operate correctly. • 10. 4[3] Until user agents handle empty controls correctly, include default, placeholding characters in edit boxes and text areas. For example, in HTML, do this for TEXTAREA and INPUT.

39. 11. Use W 3 C technologies and guidelines • Use W 3 C technologies (according to specification) and follow accessibility guidelines. Where it is not possible to use a W 3 C technology, or doing so results in material that does not transform gracefully, provide an alternative version of the content that is accessible. • 11. 4[1] If, after best efforts, you cannot create an accessible page, provide a link to an alternative page that uses W 3 C technologies, is accessible, has equivalent information (or functionality), and is updated as often as the inaccessible (original) page.

40. 12. Provide context and orientation information. • Provide context and orientation information to help users understand complex pages or elements. • 12. 1[1] Title each frame to facilitate frame identification and navigation. For example, in HTML use the "title" attribute on FRAME elements. • 12. 4[2] Associate labels explicitly with their controls. For example, in HTML use LABEL and its "for" attribute. • <label for="idname">Meno: </label> <input type="text" id="idname" />

41. 13. Provide clear navigation mechanisms. • Provide clear and consistent navigation mechanisms -- orientation information, navigation bars, a site map, etc. -- to increase the likelihood that a person will find what they are looking for at a site. • 13. 6[3] Group related links, identify the group (for user agents), and, until user agents • do so, provide a way to bypass the group.

42. 14. Ensure that documents are clear and simple. • Ensure that documents are clear and simple so they may be more easily understood. • 14. 1[3] Use the clearest and simplest language appropriate for a site's content.

43. 8. Ensure direct accessibility of embedded user interfaces. • Ensure that the user interface follows principles of accessible design: device-independent access to functionality, keyboard operability, self-voicing, etc. • 8. 1[1/2] Make programmatic elements such as scripts and applets directly accessible or compatible with assistive technologies [Priority 1 if functionality is important and not presented elsewhere, otherwise Priority 2. ]