6.2.2. The Page

简介:

6.2.2. The Page

Ajax破坏了web页面的概念,进而颠覆了web的工作方式。那么页面究竟是什么呢?似乎页面就是用来记录信息的,并且在现实世界中的页面还有这些特性:静止,易碎,固定大小。而web页面并不受这些特征的约束,可是它还是脱离不了页面的本质属性。

下面来看一下伟大天才Tim Berners-lee 的想法吧,Berners-lee给出的页面定义:把几种不同的概念统一到了一起--首先页面是:在一个窗口中可视化的展示一些数据。第二,页面与地址是一一对应的,通过这种一一对应的关系,通过地址可以知道现在访问的页面定位,而且可以通过地址来直接跳转到对应的页面。第三,页面通过链接可以实现相互间的导航,从一个页面跳转到下一个页面。最后,页面可以直接对应显示web服务器上的一个静态文件。在web出现之前,其他的internet信息服务也有过类似的一些概念,但是都并没有统一到像“页面”概念这样一个高度。那么web的成功之处是不是因为这个呢?

web分成许多个小的单元的好处在哪?

答案是复杂的,但是可以归结到一个词:应用系统。最初的web是强调文档内容,但是很快变成以交互性为主,再后来, web应用甚至取代了一些桌面应用。随着web的继续发展,它势必会取代很多传统的应用软件,页面概念模式的约束也只会停留在这些传统的应用软件中。

Ajaxweb和桌面应用之间起到了一个缓冲的作用。对于Ajax应用旨在平衡web特性与应用特性。桌面软件在通过构建系统界面提供丰富的交互已经有数十年的经验。这些经验可以直接借鉴到Ajax设计当中来。然而,Ajax化的web应用并不等同于完全模仿桌面软件。现代的web应用既不同于传统的桌面软件也不同于传统的web网站。

6.3. Usability on the Web

前面已经讲述了可用性方面的一些常见的规则和一些在web应用中特定约束。现在来综合一下这些知识,并且将其应用到Rails中的Ajax设计当中转换为实践模式。

6.3.1. Know When to Use Ajaxand When Not To

几年前,对web应用选择是否使用Ajax技术是一个出于资源方面考虑的问题:你是否有足够的时间和经费来对不同的浏览器实施Ajax技术?Ajax并不是很复杂的技术,但是想正确应用却需要花费大量的工作。Rails改变了这种状况,它使得Ajax开发就像传统的开发一样简单。这是否意味着Ajax适用于任何工作呢?答案当然是否定的。Rails使Ajax实现变得简单并不意味着你总要使用Ajax,关键在于你要做的事情合不合适用Ajax来做。

基于怎样实现AjaxRails怎么样使Ajax变得简单,这会诱惑你滥用Ajax。下面来看几个需要注意的地方:

6.3.1.1. Don't break the back button

可能使用Ajax最基本的一个规则就是不要改变“返回”按钮。回想一下前面讲述的期望:如果应用与用户期望不相一致,这种设计是不合理的。在web中,“返回”按钮是用户期望最大的一个部分,也是web用户经验中最关键的一个组成部分,破坏返回按钮,会导致用户非常的失望。

谈到了返回按钮,它实际上相当于一个地址栏导航的占位符。用户期望浏览器地址栏中的URL能够与窗口中显示的内容相匹配。这样做有这些优点:手工输入改变URL来进入网站的不同页面,复制粘贴URLemail中,创建书签,访问浏览器历史记录,等等。有了URL地址可以让你更直接明显的告诉别人什么东西在什么地方,而不像有些应用flash过度的网站,你得告诉别人先进入这个网站,然后点击什么,跳过介绍,然后往下来,再点击什么链接

这些类似的问题也可能因为Ajax的滥用而出现在你的应用中。XMLHttpRequest请求不会记录到浏览器的历史中,也不会改变地址栏中的URL。这告诉我们一个使用Ajax的基本规则:不要在导航中使用Ajax.

6.3.1.2. Don't use Ajax for navigation

这是一个简单的经验法则:不要滥用ajax来实现导航。那么,什么是导航?在一个待办事项清单上新增一个项目吗?还是标记邮件的后续?这可能还值得商榷,所以分情况好好考虑一下。如果一个Ajax调用会导致页面大部分内容改变的话,你可能已经在使用Ajax导航了。如果你点击刷新,页面的实质性内容没有发生改变,那么你可能是安全的。

另一方面,拿Google maps来说,它的最重要的特征就是页面上呈现可拖拽的地图。通过点击鼠标,就可以在世界各地旅游了。因为地图使用了Ajax来更新,URL也没有发生改变,当用户想收藏在地图上的定位时,会令他们感觉很失望,因为无法实现这个功能,google地图很像是在导航,如果有一个返回按钮实现返回上一次定位的功能也是合情合理的,但是google map上没有这个功能。在这个例子中,基于ajax实现的导航的有利方面应该另行考虑。

6.3.2. Keep Page Elements Consistent

Ajax应用之前,web开发人员通常是让各个页面保持自我独立和自我一致。当Ajax加入到应用中后,web开发者需要保证页面上的所有元素保持一致性。

举例来说,假定你现在正在开发一个email应用,未读邮件的数量显示在页面顶部和窗口的标题栏。如果你使用Ajax更新收件箱,所有那些页面上的元素应该保持一致。RJS使得多个元素的更新变得更容易:

 
 
 
 
 
 
关于 Prototype Event.observe 方法详情参阅第十章。




本文转自 fsjoy1983 51CTO博客,原文链接:http://blog.51cto.com/fsjoy/113222,如需转载请自行联系原作者
目录
相关文章
|
6月前
|
机器学习/深度学习 传感器 人工智能
GE           V7668A-1310B0 350-9310007668-131020 D 
GE           V7668A-1310B0 350-9310007668-131020 D 
25 0
|
7月前
369-HI-R-M-F-E-H-E GE MULTLIN
369-HI-R-M-F-E-H-E GE MULTLIN
55 1
369-HI-R-M-F-E-H-E GE MULTLIN
|
8月前
|
Unix Linux AI芯片
4.3.3 info page
4.3.3 info page
50 0
|
缓存
ViewPager2 详细使用
ViewPager2 详细使用
My FioriTest navigation from master page to detail page
Created by Wang, Jerry, last modified on Feb 16, 2015
101 0
My FioriTest navigation from master page to detail page
|
存储 缓存 算法
我们还需要Page Cache么?
作者:齐江 杨艇艇 马涛
1033 0
|
JavaScript 前端开发