People are spending more and more time on the Internet each day.  Whether you are shopping for the best price on a new appliance, researching the topic for your term paper, or looking for trailers of that new movie, chances are you turn to your computer and search the Internet for answers.  Social media sites have capitalized on this knowledge that people are spending more time online.  Sites like Facebook and Twitter understand that people are rarely writing letters to their friends through the post, just like they are starting to stray away from shopping out of catalogs or reading printed newspapers. How many of these social media sites have taken the initiative to make sure their web sites are accessible to people who use screen reading software on their computers?

I stumbled across Accessible Twitter yesterday, an alternative to the standard Twitter.com, a site that allows people to write short status updates in order to spread information rapidly.  Accessible Twitter was created by Dennis E. Lembree, a web site professional whose personal passion is to create and share the importance of accessible web sites. Dennis has stated on his web site that he’s rebuilt the the popular Twitter web site with web accessibility and web standards.

If you have a Twitter account, you can enter in your username and password on Accessible Twitter just like you would on the standard version.  If not, simply make a Twitter account on Twitter.com.

Here we will evaluate how Twitter.com’s accessibility stands up to the WAVE Toolbar, a Firefox plugin that allows one to detect accessibility errors.  This is an image of what you would see once you log-in to the standard Twitter.com after running the WAVE Toolbar:

Twitter after WAVE Report

Twitter after WAVE Report

And this is an image of what you see when you log-in to Accessible Twitter and run the WAVE Toolbar:

Accessible Twitter after WAVE report

Accessible Twitter after WAVE report

Notice that Accessible Twitter has zero accessibility errors!  What’s more important is that all of the links on the page have been titled.  On standard Twitter, you might see an image that you click on to send a direct message.  Accessible Twitter has linked that image with text, along with all other images on the page, including personal avatars.

The WAVE Toolbar finds no errors on the Accessible Twitter page, while the standard Twitter page has eight accessibility errors.  Many of the links in standard twitter are named but the titles do not make sense to what they are linking to.  Lembree’s site has won accessibility awards while pushing for all major web sites to follow web accessibility standards.  For more information on Accessible Twitter and Lembree’s other projects, visit his web site and his blog, or check out @AccessibleTwitr on Twitter!  And while you’re at it, check us out on Twitter @ESCrossroads!

Have you ever wondered how accessible your web site is? Or are you a web designer who would like to know about making a web site easier for people with screen reading software to access?  The WAVE toolbar can answer those questions for you.  This Firefox add-on was created by WebAIM – Web Accessibility In Mind – and is absolutely free.   WAVE allows you to find out if your web site is up to current Section 508 standards and guidelines set by the Web Accessibility Initiative.

Simply open Firefox or download the browser and go to the WAVE Toolbar web site.  Once you download the add-on, you must restart Firefox.

To run the WAVE toolbar, open Firefox and type in a web address.  Then, click on any of the icons in the toolbar to get a WAVE report of the accessibility.

Colored icons will then appear on the web page, where different colors indicate specific alerts with the content on the page.  If you put the cursor of your mouse over the colored icon, a box will appear that will explain the alert.  Common alerts are:

  • An error will be present if an image is not linked to text.  All of the images in the INDATA blog are appropriately labeled with text that makes sense to the image to avoid this issue.
  • “Problematic Link Text” means that the text for a link does not make sense to the screen reader.  An example would be if you make the letter “A” a link for the text on the screen to get bigger.  The screen reader is not going to know what “A” is.  An alternative option would be to make a link that says “Enlarge Text on Page.”
  • “Pop-up Window” is an alert that tells the user a pop-up window will occur if they click on the link.
  • “Alert to PDF” lets a person know that clicking a link will bring up a PDF document.

You’ll notice that the indicators often appear around links, pictures and tables.  This can give you an indication of how a person who uses a screen reading software will read the page. Here is an image of what the WAVE looks like when used on the INDATA blog site:

WAVE test on INDATA Blog

WAVE test on INDATA Blog

California State University has a web site that offers more instruction on the difference indicators that will show up after running the WAVE toolbar, and the WAVE blog can keep you informed on upgrades.

INDATA works with business in Indiana to review their web sites’ accessibility.  If you are interested in learning more about how to make your web site accessible and you are located in Indiana, contact me at scroft@eastersealscrossroads.org.  My next post will include information on accessibility concerning social media sites.

© 2010 Indiana Assistive Technology Blog Suffusion WordPress theme by Sayontan Sinha