Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Screen Reader compliancy 2

Status
Not open for further replies.

skiflyer

Programmer
Sep 24, 2002
2,213
US
I'm developing some new sites, and it's important to me that they're fully useable with screen readers.

However, I don't have any screen readers or even access to them, I was wondering if anyone had experience designing accessible websites, and if so if you have any good advice on resources to help me do it right.
 
basically same as for a SE crawler friendly site plus some extras.

Don't require cookies
Avoid javascript driven menus
definitely no flash
Use descriptive title attributes on links
Use descriptive alt attibutes on important images (use alt="" on spacer images)
Use correct semantic markup for (X)HTML. Headers (<hn> tags) in the correct order, paragraphs (<p>) for grouping content etc
Use CSS for layout instead of nested tables, simply because screen readers read tables L to R across the rows so depending on how the page is set up, it could lead to the content being disjointed.
Use tables for tabular data, use headings <th> and add a summary attribute to the table.
use skip navigation/go to content links

Visit Accessify Forum many of your questions will have been answered.



Chris.

Indifference will be the downfall of mankind, but who cares?
Woo Hoo! the cobblers kids get new shoes.
People Counting Systems

So long, and thanks for all the fish.
 
I would say that it's OK to use the things Chris said not to do, such as Javascript or Flash PROVIDED that they do not offer core content. It should be possible to easily get information from your site whithout those technologies.

Alwasy think about link text if it is taken out of context.
Avoid repetition of link text.

Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r
 

To add to (and emphasise) some of what has already been posted:
- Look to use <label> tags a lot -- especially for form elements.
- Ensure that your site HTML reads well from "top to bottom"... by that I mean that if you were to remove all the HTML tags - would the site still read well (as a text file)?
- Making sure your page validates to the doctype you choose is a definite.
- Look at moving "screen furniture" images (rounded corners and stuff you would use for visual appeal only) into background images and put them into spans/divs etc.

Some resources...
- Firefox (with the developer toolbar extension) and Opera both allow you to disable all CSS styles completely (IE does not let you completely disable stylesheets).
- There are lots of useful accessability extensions and plugins for Firefox that aid the developer building accessable sites -- check out the Firefox website for a very big list of them.

Some observations...
- Think about the copy you use on your site. You may be able to reword more complex (in terms of the word length and it's aural complexity) sentences and make them more understandable when read aloud by a screen reader (and it's a good thing - simplifying content, that is).
- Develop your solution in Firefox and look into some of the extensions (on the Firefox site). Start with the skeleton site and flick off CSS every now and again to see how it's looking.

And good luck on this worthwhile practice.
Jeff
 
One thing... Flash MX and later can be made to be compliant with screen readers. So it really doesn't have to be avoided at all costs. :)

Wow JT that almost looked like you knew what you were doing!
 
There's a Firefox extension called "Fangs" that will display your pages in the form that a screen reader reads them (this differs slightly from a plain lynx rendering, as a screen reader will insert extra bits to describe the content - e.g. "Table with one column and four rows" before reading the content of the table.

There's another extension called "Foxy Voice" (great name!). It reads out the content of web pages (I think you need to be running Win 2K or XP though).

Put the two together and you have a free ersatz screen reader!

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd
 
A subject near and dear to my heart..It is a course I teach...One of the places you can check (assuming you are in the US) is which are the standards for the federal govt. web sites. Each state probably has its own site listing its standards.

Screenreaders: you can download trial copies of them. Jaws is the biggie from and you used to be able to just reboot after 40 minutes and continue using it. IBM also has a screenreader out. Cast eReader is probably the least expensive.

Alternative Web Browsing:
Free site checker (one of many):
Also be careful of your colors so you don't alienate those with color blindness. Steer clear of the Christmas greens and reds. Check your site for color blindness access: or
Other resesources:


That should get you started! Good luck...

(Chris: none of the screen readers I have used or seen demonstrated reads a table structure as you state. The readers used to read tables vertically but now read them horizontally and have gotten much better at reading their contents. This is a reason why we use the <th> tags and other specialized table tags. Can you tell me what screen reader reads tables the way you describe as I would like to check that one out. Thanks!)



**Quiquid latine dictum sit altum viditur.**
 
Thanks, Chris. Nope. The screen readers I have used don't tell you the table layout at all. They just read the contents.

This is another reason why it is important to put : "Please contact Mary Jones, <a href="mailto:mary jones@aol.com ">mary jones@aol.com </a>" for example. Some screen readers will read it as : "Please contact Mary Jones, mailto mjones at aol.com". If you only have the name as the mailto link, that's what it will read: mailto Mary Jones.

The screen readers will read different things in slightly diferent voice tones.

I have been working with accessibility since it became state law here in 2000. Yes, you can design a nice site and make it accessibile. My site has javascript menus on it. Yes, it also has a link on every page to a plain vanilla text menu page. users must be able to get around your site if they have javascripts turned off.

And we thought we had problems because of the different browsers, different resolutions, and the user's ability to change the font size???





**Quiquid latine dictum sit altum viditur.**
 
I would be very happy to do that, Clive. Is there a length limit or other issues I should be aware of when I create the FAQ?

**Quiquid latine dictum sit altum viditur.**
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top