Web Accessibility Best Practices

Campus Information Technologies and Educational Services (CITES) and Disability Resources and Educational Services (DRES)

University of Illinois at Urbana/Champaign

Requirements

Non-W3C Technologies Authoring Practices
Functional
Requirements
Requirements and Benefits to Users Section 508 W3C WCAG 1.0
Standards
Support Web Standards
  • Validate resources to W3C specificiations
  • Avoid deprecated features of W3C specifications to insure interoperability with legacy, current and future user agents
  • Do not use proprietary markup that is not part of W3C specifications to insure interoperability with legacy, current and future user agents
  • none
Styling
Liquid Design for Content Reflow
  • Content adjusts to the font sizes and typefaces needed by people with visual impairments
  • Content adjusts to the screen resolution and pixel of density of graphical displays thereby allowing all users to scale content to the size of the graphical display they are using
  • Content adjusts to changes in width of the graphical window, minimizing the need for horizontal scrolling
  • none
Layout
  • When content is linearized by ignoring table markup and/or CSS positioning information it must make sense. This is important for people using portable devices and people with visual impairments who have disabled styling and tables or are using a speech synthesizer
  • Use stylesheets to control positioning and layout as much as possible to allow people to restyle content and make content compatible with portable web browsing devices
  • When using tables for layout, use simple table layouts and only include table cells for major blocks of content. Use CSS for positioning and styling within table cells
  • Avoid embedding tables since it often leads to content not linearizing well
  • 1194.22(d)
Color
  • Color must not be the only way to convey information (i.e. "press the blue button" ), since many people cannot distinguish different colors
  • Users with visual impairments can adjust foreground and background colors of text content to improve readability
  • 1194.22(c)
Fonts
  • Do not use images to stylize text since users can not restyle images to meet their needs
  • Use CSS to stylize fonts for interoperability
  • none
Navigation and Orientation
Unique Titles
  • Each page needs a unique title so users can maintain their orientation within a website
  • Use the title and h1 elements to uniquely title pages. The title element should contain both the website name and sub-page information. The h1 element should only contain the sub-page information
  • none
Headings
  • Users with visual impairments and physical disabilities can navigate to main topics of a web resource
  • 1194.22(o)
Menus and Navigation Bars
  • Users with visual impairments and physical disabilities can skip over repetitive navigation links
  • Users with visual impairments and physical disabilities can move to navigation bars
  • 1194.22(o)
Forms
  • Speech browsers can read the labels of form controls when the control receives user focus
  • Users with visual impairments can receive information about the label for a form control
  • 1194.22(n)
Language
  • Speech browsers automatically change languages, critical for web resources that contain two or more languages (e.g. foreign language courses)
  • none
Tabular Data Tables
  • Speech browsers automatically announce changes in data cell header information as a user navigates the content of table cells
  • Users can access text summaries of the table data. Summaries are important for large tables where patterns that can be detected visually cannot be discerned when using a speech reader or a smaller, enlarged portion of the table (e.g. handheld device)
  • 1194.22(g)
  • 1194.22(h)
Lists
  • Users with visual impairments can navigate the items in a list of information
  • none
Links
  • Link text should clearly indicate the target of a link
  • Speech users can listen to the link text to decide whether to follow the link
  • Server side and client side image maps need redundant text links
  • 1194.22(f)
Accesskeys
  • A limited number of consistently used accesskeys on a website provide keyboard shortcuts to the main navigation bar, main content and search feature
  • none
Frames
  • Frames should be avoided since changes in frames can be difficult to detect with assistive technologies
  • Frames need a title that clearly defines the function of the frame in a frameset
  • 1194.22(i)
Automation
Scripting
  • Do not automatically open content in new windows since this destroys the history of the user's browsing experience
  • Do not use the onChange event handler in combination with the SELECT element since this function has poor keyboard support for reviewing and selecting options in the select box
  • Provide a text description of the operation of dynamic interface elements to inform the user about functionalities supplied by the scripting
  • 1194.22(l)
Keyboard
  • Operation of automation or scripting functions can be done through the keyboard alone
  • 1194.22(l)
Objects and Applets
  • Plug-ins and applets should not be used when functionality can be provided through HTML or other accessibility techniques
  • If audio or video content is embedded, provide an option to view the audio and/or video in an external media player
  • 1194.22(m)
Animations (Flicker)
  • Do not cause content or background to flicker or blink as this may cause seizures in users with photosensitive epilepsy
  • 1194.22(j)
Timed Responses
  • Time response sensitive resources must give the user an alert and sufficient time to respond. An option to indicate more time is required
  • In systems that require user authentication, users can configure the system to provide them with the extra time they need to respond to timed operations
  • 1194.22(p)
  • none
Text Descriptions
Text Equivalents for Images, Pictures, Charts and Diagrams
  • People with visual impairments and blindness cannot use images and therefore need text descriptions to understand the content
  • Technologies like speech browsers and low resolution graphical/text devices cannot render graphics but can communicate the text equivalent instead
  • 1194.22(a)
Text Equivalents for Audio
  • People with hearing impairments cannot hear speech clearly or at all and need a text transcript of audio or synchronized captions for the audio portion of a video
  • 1194.22(a)
  • 1194.22(b)
Non-W3C Technologies Authoring Practices
Document Format Accessibility Conversion Issues
Microsoft Office Documents
Adobe PDF Documents
Macromedia Flash
  • Do not use flash when HTML technologies are available to do similar styling. Examples include:
    • Navigation bars in web pages
    • Text content in web pages
  • Provide captions and text captions for audio
  • Use Flash accessibility features