Web标准 的归档:

Unobtrusive的Web开发

Unobtrusive的Web开发得到越来越多的开发者的支持,也是一种开发出符合Web Standards的完美前端代码的开发方式。通过那些方法可以更有效的做到unobtrusive?为什么要使用它?这些问题在Jesse Skinner于2006年10月发表的一个Presentation中都做了阐述,这里做了一些要点的翻译,与大家分享。

更具可访问性的Display: none;

现在越来越多的网页出于各种各样的原因会将页面上的一些区域(通常是div)隐藏,CSS隐藏元素的方法也有很多种,最常用也是最好用的就是display:none。可是被赋予这条规则的元素会在某些辅助设备中被认为不存在于文档模型中,所以造成该区域中的内容不可访问。

CSS的力量

刚在Ajaxian上看见的,一个展示了CSS 改变网页表现的Gif动画,挺有意思。

另一种针对IE下的CSS解决方案

今天在看Google Reader的代码时发现有这么一段:
<!–[if IE]>
<link href=”/reader/ui/1353527812-scrollIE.css” type=”text/css” rel=”stylesheet” />
<![endif]–>
<!–[if IE 6]>
<link href=”/reader/ui/3030724210-scrollIE6.css” type=”text/css” rel=”stylesheet” />
<![endif]–>
一开始还以为是HTML注释,后来仔细一看不是,于是google了一下,找到了quirksmode.org的一个页面。
原 来此物是一种叫“条件注释”(Conditional Comments)的东东,这是一种只在Windows下的IE上被识别的注释,从IE5开始支持。这就是说,被定义于其中的东西只在IE下被识别,这就 成为了一个很好的跨浏览器样式一致解决方案。下面是其详细的语法:
<!–[if IE]>
在IE下显示
<![endif]–>
<!–[if IE 5]>
在IE 5下显示
<![endif]–>
<!–[if IE 5.0]>
在IE 5.0下显示
<![endif]–>
<!–[if IE 5.5]>
在IE 5.5下显示
<![endif]–>
<!–[if IE 6]>
在IE 6下显示
<![endif]–>
<!–[if IE 7]>
在IE 7下显示
<![endif]–>
<!–[if gte IE 5]>
在IE 5及更高版本下显示
<![endif]–>
<!–[if lt IE 6]>
在IE 6一下版本中显示
<![endif]–>
<!–[if lte IE 5.5]>
在IE 5.5及一下版本显示
<![endif]–>
<!–[if gt IE 6]>
在IE 6以上显示
<![endif]–>
此外,还提供了另外一种方法——注释标签(Comment Tag)。即在Windows和Mac的IE中支持一种非标准的标签:<comment>,包含于这个标签内的内容在IE下将被解释为注释从而无效,而在非IE浏览器中会将comment标签忽略从而使里面的内容有效。