Practical Website Accessibility - A 2-Day Course

Website Accessibility Overview

• Why bother with website accessibility?
• What sort of website accessibility, and for whom?
• Different groups of disabled people
  • Deaf
  • Hard-of-hearing
  • Hearing-impaired
  • Blind
  • Visually-impaired
  • Low-vision
  • Mobility-impaired
  • Learning-disabled
  • etc
• Different accessibility problems
• Shared and common accessibility problems
• Web accessibility and ‘non-web’ accessibility
• Website accessibility standards
• Website accessibility tools and technologies
• Browser and platform compatibility

Assistive technologies

• Screen readers and aural interfaces
• Braille displays
• Switch-click input devices
• TDD/TTYs
• Modified keyboards, mice and similar input devices
• Magnifiers
• OCR
• Speech recognition
• Touch screens
• Head/eye control
• Word prediction and correction

Web Accessibility and UK Law

• Legal requirements
• Disability Discrimination Act (DDA)
• Disability Rights Commission (DRC)
• DRC Powers and DDA enforcement
• DDA Code of Practice and the WAI
• RNIB
• Remedies outside the courts
• Case studies

W3C Web Accessibility Initiative

• The WAI project
• The WAI’s Web Content Accessibility Guidelines (WCAG)
• 3 Levels of WCAG compliance: A, AA, AAA
• Key requirements of the WCAG
• Relationship between the WCAG and UK Government guidelines
• WCAG and compliance testing
  • Automated tests: Cynthia, Bobby, Web Exact, etc.
  • Manual checks and checklists

HTML Markup and Web Accessibility

• Understanding markup
• Page structure, presentation and semantics
• Choosing the right element
• HTML versus XHTML
• Strict versus Transitional versus Frameset DOCTYPEs
• Deprecated elements
• DOCTYPES and browser quirks modes
• Developer and designer tools
• Author tools and content management systems (CMS)

CSS Styling and Web Accessibility

• Separating content from presentation
• The cascade, inheritance, specifity
• Fonts, colours and other text properties
• Table-less page layout
• Using lists for navigation
• Columns and other layout techniques
• Specifying media
• Accessibility-specific media
• Aural stylesheets
• Print stylesheets
• Using :before and :after pseudo-classes

Accessible Images and Imaging

• The most ‘visible’ web accessibility problem (pun intended)
• Simple versus complex image problems
• Well-intentioned but counter productive accessibility methods
• The infamous alt="spacer.gif"
• Providing alternative text descriptions: alt, title and longdesc attributes
• Mixing alt and title safely
• Problems with using longdesc effectively
• Problems with D-links
• <object> versus <embed>
• The <iframe> option
• Arrows and bullets
• Ascii art
• Background images and borders
• Charts and Graphs: a really hard nut to crack
• Maps
• Outlines and hierchies
• Ratings
• Photo galleries
• SVG

Accessible Links and Navigation

• Usability and accessibility
• Key terms: tabs, navbar, etc.
• Understanding focus and cursors
• Consistent and unambiguous navigation structures
• How and why to skip navigation
• Skipping 2-part navigation structures
• Navigation skipping and search
• Other page landmarks
• Page extremities
• Identifying link destinations (with title)
• Linking to page fragments with and without conventional anchors
• Using name= and id= attributes
• Visible vs invisible anchors
• Problems with link destination markup
• Separating consecutive text links
• Specifying keyboard shortcuts for links
• accesskey
• (Browser) problems with accesskey
• accesskey tips and tricks
• Using the tab key for navigation
• tabindex
• Problems with the tabindex concept
• (Browser) problems with the tabindex
• tabindex and forms, including search
• tabindex and content management systems (CMS)
• tabindex tips and tricks
• Accessible imagemap navigation
• DHTML/JavaScript navigation: just say no
• Site Maps

Text and Colour

• The problem with text-only parallel sites
• Headers and tabbing
• Heading order and level
• Phrasal markup (em, strong, cite, etc.)
• Accessibility-related phrasal markup (abbr, acronym, etc.)
• Quotes, blockquotes and quotation marks (using the cite and lang attributes)
• Specifying language and encoding
• Type size, scalability, magnification and halation.
• Text quantity/complexity and the learning disabled
• Text colour and colour deficiencies (protanopia, deuteranopia, tritanopia, etc).
• Colour adjacency/overlap and colour combinations
• Estimated and system colours for links
• Text as images

HTML Tables

• Data tables versus layout tables
• Nesting and other things to avoid in table design
• Metadata in tables
• Using headers, footers and titles for data tables.
• Table structure
• col
• colgroup
• scope=""
• id=""
• Finding relevant data in cells
• Random access to table cells

Forms

• Problems with forms and assistive technology
• Keyboard control
• Moving to and within forms
• Form completion by selection
• Grouping form elements
• fieldset
• option and optgroup
• Associating labels with form elements
• Using title attributes
• Graphical buttons
• Pre-filled form fields
• Re-thinking form layout with serialisation in mind
• Predictive tyoing and error checking
• Dynamic (conditional) forms – provide parallel HTML-based advance
• Contacts: phone numbers, ‘text’ phones (TTYs) and relay services for the hearing impaired.
• Mail/print services and braille

Multimedia & scripting

• Audio versus video
• (Browser) problems with the multimedia object element
• Alternative data streams and captioning in multimedia formats (quicktime, Real, Windows media, Flash, MPEG, etc)
• Multiple alternate feeds
• Support for the Synchronised Multimedia Integration Language (SMIL)
• Microsoft’s non-standard Synchronised Access Media Interchange (SAMI)
• Problems with multimedia player interfaces
• Captioning options (DIY Anime versus professional agency captioning)
• Captioning and transcription styles
• Captioning tools: MAGpie, CCaption, etc.
• Transcription versus text description
• Text description versus audio narration
• Accessible Flash
• Issues with Javascript and other browser scripting languages.
• Providing keyboard-based alternatives to mouse events

Certification and Testing

• Choosing your Level of WCAG compliance: A, AA, AAA
• Deciding, publishing and auditing policy
• Retrofitting accessibility while updating old pages
• Retritting priorities: popular pages, essential pages, highly innaccessible pages, etc
• Priorities for new pages: WCAG Level 1 (A)
• Small exceptions to full compliance
• Testing with Cynthia
• The problem with Bobby
• Testing with screen readers
• Testing with human subjects: disabled and non-disabled
• Emacspeak

Coming and Future Options

• Serial versus random access
• Rich audio interfaces (not screen readers)
• Random access using metadata and standardised grammar for sections
• The database/CMS problem and open source software
• Repair tools ... A-Prompt on steroids?
• Training in subjective assessment