This is the P2PU Archive. If you want the current site, go to www.p2pu.org!

Alt Text & Universal Design

My recent threads

You haven't posted any discussions yet.

Discussion of Week 4: Basic Web Accessibility

Lucica Ibanescu's picture
Lucica Ibanescu
Fri, 2011-02-18 21:31

First of all I would like to make some observations regarding the text we had to read this week.

1. on Guideline B page there is a mistake related to the display:none property used to hide labels. Screen readers do NOT read information hidden with display:none (google also does not read it). So possible solutions are: visibility:hidden, negative indenting: text-indent:-5000px or absolute positioning outside the screen: postion:absolute;top:-5000px;left:-5000px .

Also on the same page there is a text saying: "In situations where a single label must identify multiple form elements, use the title attribute to identify the elements. An example of using title on text fields is shown below, but this attribute can also be applied to radio buttons and check boxes if necessary." The example shows a title in a table cell which is wrong (do not use tables for layout) - the accepted solution today is using fieldset and legend for this purpose.

2. tables are a much complicated subject when it comes to building complex ones - a good resource for those who will have to implement them in the future (good luck to you) is here: http://jimthatcher.com/webcourse9.htm

3. PDF accessibility: I recommend this video to everybody having 1 free hour: http://www.youtube.com/watch?v=26NlBmq0riE

4. regarding the accessibility of the e-books there is a standard that I have not seen in the text - DAISY - and Microsoft Office (newer versions) and Open Office (I hope I'm not wrong with this one, I am not 100% sure) support it and can save books in this standard.

Now, regarding what you said in Week 4 document: "Use headings to identify important areas of the page (navigation, search, main content, etc.)" I wanna say that I do use headings (hidden with CSS) for navigation, search and other useful areas but my main problem is that usually I use H3 for that and it does not respect the natural flow of the headings (H2 child for H1, h3 for h2 and so on). Let me give you an example: I was building this site http://dan-tamas.me/ and I used [h3 class="wai"]Main navigation [/h3] to help people identify that area and eventually skip to it in case they need it.

If you check it with an automated accessibility checker you will see an error stating that the heading order is not correct. I have H3 ([h3 class="wai"]Main navigation[/h3]) and then I continue with H1, h2 and so on in the content. So my question is: what is the best approach in this case? Anyone has a better idea?

Marsha Vomastic's picture
Marsha Vomastic
Sat, 2011-02-19 02:46

Wow! You have really provided a lot of information. Thanks much! I will look at it more this weekend.

Marsha Vomastic's picture
Marsha Vomastic
Mon, 2011-02-21 21:40

Lush,
I don't think you can use H3 to always mean navigation. If you look at the web page in outline view, you can see that is not semantically correct. See http://semanticweb.org/wiki/Main_Page.
HTML 5 has the solution: the nav tag! http://www.w3schools.com/html5/tag_nav.asp Now we just have to wait for the browsers to start supporting HTML5. :) Do/Will the screen readers support HTML 5 do you think?

Lucica Ibanescu's picture
Lucica Ibanescu
Tue, 2011-02-22 19:36

The new nav tag is not read by the screen readers and probably won't be read until 2014 - in the example I gave I used all the new HTML5 elements but they are not accessible on their own right now. I know that coders use headings for the main landmarks and I wanna know what is the best approach in this case - what do you think Bryan?

Bryan Gould's picture
Bryan Gould
Wed, 2011-02-23 21:36

For navigation, we recommend using ARIA. I've pasted several links and general info below. Please note that using ARIA does not negate the need to use headers properly.

overview (very useful): http://www.w3.org/WAI/intro/aria.php

full draft spec: http://www.w3.org/TR/wai-aria/

What is WAI-ARIA:
WAI-ARIA is a technical specification that provides a framework to improve the accessibility and interoperability of web content and applications. It describes how to add semantics and other metadata to HTML content in order to make user interface controls and dynamic content more accessible.

What are landmark roles?
ARIA landmark roles can be used to programmatically identify specific sections or areas of a Web page. Such areas include, but are not limited to, navigation, search, main content, sidebar content, banners and forms. Adding landmarks to a Web page is very simple. Landmarks can be used now as a way to, for example, skip groups of repetitive navigational links or to provide an easy way for screen-reader users to jump from one area of a page to the next.

information about landmark roles (as defined in the spec): http://www.w3.org/TR/wai-aria/roles#landmark_roles

tutorial of how to use landmark roles: http://www.paciellogroup.com/blog/2010/10/using-wai-aria-landmark-roles/

ARIA Authoring Practices: http://www.w3.org/WAI/PF/aria-practices/

Marsha Vomastic's picture
Marsha Vomastic
Mon, 2011-02-21 16:33

The State of Wisconsin kindly provided me with a furlough day so I can get caught up on this.
I am part way through but it brought to mind a comment at our first Universal Design committee meeting. A person said she is just becoming aware of accessibility requirements (and now the has changed to UD) and that is overwhelming! It really is. Unless it is your area of expertise, the UD requirements, on top of other standards and technology you have to know as a web developer, are staggering. We really need ways to help the typical web publisher to implement at least the basics.

Lucica Ibanescu's picture
Lucica Ibanescu
Tue, 2011-02-22 19:37

What is UD?

Marsha Vomastic's picture
Marsha Vomastic
Tue, 2011-02-22 19:55

Sorry. Universal Design.

Marsha Vomastic's picture
Marsha Vomastic
Mon, 2011-02-21 16:36

By the way, our low-vision person said she likes to hear alt text for logos and wants to know what they look like. Apparently, there are no absolutes with the guidelines.

Bryan Gould's picture
Bryan Gould
Wed, 2011-02-23 20:41

Marsha,
Correct - there are no absolutes. Sometimes, it's possible to describe a logo on a home page and then not include description if it pops up other places. Almost always, description of a logo should be very brief ..unless of course, the details are important to the content. And thus, no absolutes.

bg