 |
| |
| Unobtrusive的Web开发 |
|
[ 2008-8-20 19:54:00 | By: grace0556219 ] |
对Web前端进行分层
Web前端的分层：
核心思想：结构（HTML）、表现（CSS）和行为 （Java）
物理上：.html、.css和.js文件
概念上：各层之间，相互独立，互不影响
借用MVC的思想：
Model - HTML
View - CSS
Controller - Java
物理上的分层
CSS只出现在.css文件中，Java只出现在.js文件中
在HTML中不会出现、或者style属性
不使用不赞成使用的HTML，比如font标签和align属性
概念上的分层
内容和表单在纯HTML中（没有CSS和Java）也能够正常显示和使用
表单和链接在没有Java时候也能正常工作
只在CSS中定义表现，而不是在HTML或Java中
任何人可以通过任何客户端访问内容，即便是没有CSS、Java，甚至没有鼠标
两种分层有何不同
物理分层主要使开发者受益
概念分层主要让使用者受益
Unobtrusive的前端
Unobtrusive的HTML
使用更多的HTML标签
只将<table>用于表格式的数据
避免使用无意义的<div>和<span>
Unobtrusive的CSS
All CSS is unobtrusive
尽量使用可重用的class
将CSS放在外部.css文件中，或者<style>标签中
最好使用<h1>，而不是<div class="header">
Unobtrusive的Flash对象
用Java将HTML替换成Flash
Bobby van der Sluis的脚本（bobbyvandersluis.com）
将Flash的内容同样放在HTML中
如果浏览器支持Flash，用户将会欣赏性感的Flash版本
不要在HTML中加入混乱的Flash代码
Unobtrusive的Java
从纯HTML入手
Java只用来为HTML添彩
不要摆架子，测试每一个细节
离了Java，页面仍然能够正常工作
不要使用或java:void(0)
将Java放在外部.js文件中，或者<>标签中
为什么要Unobtrusive
首先，这不是必须的
大部分开发者都没有在用
一些比较值得一提的例子：
Google Maps (maps.google.com)
TWERQ (twerq.com)
Marlboro (marlboro.com)
Unobtrusive开发的优势
代码更佳简洁，并且易于维护
易读和易懂意味着更容易修改
修改全部的样式仅仅需要修改CSS文件
Java能够很容易的修改
HTML的修改变得更加保险
能够提高可访问性（accessibility）
可访问性意味着所有人都可以访问你的内容
你不能揣测所有人
但你可以肯定的是所有浏览器都能够处理HTML
大约10%的访问者是不能够使用Java功能
有些人使用的是屏幕阅读器，有些人无法使用鼠标
有利于搜索引擎优化
搜索爬虫无法解释CSS和Java
搜索爬虫只会顺着<a>继续爬行
Java和Flash中的内容无法被搜索到
更多的内容，更结构化的HTML，使得页面相关性更高
不过有时，不得不使用Java
当然，离了Java，Java游戏肯定无法运行
很多Web统计服务的脚本依赖于Java
Google Ads需要Java
对于Unobtrusive，只要尽量做到就好了
如何进行Unobtrusive的开发
不要去问别人，直接去做
从没有Java开始入手
使用带有链接和表单的纯HTML
使用CSS来实现hover和滚动效果
使用HTTP的功能（比如用”Location”头来转向）
重视链接
页面上的所有链接，离了Java都应该能够正常工作
这也意味着不使用java:伪协议
甚至不要使用<a href="#">
如果有链接一定要使用Java，那么就用Java来把链接添加到页面中
为CSS和Java提供hook
给一个页面中唯一的元素加上ID
给重复使用的元素加上class
使用列表等其他有语义的结构
使用可靠的技术
从纯HTML和CSS开始
动态的为链接和表单添加高级交互功能
同时通过HTML和JSON/XML两种方式提供内容
为有或没有Java的情况提供额外的CSS
为有Java和无Java的用户提供不同的应用
看法
Unobtrusive应该是对Web Standards的进一步深化，也可以理解为Web Standards的一个方面。但是，这种开发方式目前仍然是一种比较理想化的方式，也许在个人，或者小团队的开发中可以贯彻的很好。但是到了大型项目中，严格的执行未必是一种高效的方式。尽管代码的易维护性显而易见，但是大部分项目的前端代码不一定有维护（或者大量维护）的需求，而项目要求的更多是能够在最短时间内完成。
然而，Unobtrusive绝对是一个具有指导性的Web前端开发方式，实现得越接近，无论是对用户，还是对开发者，甚至对计算机，都会更有好处。 |
| 发表评论：
|
|
|
