HTML5反映了在网络上和在云端实施业务的方式的巨大变化。本篇文章是一个由四个部分构成的系列的第 二部分，该文章系列旨在寻找并突出说明HTML5中的变化。其开始先介绍新的标签和页面的组织，接着提供一些网页设计方面的高层面信息，然后是表单的创 建，以及API的使用及其价值所在，最后是Canvas提供的一些颇具创意的可能做法。这一第二部分介绍了HTML5表单控制的概念，并涉及了 JavaScript和CSS3在其中发挥的作用。

（译者注：由于yeeyan编辑器对文章中的标签做解析的原因，我在每个标签的<符号之后都加入了一个空格，比如说，左尖括号<+fieldset+右尖括号>，我会写成< fieldset>，以便其能够在文章中正确显示，不便之处敬请谅解。）

企业级机构的管理、数据分析、营销策略以及其他功能都很重要，然而，如果没有合格的数据窗口可提供给你的潜在客户使用的话——或是激发起用户的使 用兴趣的话——那么促使站点访问者转化所必需的最初过程就是缺失的。一种积极的、鼓励交互的、用户友好的体验是机构的主要目标，而这种交互是需要你的努力 来达成的。

交互的核心是站点的表单，这些表单方便了与用户的互动交流，因此，最初引发网站构建的目标可通过转化站点访问者来推进。表单是活跃网站所有者或是代理商和网站用户之间的交互的核心因素，正因为如此，它们在设计和开发网站过程中就显得极为重要。

核心的核心部分是控件——单选按钮、复选框、文本框、数字的微调控制器等等。对于与站点进行对话的网站用户来说，这些元素都是必不可少的。换句话 说，没有充分的功能控制（在“机械”的控件操作和控件适合于给定任务两方面都是），就不可能进行对话，其结果就是，没有潜在的转化。

对转化过程的关系做仔细的考虑是很有必要的，这其中包括了站点访问者和运行系统之间的交互的各个方面，验证的速度、输入、认知、导航、页面的加载 以及页面组装的方式，所有的这些方面都对转化过程产生影响。随着HTML5规范的多媒体特性和所提供的扩充的种种表单控件选项一起到来的是验证的改进和增 强，这两方面都在HTML5的把站点访问者转化成实际的站点用户的能力中做出了贡献。

对于验证以及完善的基于web的计算——一个关键的安全资产，对于这两方面来说，HTML5是一个异常有力的工具。在设计和开发旨在招徕客户的网 站时，其显得越发的重要。因此，它的使用对于维护一个好的转化率来说是必不可少的。如果你不能描绘出前景，那说明你有困惑；但如果你不能转化你所描绘的前 景的话，那就得要求紧急迫降了。

不过没关系，这里就能够提供帮助。HTML5的类型，比如说email和telephone，提供了更广泛的通信选项，其与HTML5的语义基础所赋予的结构化清晰度相结合，使得不会再有什么壁垒存在于你和其他一切的畅通对话之间。

鉴于我们的以网络为中心的世界、随机性日益增强的全球经济的忙碌步伐、云计算的快步发展、移动技术使用的呈指数增长，以及跨平台的通信解决方案 ——既指商业的也指社会的——很明显，我们正站在一个基于web的计算和通信的美丽新世界的门槛上。这一世界是通信的许多元素与IT之间这种不断进化的联 姻的函数和导数，同时也是一个高度竞争的全球社会的需要。

设计表单

在HTML5中，表单已经做了重大的修整，一些以前需要JavaScript编码的任务现在已经可以在不需要编码的情况下就很容易地完成。本文中的表单例子分析了HTML5的表单创新套件的用法，当然，这一过程的第一步是规划表单。

你要开发的表单例子的布局如图1所示，你要开发表单页面的三个区域：Header区、Form区和Footer区。Header区包含了封装 在< header>< /header>标签中的页面标题和副标题。在页面的底部，Footer区包含了放在< footer>< /footer>标签内的版权信息。我已经在这一文章系列的第一部分所提供的例子中讨论了Header区和Footer区的构造，如果你对< header>和< footer>标签不太熟悉的话，请参阅该篇文章。

图1. 表单页面的布局

对这一表单的讨论重点放在四个标签上：

在HTML5中，两个新的属性被加入到了< form>标签中：autocomplete和novalidate。autocomplete属性启用了出现在诸如Google一类的站点中的下 拉建议列表，novalidate属性关掉表单的校验，这在测试过程中是很有用的。< fieldset>标签有三个新的属性：disable、name和form。disable属性禁用< fieldset>，name属性设置< fieldset>的名称，form属性的值是是< fieldset>所属的一个或多个表单的ID。在HTML5中，< fieldset>可处在其所属的一个或多个表单的外部，当< fieldset>被置于表单的外部时，你必须要设置该< fieldset>标签的form属性，这样< fieldset>就可以正确地与一个或多个表单关联起来。

定义输入元素的类别的< label>标签有一个新的属性：form，form属性的值是< label>所属的一个或多个表单的ID。< label>标签也可放置在表单的外部，因此这里的form属性也是用来把< label>标签和适当的表单关联在一起的。

< input>标签有几个新的类型，以及一些新的属性，这些都增强了表单的可用性。HTML5引入了几个新的input类型，目的是组织和分类数据，复制出HTML5的整个语义路径。形式应该服从内容这句古训很适合于描述HTML5的表单功能。

在HTML5中，表单的< input>域可以处在< form>标签的外部，form属性标识了输入域所属的一个或多个表单，其还可以通过引用form的ID来标识其