创意纪

再来回顾这里提到的一下网站项目的12个步骤：

1 需求调查。

2 需求分析。

3 页面草图设计。

4 页面确认。

5 页面制作和UI设计完成。

6 技术开发。

7 alpha测试。

8 页面和功能修改。

9 beta测试。

10 页面发布，完成。

11 数据统计评估。

12 运营。

在需求分析和制作页面草图的时候，其实我们已经要开始设计用户的操作模式了。在这里，大家可以尝试点击其中的链接，你会发现绝大多数都会在当前窗口基础上显示一个窗口，但不是传统的浏览器窗口，因为页面并没有刷新，用户的感觉和在windows中很接近。你会发现非常多的网站都在使用这样的技术来达到之前没有的用户体验，包括gmail和outlook webmail这两个我常用的都是此类应用的登峰造极之作。它们的背后，这个技术叫做Ajax。

Ajax的定义：Ajax 是 Asynchronous JavaScript and XML（以及 DHTML 等）的缩写。这个短语是 Adaptive Path 的 Jesse James Garrett 发明的。

Ajax 由 HTML、JavaScript™ 技术、DHTML 和 DOM 组成，这一杰出的方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用程序。

Ajax 应用程序所用到的基本技术：

* HTML 用于建立 Web 表单并确定应用程序其他部分使用的字段。
* JavaScript 代码是运行 Ajax 应用程序的核心代码，帮助改进与服务器应用程序的通信。
* DHTML 或 Dynamic HTML，用于动态更新表单。我们将使用 div、span 和其他动态 HTML 元素来标记 HTML。
* 文档对象模型 DOM 用于（通过 JavaScript 代码）处理 HTML 结构和（某些情况下）服务器返回的 XML。

或许你已经看的糊涂了，如果你不想从事基于Ajax的开发，那么看看就可以了，不需要仔细研究了。利用Ajax之后最明显的就是页面没有刷新效果，使用户体验大大增强。Ajax开发相关的知识可以查看这里。

互联网是一个开放的世界，有很多人已经开发了非常优秀的基于Ajax技术的函数库，这样我们开发项目的时候就可以节约很多时间，从实践的经验来看，一个优秀的掌握了w3c知识的网页设计师只需要2-3天就可以掌握YUI和extJS的使用，对于静态的项目已经不需要有太多技术人员参与了。(当然实际的项目一般都会需要程序员的介入，YUI和extJS主要用在界面呈现上，而数据的来源还是需要程序员来操作)

YUI：YUI是Yahoo!提供的一组JS实现的开源Web UI库，基于BSD协议，目前包括拖拽（drag and drop），自动完成（autocomplete），日历（calendar），颜色挑选（color picker），数据表（data table），日志（logger），菜单（menu）等等。(中文定义来自这里)。目前网站上的最新版本是2.4，下面是Yahoo YUI的网页。

下面是YUI一个datagrid的例子：

大家可以发现，YUI做出的效果已经和windows上的软件没有太大差异，浏览器上的表格不再是那样的简单的难看，而做到这些只是需要稍微添加一些YUI的js代码。

extJS是我们实际在应用中使用的支持ajax技术的js库，这里有一个有趣的解释：一个封装了常用桌面应用和Web2.0应用所需Web组件的Ajax框架。

事实如此，extJS官方网站上的口号就是这是你可以创建的基础。我们把主要精力花费在页面设计上，而不需要知道它到底是怎么出来的。以extJS的界面效果，已经非常接近delphi下面的devExpress了。

下面这张extJS的介绍图片上，大家可以看出其部分风采。

为什么要提一下YUI呢，其实用YUI已经可以做出非常cool的网页效果，而extJS是基于YUI的扩展。

我们做网站，以及做一个专题的目的是吸引用户，我们需要知道用怎么样的手段和工具，对于工具本身的构成和使用不在此研究范畴。extJS官方网站上有很详细的中文版本介绍，稍有基础的朋友都能看懂。

现在我们终于可以突破web浏览器的一些瓶颈了，不骚扰用户的UE效果可以借助强大的ajax来实现了。只是路刚刚开始，我们之后继续探讨下面两个重要的环节：

web项目基本测试方法，a测试和b测试。

web项目运营。如果说流量为王，那么运营致胜。

并不是说用了extJS之类就不需要程序工作，只是在这个例子中不提而已。实际上，模块设计中的数据来源就是需要程序提供的，而对于动态专题的静态化发布而言(不是简单的动态页面静态化)，需要我们做更多的工作，有机会另外讨论。

（last update 2007.12.10.）

相关内容

• 没有相关内容.