Discuz!官方免费开源建站系统

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索

资讯评论表单中的不规范HTML代码

[复制链接]
杨永全 发表于 2008-12-3 12:20:42 | 显示全部楼层 |阅读模式
如下链接琐事:李明顺:解读社区营销现状及未来展望  
评论部分代码如下:
  1. <div id="sign_msg">
  2. <form  action="http://x.discuz.net/index.php?action-viewcomment-itemid-130094-php-1" method="post">
  3. <textarea id="message" name="message" onfocus="showcode()" onkeydown="ctlent(event,'postcomm');"></textarea><br />
  4. <div class="security_code">
  5. 验证码:<input type="text" id="seccode" name="seccode" value="" size="20" /> <img id="xspace-imgseccode" src="http://x.discuz.net/do.php?action=seccode" onclick="javascript:newseccode(this);" alt="seccode" title="看不清?点击换一个" />
  6. </div>
  7. <input type="submit" value="" id="submit" class="input_submit"/>
  8. <input type="hidden" value="submit" name="submitcomm" />
  9. <input type="hidden" id="itemid" name="itemid" value="130094" />
  10. </form>
  11. </div>
复制代码
第一,评论内容输入框代码中的问题,代码如下:
  1. <textarea id="message" name="message" onfocus="showcode()" onkeydown="ctlent(event,'postcomm');"></textarea><br />
复制代码
可以看出,整个代码中没有任何说明性文字指出这是填写评论信息的编辑框。这一点对于盲人等使用屏幕辅助设备的朋友来说是最大的问题。当然我不知道明眼人用眼睛是否能看出这里是填写评论的位置。
建议在前面增加LABEL标签,用以提示这里是评论内容输入区域。
第二,关于验证码部分,代码如下:
  1. <div class="security_code">
  2. 验证码:<input type="text" id="seccode" name="seccode" value="" size="20" /> <img id="xspace-imgseccode" src="http://x.discuz.net/do.php?action=seccode" onclick="javascript:newseccode(this);" alt="seccode" title="看不清?点击换一个" />
  3. </div>
复制代码
这里有两个问题:
  1  验证码输入框前面的“验证码:”三个字,没有与下面的验证码输入框相关联,就是说鼠标点击这三个字不会把输入焦点定位到输入验证码的编辑框。
建议加上LABEL标签,并用for属性关联下面验证码输入框的ID。
  2  后面的看不清换一张图片,采用了图片中加onclick事件的方式,并且值得肯定的是在 IMG标签中使用了title 属性,可是尽管如此,问题还是有一个,键盘就无法操作他了,因为没有了焦点。这对于使用键盘的朋友来说,就无法点击更换图片了。
建议可以做成链接形式,或者在IMG标签中加上tabindex属性,并将其值设置为0,这样既增加了键盘焦点,又不影响他的TAB顺序。
第三,评论提交按钮,代码如下:
  1. <input type="submit" value="" id="submit" class="input_submit"/>
复制代码
可以看出,VALUE的值为空,我想大概是已经用CSS渲染了这个按钮,明眼人看上去就知道这是提交的按钮了,可是对于盲人等使用屏幕辅助设备的朋友来说,这就不是有好的设计了。或许这只是程序员书写代码中的一个疏漏吧,因为在用户登录表单中的登陆按钮就是非常标准的写法。

总之,评论表单中的代码是有很多不符合HTML代码书写规范的,二者带来的最大问题就是影响了盲人以及所有使用屏幕辅助设备访问用户的体验,当然也是不符合网页内容无障碍规范的。
秋之子 发表于 2008-12-3 12:54:30 | 显示全部楼层
很专业的问题
回复

使用道具 举报

 楼主| 杨永全 发表于 2008-12-5 19:06:13 | 显示全部楼层
希望官方可以考虑下代码的规范化。
回复

使用道具 举报

紫琼 发表于 2008-12-8 10:40:46 | 显示全部楼层
谢谢楼主提出的仔细的建议,我这就反馈一下~
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|Discuz! 官方站 ( 皖ICP备16010102号 )star

GMT+8, 2024-11-16 10:16 , Processed in 0.031592 second(s), 4 queries , Gzip On, Redis On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

快速回复 返回顶部 返回列表