网站建设中表单技巧
日期:2011年06月10日一般来说,形式是相当无法为残疾用户。 使用下面的提示,以提高你的形式获取。
标签
提高形式使用<label>元素来指定的形式为每个字段标签辅助功能。
在第一个例子,前<label>标签用于每个字段,并引用字段的名称:
<FORM action="script-reference here" method="post">
<LABEL for="name">Name:</LABEL>
<INPUT type="text" name="name">
<LABEL for="address">Address:</LABEL>
<INPUT type="text" name="address">
<LABEL for="message">Message:</LABEL>
<TEXTAREA name="message" cols="40" rows="5"></TEXTAREA>
<INPUT type="submit" value="Submit Form">
<INPUT type="reset" value="Clear Form">
</FORM>
在第二个例子,<label>标记环绕每个字段的形式:
<FORM action="script-reference here" method="post">
<LABEL>Name:<INPUT type="text" name="name"></LABEL>
<LABEL>Address:<INPUT type="text" name="address"></LABEL>
<LABEL>Message: <TEXTAREA name="message" cols="40" rows="5"></TEXTAREA></LABEL><br>
<INPUT type="submit" value="Submit Form">
<INPUT type="reset" value="Clear form">
</FORM>
Tab键顺序
提高形式的表单字段中使用tabindex属性访问。 这将控制字段的顺序,一个用户使用,因为他们通过表单通过按TAB键提交。
表头技巧
人们使用屏幕阅读器可以找到它很难理解在一个表中的资料。
关于如何标注表格的标题提示,以帮助视障用户。
细胞标题
使用钍元素标签表标题行或列单元格。 每个细胞钍元素也应该有一个独特的“标识”属性。 标题细胞成为细胞的参考点的数据。
例如:
...
<TR>
<TH ID="c1">Name</TH>
<TH ID="c2">Month</TH>
<TH ID="c3">Day</TH>
<TH ID="c4">Year</TH>
</TR>
...
数据单元格标签
如果一个表有两个或更多的行或列标题,或标题跨越多列,它需要额外的标签相关联的数据项。
表中的数据单元格,标题属性是用在TD元素来指定标题细胞与细胞相关的特定数据。
请注意,数据单元格包含数字的属性,包括02头=的“C2”,内容涉及与ID =的“C2”的标题细胞标记月。因此,对“02”的标题是月。
例如:
...
<TR>
<TD HEADERS="c1">Valentines</TD>
<TD HEADERS="c2">02</TD>
<TD HEADERS="c3">14</TD>
<TD HEADERS="c4">1500</TD>
</TR>
...