So what are the accessibility issues with cascading style sheets? The first issue is that some people use browsers that do not support Cascading Style Sheets, or, they may have style sheets turned off so they can enable a style sheet of their own. In either case, you need to make sure that your pages are readable when style sheets are turned off. In fact for the most part, screen readers read pages as if style sheets were turned off.
Here is the Section 508 standard for style sheets:
Â§1194.22 (d) Documents shall be organized so they are readable without requiring an associated style sheet.
You need to check your site with style sheets turned off. Again the the Web Accessibility Toolbar comes to the rescue. Use CSS menu, Disable CSS. It can be quite enlightening.
Without the Web Accessibility Toolbar it is really difficult or impossible to turn off the effects of style sheets. If it is your page, and all the styling is in style files, then rename those files and checkout the page because Internet Explorer doesn't have a way of turning off all effects of style sheets.
In Internet Explorer to approximate not having style sheets:
For an empty style sheet just use Notepad to create a file and save it as empty.css. Then specify that file and correct path in the Accessibility dialog. This process is effective for font and color on the page; but has no effect on other aspects of CSS like positioning and visibility.
Firefox does a good job of turning off style sheets. Use the View Menu, Page Style, No Style.
This tutorial is based on Webucator's Web Accessibility and Section 508 Training for Experienced Web Designers Course. We also offer many other Web Accessibility Training courses. Sign up today to get help from a live instructor.