You are here

Web Accessibility: Making Your Web Content Accessible for Everyone

What's Accessibility and Why is it Important?

'Accessibility' refers to the production of content that is equally available to all users regardless of their means of access. For instance a blind individual may use screen reading software to have the content of a web page read aloud, where the page should provide text descriptions of any images users or coded explanations of any content purely provided visually. It is also a legal obligation of the University and CSU system to make all of our web resources available to everyone on an equal basis.

Making your Content Accessible

Everyone is responsible for accessibility. Most CSULB content editors are working within a web content management system where templates are controlled by web administrators. This doesn't mean web content editors aren't responsible for the accessibility of their content.

Key items all content editors should keep in mind when developing web content:

Alt-text

  • Screen reading software reads alt-text in place of images.
  • All images provided by content editors on the CSULB website require alt-text, short concise descriptions of what the image display.
  • If there's text on the image it needs to replicated in the alt-text. For text-heavy images such as an infographic, long descriptions can be used. Please consult with your area's web leader for help with this.

Headers

Suggested heading structure

  • Header should be used to break up the content of your web page into sections and subsections.
  • There should be just one 'Heading 1' on your page (your web content management system may create this automatically).
  • Headers should nest within each other. The image to the right shares an example of headers properly nesting within one another. 
 

Tables

  • Use row and column headers when placing tables on the web.
  • Try to only use simple tables on the web. Complex, multi-layered and nested tables may benefit more from other means of production.
  • Always use a heading or caption to identify the title of your table.

Color Use and Contrast

Contrast examples

  • Low contrast color pairings such as yellow text on a white background can be extremely difficult for users to comprehend.
  • Standards for contrast are explained on the WebAIM site.
  • Use of color only to convey meaning, such as using a red or green checkmark to denote success or failure, need to be paired with text to identify the meaning of the visual.
 

Testing your content

Accessibility testing tools can show you where you may need to update your content to be standards compliant:

  • Compliance Deputy – a browser plugin will be rolled out to CSULB content editors with training and support from the University ATI Corrdinator.
  • The WAVE Tool from WebAIM provides quick, in-browser checking of your content.

Both of these tools will point toward accessibility issues that require manual evaluation, such as color contrast of text on images, or layouts that can't handle extreme magnification. It's important to not ignore the listed manual review items from these tools and of course please consult with your web lead if you have questions.

Feel free to contact our Webteam with any questions of course regarding the accessibility of your content.

Where to go for Support with Accessibility