无障碍网页开发:规范和技术手册

[入库:2005年8月18日] [更新:2007年3月25日]

本文简介:选择自 hanic 的 blog

无障碍网页开发:规范和技术手册

看到这篇规范收获很多:其中关于radio button的可用性是这样描述的:


不好的设计:
男性女性 <<-- 点击“女性”左边的radio才能做选项切换

vs


好的设计:
<<-- 点击“女性”这个文本就能够做选项切换

第一个表单必须点击radio本身才能做选项切换,第2个表单只需要点击文字部分就能做相应的选项切换。虽然只是一点点改进,但是让用户鼠标可以比较容易的进行模糊的操作。

源代码如下:主要是通过label和相应的id做了关联
<form>
<fieldset>
  <legend>不好的设计:</legend>
    <input name="sex" type="radio"
checked>男性<input type="radio" name="sex">女性 <<--
点击“女性”左边的radio才能做选项切换</fieldset>
</form>和<form>
<fieldset>
  <legend>好的设计:</legend>
    <input name="sex" type="radio" id="male"
checked><label for="male">男性</label><input
type="radio" name="sex" id="female"><label for="female">女性</label>
<<-- 点击“女性”这个文本就能够做选项切换</fieldset>
</form>

本文关键:无障碍网页开发:规范和技术手册
 

本站最佳浏览方式为 分辨率 1024x768 IE 6.0(或更高版本的 IE浏览器)

go top