Group items tagged

Well, it turns out you can do that. From The LABEL element in the HTML 4.01 specification: The LABEL element may be used to attach information to controls. Each LABEL element is associated with exactly one form control. The for attribute associates a label with another control explicitly: the value of the for attribute must be the same as the value of the id attribute of the associated control element. More than one LABEL may be associated with the same control by creating multiple references via the for attribute. Sounds great, doesn’t it? A quick check in graphical web browsers shows that they associate multiple labels with the input field (as evidenced by the input field gaining focus when either label is clicked). But what about screen readers? It would be so useful if this would work… Unfortunately, and perhaps unsurprisingly, it looks like it doesn’t quite work as well as you’d hope. I mentioned this briefly in Use the label element to make your HTML forms accessible, but I think it’s worth bringing up again since full support for multiple labels would help us make forms more accessible to screen reader users while keeping visual designers happy. I am far from an expert user when it comes to screen readers, but I’ve done some limited testing with mostly disappointing results. Apple VoiceOver does not recognise more than one label element associated with a form control and reads only the label that comes first in the document’s source order. JAWS and Window-Eyes both do the opposite and read only the last label when an input field gains focus. The only screen reader of those that I tested that does handle multiple labels is Fire Vox. The exact results may obviously depend on user configuration and reading modes, and there may be other screen readers that get it right, but these results indicate that screen reader behaviour is too inconsistent for multiple labels to be a reliable technique.

A screen reader simply enables a blind person to use the applications and operating system on a computer without sight by converting on-screen text into a Braille or spoken format. Intelligent screen readers like Window-Eyes deliver information in a linear format, interpret the active window, read complex web pages and perform many other advanced functions.

Although scripting is, by far, the number one enhancement found in this latest Window-Eyes release, other new features are noteworthy in their own right. Geoffray tells us that Window-Eyes is now 100 percent Unicode compliant. This enables access to foreign language text, certain PDF documents not previously readable, Microsoft Word’s smart quoting feature and any other situation where use of special symbols is required. Intelligent place markers may now be defined on dynamic web pages delivering quick access to a specific area of the page based not only on its virtual line number, but also on the text at the cursor. A new Eloquence speech synthesizer, access to the Firefox 3.0 web browser, support for the public beta version of Internet Explorer 8.0

Any web developer who has created a reasonably complex form is probably aware of the concept of multiple select elements that are connected – choosing something from one select box either makes a new select box appear or changes the options of one that is already visible. There are usually two problems with this approach. One is that most implementations are completely dependent on JavaScript being available. Often there either is no submit button at all, or there is a submit button but without JavaScript there is no way to access the options that appear only as a result of changing the first select box. The other problem is that in some browsers, using the cursor keys to change the selected option triggers the onchange event immediately, so you can never get past the first option unless you know how to use your keyboard to display all options. I normally work around these problems by requiring users to submit the form to get the next set of options from the server. Obviously that isn’t an ideal solution either. So what other options do we have? One option that looks promising is described by Christian Heilmann in Unobtrusive connected select boxes - yet another solution approach. It involves using optgroup elements to create a two-level select box, which is then split into two separate select boxes if JavaScript is available. Neat. The solution Chris describes solves (or at least mitigates) the keyboard access problem since it doesn’t reload the page when the onchange event is triggered. And if JavaScript is unavailable, there is a single select box with option groups. The catch is that nested optgroup elements are not allowed in current versions of HTML, so this will not work when more than two connected select boxes are needed. Nested optgroup elements are allowed in the current Web Forms 2.0 Working Draft, so I guess there is a reasonable chance of that change making it into HTML 5.

And that leads me to three great videos posted on the Yahoo! User Interface Blog: In Introduction to Screen Readers, Yahoo! engineer Victor Tsaran talks about who will be likely to use a screen reader, how screen readers work, and how they can be used to interact with the computer desktop and to browse web sites. In Introduction to Screen Magnifiers, Karo Caran shows how the screen magnifier ZoomText is used to make the computer desktop and web sites readable to people with reduced vision. And finally, in From the Mouth of a Screenreader, Doug Geoffray from GW Micro (Window-Eyes vendor) talks about the history of screen reading software and how they analyse what is displayed on the screen in order to speak it to the user.

With the goal of better understanding how people interact with the Web via various types of Assistive Technology (AT) — and what that might mean for developers and designers — Karo Caran takes us on a 16 minute overview of screen magnification software (in this case ZoomText) and how it is used by partially-sighted users to interact with the Web. Karo shows you the basic toolkit and then applies those tools to some typical web sites to give you some perspective on how she uses magnification software while she browses the web.

he context is important for us on the frontend as we begin to confront the same challenges that desktop software developers have been addressing for many years.

Doug been a touchstone for us at YUI in the research and development of our Menu Control, a project that is helping us to lay a foundation for what is possible in terms of DHTML accessibility as YUI evolves.

I’ve been using this for years and can’t understand why it isn’t available in Mail’s GUI. Here’s what to do: Quit Mail.app Open Terminal.app Enter defaults write com.apple.mail PreferPlainText -bool TRUE and press enter (toggle it back by changing TRUE to FALSE) Open Mail.app View an HTML message and marvel at the readable plain text The catch is that this only works for messages that actually contain a plain text alternative, which far from all HTML email does.

Specify the minimum font size Apple Mail uses for HTML messages As a fallback for the messages that do not contain a plain text alternative it is useful to make sure that the text at least has a readable size: Quit Mail.app Open Terminal.app Enter defaults write com.apple.mail MinimumHTMLFontSize 13 in the Terminal window and press enter Open Mail.app View an HTML message and marvel at the readable font size You can change the font size to whatever suits your eyes. Apply both of these and you should be able to read most of the HTML email that you receive.

Liquid layouts get rid of the dreaded horizontal scrollbar

Liquid layouts allow you to make full use of the area available in the viewport, showing more or less content, depending on what will fit at any given moment.

Liquid layouts essentially allow users to choose the line length, or number of text characters per line of text, that is most comfortable for them to read.