1 / 16

Accessibility

Accessibility. Catchup & Required re-do's of projects Sorting and column example W3I quick tips, sources HW: Screen reader exercise. Majors. Sorting & columns. 2 phase xml to xml (done using Saxon) (modified) xml to html 1 st phase uses substring and creating of [new] xml tags

finkel
Download Presentation

Accessibility

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Accessibility Catchup & Required re-do's of projects Sorting and column example W3I quick tips, sources HW: Screen reader exercise. Majors.

  2. Sorting & columns • 2 phase • xml to xml (done using Saxon) • (modified) xml to html • 1st phase uses substring and creating of [new] xml tags • 2nd phase uses feature that absence of tags can be ok • 2nd phase uses <xsl:sort> • [for the columns] uses position() and mod

  3. from Macromedia • An accessible website: • can be perceived • can be navigated • can be utilized (with keyboard or devices other than mice) • can be easily understood (even in attention-poor situations) • Accessibility and usability are closely related, as they both improve satisfaction, effectiveness, and efficiency of users. But while accessibility is aimed at making the website open to a wider user population, usability is aimed at making the target population of the website happier, more efficient, more effective.

  4. Repent from Flash Sinshttp://smw.internet.com/symm/voices/flashsins/ Today's Flash is like the green shag rug from the 70s. Four Flash sins listed: • The "Hidden" Button • Annoying Audio and Graphics • Failing to Test • But It's Art Dammit!

  5. Section 508 guidelines by Macromedia & UofWisconsin (Blair Bundy & Tim Dugdale) (a) A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc", or in element content). (b) Equivalent alternatives for any multimedia presentation shall be synchronized with the presentation. (c) Web pages shall be designed so that all information conveyed with color is also available without color, for example from context or markup. (d) Documents shall be organized so they are readable without requiring an associated style sheet. (e) Redundant text links shall be provided for each active region of a server-side image map. (f) Client-side image maps shall be provided instead of server-side image maps except where the regions cannot be defined with an available geometric shape. Priority 1194.22(a)

  6. (g) Row and column headers shall be identified for data tables. (h) Markup shall be used to associate data cells and header cells for data tables that have two or more logical levels of row or column headers. (i) Frames shall be titled with text that facilitates frame identification and navigation. (j) Pages shall be designed to avoid causing the screen to flicker with a frequency greater than 2 Hz and lower than 55 Hz. (k) A text-only page, with equivalent information or functionality, shall be provided to make a web site comply with the provisions of this part, when compliance cannot be accomplished in any other way. The content of the text-only page shall be updated whenever the primary page changes. (l) When pages utilize scripting languages to display content, or to create interface elements, the information provided by the script shall be identified with functional text that can be read by assistive technology.

  7. (m) When a web page requires that an applet, plug-in or other application be present on the client system to interpret page content, the page must provide a link to a plug-in or applet that complies with §1194.21(a) through (l). (n) When electronic forms are designed to be completed on-line, the form shall allow people using assistive technology to access the information, field elements, and functionality required for completion and submission of the form, including all directions and cues. (o) A method shall be provided that permits users to skip repetitive navigation links. (p) When a timed response is required, the user shall be alerted and given sufficient time to indicatemore time is required.

  8. from IBM (general usability and highly relevant to accessibility) The Prime Evils of user-experience design: • Confusing navigation and unexpected behaviors • Slow response time • Bleeding-edge technologies • Poor (or omitted) user testing • Off-the-cuff design services

  9. QUICK TIPS TO MAKE ACCESSIBLE WEB SITES Images & animations. Use the alt attribute to describe the function of each visual. Image maps. Use the client-side map and text for hotspots. Multimedia. Provide captioning and transcripts of audio, and descriptions of video. Hypertext links. Use text that makes sense when read out of context. For example, avoid "click here." Page organization. Use headings, lists, and consistent structure. Use CSS for layout and style where possible. Graphs & charts. Summarize or use the longdesc attribute. Scripts, applets, & plug-ins. Provide alternative content in case active features are inaccessible or unsupported. Frames. Use the noframes element and meaningful titles. Tables. Make line-by-line reading sensible. Summarize. Check your work. Validate. Use tools, checklist, and guidelines at http://www.w3.org/TR/WCAG (c) W3C (MIT, INRIA, Keio) 2001/01

  10. Side benefit • Creating alt tags with meaningful descriptions (phrases with keywords) contributes to search engines (e.g., google) storing information on sites. • Also, use meta tags, descriptions on pdf documents, and any other 'alternative' file types.

  11. Table <table border="1" summary="This table gives some statistics about fruit flies: average height and weight, and percentage with red eyes (for both males and females)."> <caption><em>Statistics</em> about fruit flies</caption> <tr><th rowspan="2"><th colspan="2">average <th rowspan="2">red<br>eyes <tr><th>height<th>weight <tr><th>males<td>1.9<td>0.003<td>40% <tr><th>females<td>1.7<td>0.002<td>43% </table>

  12. Suggestions Inspired (but not limited to) readers with some vision and/or senior citizens, but requiring magnification • Group related material. Place action buttons close to related text & images. • Do not put links too close together (requiring great dexterity). • Do not assume (graphics only) icons are obvious (even if you include onMouseOver text).

  13. Accessibility Internet Rally • California based competition scheduled for September 21, 2002. • http://www.aircalifornia.org/

  14. Usability/accessibility checkers http://www.usablenet.com/ Found following problems in my site: • no link back to home page from 3 pages • img tags without width AND height • this checker advises always using actual width & height. • put meta tag keywords in all pages • make all titles less than 64 characters • missing alt tag • (standard links) • (problem with studentdatadisk)

  15. Exercise • Locate a site and do the usability check. • (Can try Purchase sites) Another checker is: http://bobby.watchfire.com/bobby/html/en/index.jsp

  16. Homework • Do screenreader simulation (try to do tasks) http://www.webaim.org/simulations/screenreader • Continue checking usability for any site • Find other on-line checkers and report.

More Related