Unobtrusive的Web开发（2）

为什么要Unobtrusive

• 首先，这不是必须的

• 大部分开发者都没有在用

• 一些比较值得一提的例子：

• Google Maps (maps.google.com)

• TWERQ (twerq.com)

• Marlboro (marlboro.com)

Unobtrusive开发的优势

• 代码更佳简洁，并且易于维护

• 易读和易懂意味着更容易修改

• 修改全部的样式仅仅需要修改CSS文件

• JavaScript能够很容易的修改

• HTML的修改变得更加保险

• 能够提高可访问性（accessibility）

• 可访问性意味着所有人都可以访问你的内容

• 你不能揣测所有人

• 但你可以肯定的是所有浏览器都能够处理HTML

• 大约10％的访问者是不能够使用JavaScript功能（www.w3schools.com/browsers/browsers_stats.asp）

• 有些人使用的是屏幕阅读器，有些人无法使用鼠标

• 有利于搜索引擎优化

• 搜索爬虫无法解释CSS和JavaScript

• 搜索爬虫只会顺着<a>继续爬行

• JavaScript和Flash中的内容无法被搜索到

• 更多的内容，更结构化的HTML，使得页面相关性更高

不过有时，不得不使用JavaScript

• 当然，离了JavaScript，JavaScript游戏肯定无法运行

• 很多Web统计服务的脚本依赖于JavaScript

• Google Ads需要JavaScript

• 对于Unobtrusive，只要尽量做到就好了

如何进行Unobtrusive的开发

不要去问别人，直接去做

从没有JavaScript开始入手

• 使用带有链接和表单的纯HTML

• 使用CSS来实现hover和滚动效果

• 使用HTTP的功能（比如用”Location”头来转向）

重视链接

• 页面上的所有链接，离了JavaScript都应该能够正常工作

• 这也意味着不使用javascript:伪协议

• 甚至不要使用<a href="#">

• 如果有链接一定要使用JavaScript，那么就用JavaScript来把链接添加到页面中

为CSS和JavaScript提供hook

• 给一个页面中唯一的元素加上ID

• 给重复使用的元素加上class

• 使用列表等其他有语义的结构

使用可靠的技术

• 从纯HTML和CSS开始

• 动态的为链接和表单添加高级交互功能

• 同时通过HTML和JSON/XML两种方式提供内容

• 为有或没有JavaScript的情况提供额外的CSS

• 为有JavaScript和无JavaScript的用户提供不同的应用

我的看法

Unobtrusive应该是对Web Standards的进一步深化，也可以理解为Web Standards的一个方面。但是，这种开发方式目前仍然是一种比较理想化的方式，也许在个人，或者小团队的开发中可以贯彻的很好。但是到了大型项目中，严格的执行未必是一种高效的方式。尽管代码的易维护性显而易见，但是大部分项目的前端代码不一定有维护（或者大量维护）的需求，而项目要求的更多是能够在最短时间内完成。

然而，Unobtrusive绝对是一个具有指导性的Web前端开发方式，实现得越接近，无论是对用户，还是对开发者，甚至对计算机，都会更有好处。