Accessibility

Web accessibility refers to the inclusive practice of removing barriers that prevent interaction with, or access to websites or content, by people with disabilities. When sites are correctly designed, developed and edited, all users have equal access to information and functionality.

Why create accessible sites?

  • You are legally bound by Americans with Disabilities Act
  • Accessible technology has opened up the world for people with disabilities
  • Coding for accessibility results in faster load times, fewer bugs, improved SEO and support for more devices

Columbia Sites already meet WCAG AA standards.  In order to keep accessibility to this standard, there are several areas website maintainers/content writers need to be aware:

  • Content
  • Images
  • Documents

Content

The single most important concept when writing content is to keep all it short and simple.  Simplified content benefits everyone:

  • Users with cognitive difficulties
  • Users quickly scanning a page 
  • Mobile users reading on-the-go
  • Users where english is a second language

Guidelines

  • MOST IMPORTANT: Keep content short and simple.  
  • Aim for your content to read at a 10th grade level.  There are many tools on the web to test the grade level of content. Readability checker will grade your content (NOTE: Use “test by direct link” tab)
  • Use capitalization sparingly
  • Avoid acronyms and always spell out on first reference
  • Use built-in bulleted or numbered lists, with multiple levels using different numbering schemes on each level
  • Make link text descriptive; never use "click here"
  • Don’t underline text that is not a link

Images

Image Creation

  • Avoid bright strobing images, which can cause photoepileptic seizures.
  • Make sure colorblind users can understand images that use color to convey information.  The tool Vischeck removes color from a webpage to help with your assessment.
  • Do not use images for text.  Use real HTML text instead.

Image Alternative (ALT) Tags

Every time you upload an image to your site, you must enter an ALT tag.  Screen readers read ALT tags for users who cannot see the images.

 

  • Make your ALT tag descriptive of the image in its context on the page
  • Aim for tag not to exceed 150 characters
  • If the image is not important make the ALT tag “”

Document Guidelines

Document Creation

The core steps needed for accessibility are the same regardless of whether your document is in HTML, Microsoft Word, Adobe PDF, or another document format:

  1. Use headings.
  2. Use lists.
  3. Use ALT text for images.

Additional Resources

Page Headings

  • All sections on the page must use headers.
     
  • Headers must be used to signify sections of content.
    • Must use built in header formatting
    • Do not use your own bolding or formatting for headers.
       
  • Headers must be nested correctly. 
    • The first header MUST be H2. Sub headers cannot skip any levels.
    • Example: H2 > H3 CORRECT
    • H2 > H4 WRONG
       
  • Headers cannot be used to emphasize content