开发者

Jtemplate Accessibility question

Hi all the Accessibility experts,

I use jtemplate in my website and have issue to pass w3c Web Accessibility. The issue is that jtemplate (well, not only jtemplate but most of other client template) uses hidden <textarea> as the template holder. And according to W3c Accessibility standard, every textbox/textarea required an associated label.

Since these textarea templates are NOT visible, it is pointless to have a hidden label to associate with it. Can you suggest a better 开发者_JS百科way to go about it?

Kind regards, BC


I would just ignore that validation issue. Even with this error your code is still valid.


I'm a screen reader user and put together the following example in IE with jaws for windows on how labels and text areas are read. The short summary is by adding a label to a hidden text field you will do more harm then good to a screen reader user since the label will be spoken with out the associated text field.

<html>
<head><title>testing</title></head>
<body>
<form>
<label>This is a useless label since the screen reader won't read the text box</label>
<textarea  rows="10" cols="30" style="display:none">
This will not be read by a screen reader
</textarea>
<label>This is a useful label since the screen reader will read it along with the text box</label>
<textarea  rows="10" cols="30" >
This will be read by a screen reader
</textarea>
</form>
</body>
</html>

For a discussion of hiding text from screen reader users or making available to screen reader users while hiding it from everyone else see http://webaim.org/techniques/css/invisiblecontent/#intro This is an example of how you can still technically meet a standard but create sites with accessibility problems. While using standards helps with accessibility it does not garantee it. I would suggest that you document this as a necessary deviation from the standard. Your other choices are to add labels which will harm screen reader users but technically make the site meet the standard, or rewrite your site to use a different library.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜