Web标准建构的站点一览表

所属分类: 网页制作 / CSS 阅读数: 1300
收藏 0 赞 0 分享

Web标准不仅仅是不用表格的站点. Web 标准,不仅仅是“不用表格的站点”
“Web 标准”这个词在不同人眼里可能有不同的含义。有人会觉得那是“不用表格的站点”,也有人会觉得那是“使用通过验证的代码”。实际上,Web 标准涵盖的比这宽泛得多,用 Web 标准建构的站点必须坚持标准 (HTML, XHTML, XML, CSS, XSLT, DOM, MathML, SVG 等等) 并执著于实践 (通过验证的代码,有亲和力的代码,语义正确的代码,对用户友好的 URL 等等)。
换句话说,用 Web 标准建构的站点,如果理想地看,必须简洁,干净,基于 CSS,有亲和力,有可用性,以及对搜索引擎友好。 有关这张一览表
这显然还不是一张完整的表格,很可能要加上很多东西。然而更重要的是,并非其中每样东西都必须在你的站点中找到,这只是一个向导,用来: 展示 Web 标准领域的跨度 作为开发者手边的便捷的查询工具 帮助正在慢慢转向 Web 标准的开发者们适应 一览表 代码质量
    使用了正确的 DOCTYPE 吗?
    http://www.w3.org/QA/2002/04/valid-dtd-list.html 使用了正确的字符集吗?
    http://www.w3.org/International/O-charset.html 使用了合法的 (X)HTML 吗?
    http://validator.w3.org/ 使用了合法的 CSS 吗?
    http://jigsaw.w3.org/css-validator/ 用到了哪些 CSS Hack?
    http://css-discuss.incutio.com/?page=CssHack 使用了多余的 class 或者 id 吗? 代码的语义结构是否正确?1
    http://www.w3.org/2003/12/semantic-extractor.html 是否有坏掉的链接?
    http://validator.w3.org/checklink 在页面和脚本大小的影响下,站点的速度如何?
    http://www.websiteoptimization.com/services/analyze/ 有没有什么 JavaScript 错误?
内容与表现的区分度
    是否所有的表现类信息都用 CSS 来处理了?(字体、颜色、补白、边框等等) 是否所有的装饰性图片都用 CSS 来处理而不是直接写在 (X)HTML 中了?
对用户的亲和力
    所有的描述性图片都用了 alt 属性来提供文字信息吗? 字体使用了相对单位而不是绝对单位吗? 如果字体增大,会不会有些排版方面的错误出现? 是否使用了弹出式菜单? 表单 (form) 是否具有亲和力? 表格是否具有亲和力? 配色的亮度和对比度足够吗? 是否只用颜色来区分重要的信息? 弹出式菜单是否有一个延迟的响应?(为一些反映不那么敏捷的人士考虑) 是否所有的链接都具有描述性?3 (为盲人考虑)
对设备的亲和力
    新旧浏览器都至少能接受这个站点吗? 如果完全清除 CSS 的话,站点还具有亲和力吗? 如果所有图像都关闭的话,站点还具有亲和力吗? 在 Lynx 等文本的浏览器下是否可读? 打印出来是否可读? 掌上设备中是否可读? 站点是否包含了详细的元数据 (metadata)? 在不同的浏览器窗口大小下站点是否正常?
基本的可用性
    从视觉上说,是否有一个清晰的层次结构? 不同等级的标题是否容易区分? 站点的导航栏是否容易辨认? 导航栏是否一致? 是否使用了一致并且合适的语言? 是否有站点地图页面和联系信息页面?它们找起来容易吗? 庞大的站点是否有搜索工具? 每页都有到首页链接吗? 链接都有下划线吗? 已经访问过的连接是否用独特的颜色来区分了?
站点管理
    站点是否有一个有意义并且有帮助 404 出错页面,这个页面是否对所有的目录深度都有效? 站点的 URL 是否友好? 如果去掉“www”,链接都还正常吗? 站点是否有个图标?
更多精彩内容其他人还在看

Opera中国的WEB标准课程

网页制作Webjx文章简介:在这篇文章里,我要向大家介绍我和其他很多人花费数月时间开发的一个课程——Web标准课程,该课程旨在向大家提供Web设计和开发的坚实基础,无论读者是谁,此教程完全免费、可访问,并且不需要预备知识。当然,我主要还
收藏 0 赞 0 分享

CSS样式表渐进增强的基本概念

网页制作Webjx文章简介:如果你挠着头想弄清楚优雅降级和渐进增强的区别,我告诉你,这是视角问题。优雅降级和渐进增强都考虑网站在各种设备的各种浏览器上如何良好运转。两者区别的关键在于它们各自关注的焦点,以及这种关注对工作流程的影响
收藏 0 赞 0 分享

简单介绍Web Developer插件制作网页

网页制作Webjx文章简介:Firefox浏览器是一个良好支持W3C标准的开放源代码的浏览器,拥有Linux/Windows/Mac版本。因为Firefox浏览器良好支持W3C标准,所以使用Firefox来调试网页是非常好的。 Firefox浏览器是
收藏 0 赞 0 分享

CSS布局带来的巨大影响:CSS display属性值

网页制作Webjx文章简介:网页元素应用上那些与表格相关的display属性值后,能够模仿出与表格相同的特性。我将会在该文中给大家演示这种方法给CSS布局带来的巨大影响。 应原书编辑要求,先在文章顶部给出链接:《Everything You
收藏 0 赞 0 分享

用div css模拟表格对角线

这只是探讨一种CSS模拟表格对角线的用法,实际在工作中可能觉得这样做有点小题大作,这不是本主题讨论的重点。如果对此深以为然的朋友,请一笑过之 首先声明: 这只是探讨一种CSS模拟表格对角线的
收藏 0 赞 0 分享

IE Firefox在css中的差别 (部分)

1、单位问题 问题:任何距离的数值ie可以不加单位,ff必须要求写单位(0除外) 解决:写全单位如padding:0px; 2、水平居中 问题:div里的内容,ie默认为center,而ff默认left 解决:mairgin:0px auto; 3、高度问题
收藏 0 赞 0 分享

不用js可以实现信息提示效果

[code] <style> body { font:verdena; font-size:14px; color:#000 } h1{ font:verdena; font-size:22px; color:#000 } h2{ font:verdena;
收藏 0 赞 0 分享

CSS解决未知高度的垂直水平居中自适应问题

今天有人问起,晚上试着写出来,供参考; 以下代码兼容主流浏览器IE6、IE7、Firefox、Opera。 从最简单的开始………… 一、如何让一个DIV水平居中? 这个简单不作过多说明! [code] <st
收藏 0 赞 0 分享

CSS cursor 属性 -- 鼠标指针样式效果

取值: [ [<uri> ,]* [ auto | crosshair | default | pointer | move | e-resize | ne-resize | nw-resize | n-resize | se-resize | sw-resize |
收藏 0 赞 0 分享

css 简单区别ie6,ie7,firefox的写法

同一样式里可以这样 [code] margin:17px; FF +margin:17px; IE6 IE7 _margin:17px; IE6 [/code] 按这个顺序,刚好区分开三个浏览器
收藏 0 赞 0 分享
查看更多