CMS Fridays: Designing Section 508 Accessible Websites

What is Section 508?

Section 508 is the section of the Rehabilitation Act that requires most websites, especially government sites, to be Section 508 compliant. Why is this important?

Ask Target. They were the first major corporation to be face a lawsuit (and more importantly, face a very expensive class-action lawsuit) over the accessibility of their site.

Now that I have put the fear of god in you, what can you do to make SharePoint accessible?

Just enough so you won’t be sued first.

Start with learning semantically correct and table-less HTML

Remember tables being used for layouts? That’s gone, and so is hacking together website layouts with inline styles. In the most literal of senses, it’s about learning HTML and CSS the way it was meant to be used: using style sheets to define everything, using headers like H1, H2 and H3 to establish hierarchy, and truly separating content from layout.

How effective is this in today’s CSS world, minus the occasional box model hack? Very. There was a site I built for a friend of mine, and we completely changed the order of content to make it more SEO friendly without changing the layout of the site. Seriously.

The best tip I was giving a developer I work with was how to define styles:

  • .style1. .header = bad
  • .style1 H1 = good

Using CSS styles and defining HTML elements is not only good practice, but works best and sends less HTML code down the pipe. Most importantly, remind editors and users that ALT tags, TITLE tags and LABEL tags not only mean something, they are very, very important to users that use alternate means to use websites.

Add tools that can be added easily and quickly

Start with the checklist of checkpoints listed by the W3C. Most of the items are more relevant to multimedia technologies like Flash, but it would be good to review them and understand them. Remember, you have to know what the rules are before you can break them.

Hi Software provides a set of master pages, web part plug ins and other tools, like this great conversion application that calculates font sizes in EMs. EMs are generally defined as the width of the letter M, and that can vary by font and by platform. By using EMs, this allows browsers to easily resize fonts.

The master pages released with the package contain a set of best practices, and the plug ins do some really simple search and replaces that correct some potential issues that can occur with screen readers. The plug ins are so simple to program, you could concievably write additional plug ins to catch other HTML issues before the users catch them.

Telerik’s rich content editor for SharePoint is not only fully packed with features, it’s jam packed also with accessibility features too, and much more accessible than the out of the box editor.

Test your site against the Cynthia Says tool. This will give you a list of changes you may have to make to make your site more accessible. For the record, there’s about 10 or so issues I need to fix to make this site more accessible.

Find other resources for tips

  • Planet MOSS has a great article about accessibility and tips
  • The Mossman reminds us that regular expressions are your friend
  • Chamina points out the exact pain points of SharePoint 2007 and accessibility

Don’t sweat the small things, and use common sense

The best approach is a common sense approach. Screen readers aren’t going to freak out on a single cell table, but they will freak out if the whole page is a set of tables. If you take the approach is that it’s about return on investment (hitting the highest risk areas, and leaving other areas to chance), you’ll be okay.