我的一些关于web标准的思考笔记(一)

我是从去年初开始学习web标准的,两年下来也有些心得。最近跳槽了正好闲在家里,写一些出来和大家交流一下。

1 对于web标准和W3C XHTML规范的理解

按照习惯的理解,这两个概念似乎都是指的一个东西(就是咱们在这个版里讨论的这些个"高深理论“^_^)。但我认为,事实上从技术的角度上讲,这两个事物几乎没有任何相关性。web标准简而言之就是将页面的结构、表现和行为各自独立实现,更通俗的讲就是如今招聘时流行的语言”div+css"。但W3C XHTML的任何一个版本都没有对web标准理念作限制。很显然的,我们可以用xhtml 1.1写出一个table定位的网页。说到这里,或许会认为我讲了一堆废话。但任何一项技术,只有当你对基础概念有足够清晰的认识的时候,你才会正确的使用它。我从下面两个方面,来谈谈如今Web标准应用走向的两个歧途:

第一种情况很简单。自以为只要使用了XHTML+CSS就是Web标准了。页面里面遍地是class和id。肆意的为每个细节都单独定义class。这样的页面和传统的html的区别就是img标签里多了个"/"。事实上这样子还不如回到传统的html,至少我可以轻松的使用font,而不用总是跟查字典一样去查样式表。另一种更隐蔽的随意使用CSS的我在以后讲。

第二种情况我觉得比较难理解一些,即试图用各种纷繁复杂的div嵌套和css语句来实现你所想要的表现。很简单的一个例子就在我刚看到的一个帖子"不用切图的页面圆角"。首先我想肯定的是这个创意确实很不错,使用CSS功能将圆角“画”出来。为此,设计者必须在相应的位置加上一大段如下的代码:

<b class="b1"></b><b class="b2"></b><b class="b3"></b><b class="b4"></b>
<b class="b4"></b><b class="b3"></b><b class="b2"></b><b class="b1"></b>

但是,这里严重违反了Web标准的基本概念——结构与表现要分离。因为它将用于控制网页表现的代码放在结构文档中了。或许你会说它事实上还是将真正的表现代码放在CSS里的。但我认为这是一个偷换概念。因为以上这些b标签跟网页结构无关,它们都是一些空标签。也就是说,它的存在并不是为了将某些内容放在文档结构需要的位置。因此它们对于文档结构来说只是一些废代码。

另外一个例子可能更加隐蔽。之前我有在alistapart.com上看到过如何实现网页三通栏的文章,其原理大概就是使用三四个div相互嵌套。我认为这也是一个违反Web标准思想的做法。因为这些div标签在代码中摆放的次序已经不单纯是为了结构的需要,而是用于网页的表现。

当然,我承认,以上的观点在一定程度是钻牛角尖(但反过来说,非要实现非图片圆角不也是在钻牛角尖么,呵呵)。有些时候结构和表现并不是那么轻易的就能分开的,我们为了实现一些丰富的表现不得不让结构去迁就(想想<div style="clear:both" />的用处)。但是知道什么是对什么是错是很重要的。即使我们有时候不得不做一些错事。

最后,我想声明的是,我并不是"非图片圆角"是无意义或是错误的。我也很佩服作者的聪明和灵感。我觉得这样的技术研究就如同以前用CSS画国旗一样,对CSS技术的熟练掌握很有帮助。但是,它的用途也应该仅和CSS国旗一样局限,不应该在实际应用中采纳。因为它违反Web标准的基本原则。

(0)

相关推荐

  • 我的一些关于web标准的思考笔记(一)

    我是从去年初开始学习web标准的,两年下来也有些心得.最近跳槽了正好闲在家里,写一些出来和大家交流一下. 1 对于web标准和W3C XHTML规范的理解 按照习惯的理解,这两个概念似乎都是指的一个东西(就是咱们在这个版里讨论的这些个"高深理论"^_^).但我认为,事实上从技术的角度上讲,这两个事物几乎没有任何相关性.web标准简而言之就是将页面的结构.表现和行为各自独立实现,更通俗的讲就是如今招聘时流行的语言"div+css".但W3C XHTML的任何一个版本都

  • 初学web标准的几个误区

    非常高兴地看到很多设计师开始关注和尝试使用web标准制作网页.但从网友们的问题和制作中发现几个问题,在这里特别提醒一下: 1.不是为了通过校验才标准化.web标准的本意是实现内容(结构)和表现分离,就是将样式剥离出来放在单独的css文件中.这样做的好处是可以分别处理内容和表现,也方便搜索和内容的再利用. W3C校验仅仅是帮助你检查XHTML代码的书写是否规范,CSS的属性是否都在CCS2的规范内.代码的标准化仅仅是第一步,不是说通过的校验,我的网页就标准化了.我们不是为了虚名,或者向别人炫耀:"

  • WEB标准字体常规定义

    web标准推荐如下字体定义方法: body { font-family : "Lucida Grande", Verdana, Lucida, Arial, Helvetica, 宋体,sans-serif; } * 字体按照所列出的顺序选用.如果用户的计算机含有Lucida Grande字体,文档将被指定为Lucida Grande.没有的话,就被指定为Verdana字体,如果也没有Verdana,就指定为Lucida字体,依此类推. * Lucida Grande字体适合Mac O

  • web标准布局实例教程,用定位轻松解决CSS复杂布局

    我相信来经典论坛学习标准的朋友,99%都不是为了进W3C,不是为了成为专业的研究人员,那么大家来的目的是什么呢?很简单,其实都是想通过标准的学习让自己多增加一项技能而已,让自己在找工作的时候不会在被"需要熟练掌握web标准"而难倒,在下面的实例中xhtml并没有什么语意,文章的目的只是让然大家能更好的掌握CSS中相对.绝对定位的用法(新手问此问题的确实很多),及如何有效的结合背景,实现比较复杂的布局.不足之处还望前辈们能指点一二,感谢! ------------------------

  • 网站程序员如何应对web标准第1/2页

    作者:jxdawei jxdawei的blog:http://www.iwcn.net/ 本文讨论的是在web标准普及的形势下,网站程序员的定位以及如何与设计师配合开发符合web标准的网站项目.本文适合的读者是传统TABLE布局下分工不是非常明晰的程序员. 1:学习web标准,让你的工作变得更加简单. web标准是大势所趋,所以作为网站程序员.你必须洗脑,必须去学习web标准.去重新认识html标签,去了解如何让程序输出页面需要的代码. 比如: 上边是美工出来的效果图,下边是符合标准的程序代码:

  • 符合web标准的媒体播放器代码

    由于Embed标签是Netscape的私有财产,故一直未被W3C认可,对于各种媒体文件使用Embed标签是非标准的,如何改变?Elizabeth Castro的 Bye Bye Embed 一文对于各种媒体播放器给出了很好的符合web标准的代码.FLash文件 复制代码 代码如下: <object type="application/x-shockwave-flash"    data="http://video.google.com/googleplayer.swf?

  • javascript 文字上下间隔滚动的代码 符合WEB标准 脚本之家修正版

    第一个 文字上下间隔滚动 修正版 符合WEB标准的文字间隔滚动JS代码 var marqueeContent=new Array(); //滚动新闻 marqueeContent[0]='14:25 HTML/JS互相转换工具-IE7兼容版'; marqueeContent[1]='14:25 css 在线压缩工具'; marqueeContent[2]='14:25 CSS整形与最佳化工具[压缩]'; marqueeContent[3]='14:25 JS Minifier js压缩'; va

  • 比较简单的一个符合web标准的JS调用flash方法

    微软XP升级出现的bug,就是对于使用传统网页制作模式插入页面的flash无法正常浏览,页面打开的时候flash周围是一个虚线框,需要点击一下才能正常浏览,以下的办法就是解决这一缺点,并且让flash能符合WEB标准,此外最重要的是,整个网站的所有flash都可以调用这一段代码,让你的代码更加简洁! 1.先建立一个flash.js的JS文件,并写入 复制代码 代码如下: function flash(ur,w,h){  document.write('<object classid="cl

  • 符合W3C Web标准的图片连续无间隙水平滚动

    这次又遇上一个这样的问题,找了老半天终于从网上找到一个不错的,看了下代码,思路很简单,但代码太多,通用性也不行,于是乎,自己又发明了两个函数,用起来感觉还真不错,与大家共享: 图片连续无间隙向左滚动,无间隙向右滚动,符合W3C Web标准_ //调用向左滚动 toleft("demo","demo1","demo2",30,"hehe123") //调用向右滚动 toright("demo0","

  • asp.net开发与web标准的冲突问题的一些常见解决方法

    论坛中也经常有从事.net开发的新手朋友问一些asp.net开发过程中与web标准之间的冲突问题,其实说到底就是客户端代码生成的问题.更高深的开发层面的东西我也说不出来,从页面前端的角度和大家分享一下建议: 少用asp.net中的服务器端控件 在Visual Studio中,有一系列强大的控件,让我们的刚开始学习.net开发人员爱不释手.但vs中的这些控件,大多都是基于winForm的那种模式搬来的,在网页开发上,有些控件还是少用为佳,比如: 不要什么也没都统统加form runat="serv

随机推荐