W3C Xhtml 验证问题经验分享
时间:2014-11-29 21:49 来源: 我爱IT技术网 作者:山风
近日将公司执行的一个项目网页送W3C的Xhtml检测工具做验证, 并将显示的错误一一修正, 直到全部通过检测为止. 修改的错误包括:
1. <form>标签应该有action值, 例如: <form action=”searchresult.htm”>.
2. 如果在表单使用<legend>, 外围就应该有相对应的<fieldset>包覆.
3. <option selected>下拉选项</option>应该改成<option selected=”selected”>下拉选项</option>
4. <form>要在<table>外面, 不能包在<table>里面.
5. <span> 里面不应该包覆<div>, <span>通常只用来改变字型/颜色/大小/靠左靠右等细微外观, 不能像<div>一样当成区块使用.
6. 多媒体文件(如swf, mov, wmv) 的code无法通过验证.
1~4 修改的多半是tag标签顺序以及一定要有属性值设置的细节问题, 在Dreamweaver 8版本按照次序由程序自动产生的文件多半是正确的, 只要注意顺序即可, 但如果像我ㄧ样习惯手动加tag就容易产生这类的错误.
5 的错误一开始误认为是不应该用<div>包覆链结文字, 应该加上如<p>或<li>等tag, 后来发现只要将<div>拉出<span>外面就可以了. 用<div>包覆文字虽然无法辨识语义(不知道这段文字属于标题<h>, 段落<p>, 还是<li>条列项目), 却是Xhtml验证工具允许的.
至于6 的错误就很麻烦了, Dreamweaver产生的多媒体对象(如swf, mov, wmv) 的code通通无法通过验证. 在W3C的标准定义中, 影音档或Flash档等对象应该都用<object>这个tag, 但是Dreamweaver用的却是不在标准中的<embed>; 而Flash的swf档虽然是<object>, 但是里面的classid值和<embed>仍然无法通过验证, 于是在Google找寻解答.
A List Apart有ㄧ篇 Bye Bye Embed 介绍如何通过W3C验证的解法, 分别详列如下: (原文是用绝对路径写, 这里改用相对路径, <p>的说明文字则是政府无障碍网页规范的要求 )
MediaPlayer的wmv档
<!-- 请输入 width 和 height 值 否则 Firefox 无法显示 --><object type="video/x-ms-wmv" data="images/test.wmv" width="172" height="160"><param name="src" value="images/test.wmv" /><param name="autostart" value="false" /><param name="controller" value="true" /><param name="qtsrcdontusebrowser" value="true" /><param name="enablejavascript" value="true" /><p>请输入多媒体内容说明文字, 以符合无障碍第一优先等级规范</p></object>
FlashPlayer的swf档
<!-- 请输入 width 和 height 值 否则 Firefox 无法显示 --><object type="application/x-shockwave-flash" data="images/title.swf" width="172" height="160" id="VideoPlayback"><param name="movie" value="images/title.swf? docId=8755581808731033658" /><param name="allowScriptAcess" value="sameDomain" /><param name="quality" value="best" /><param name="bgcolor" value="#FFFFFF" /><param name="scale" value="noScale" /><param name="salign" value="TL" /><param name="FlashVars" value="playerMode=embedded" /><p>请输入多媒体内容说明文字, 以符合无障碍第一优先等级规范</p></object>
QuickTime的mov档
<!-- 请输入 width 和 height 值 否则 IE, Firefox 无法显示 -->
<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" width="172" height="160"><param name="src" value="images/sample.mov" /><param name="controller" value="true" /><param name="autoplay" value="true" /><!--[if !IE]>--><object type="video/quicktime" data="images/sample.mov" width="172" height="160"><param name="autoplay" value="true" /><param name="controller" value="true" /></object><!--<![endif]--><p>请输入多媒体内容说明文字, 以符合无障碍第一优先等级规范</p></object>
QuickTime的mov档写法比较特殊, 上方有classid的写法IE不支援, 所以下方用IE特有的”条件式注解( [if !IE] )” 再写ㄧ组给IE浏览器专用.
* 以上的宽度高度最好以原尺寸显示, 否则在Firefox会有无法显示或者裁切的情况发生.
原以为仰赖Dreamweaver通过W3C验证不会太难, 但还是有死角存在, 这过错不全是Deamweaver, 有很大原因是IE或其他浏览器的支援程度仍然不足的关系.
在The Web Standards Project 看过一篇 Dreamweaver Task Force 文章, 在2001年 Web Standards Project这组织就成立" The WaSP Dreamweaver Task Force"小组, 任务是协助Dreamweaver朝Web Standard目标改善他们的应用软件, 让程序产生的文件符合标准需求, 也让大部分的默认项目改用符合标准和使用性 (Accessibility) 的选项. 可以感觉出MX版本开始朝这个方向走, 但还不够完整; Dreamweaver 8的版本看起来除了影音档, 都支援了; 不知道最近刚出来的CS3版是否解决这个问题. (ps. 来自Amos测试结果是CS3版和8的版本相同, 并未解决这个验证问题 )
除了Adobe, 这个组织也有ㄧ个Microsoft Task Force小组在Micorsoft要完成相同的任务, 所以The Web Standards Project是很积极在顶动Web标准, 不是嘴上说说而已. 这组织最近还很无情的批评Adobe’s Spry Framework for AJAX (还在Beta版阶段, 这里曾经介绍过 Adobe Max 2006 课程范例 -- 如何以Spry与Dreamweaver开发AJAX )是违反Web标准的应用程序, 呼吁大家要勇于指正Adobe的错误.
Adobe和Microsoft这两家公司会这样”备受重视”大概是怕他们有可能成为制造网页”乱象”的根源, 必须尽早介入导正才行!
- 评论列表（网友评论仅供网友表达个人看法，并不表明本站同意其观点或证实其描述）
-