在过去的几年里，许多关于HTML5的报道都聚焦于它在公司战斗的大战略中的角色:will苹果在HTML5规范?谷歌是否与它对Flash的支持相抵消?
在操作中迷失的是HTML5真正的技术成就，以及它们为单个组织带来的战术机会。
如果你想要提高你的搜索排名，更好地支持移动阅读器，并改变你的开发过程，那么是时候将HTML5整合到你的网页工作中了。
首先，我要澄清一下。“HTML5”并不是一个单一的产品，比如Oracle数据库管理系统的11g版本。相反，HTML5是一系列定义的集合，即使是最狭义的定义，也没有现有的Web浏览器完全支持，但所有主流Web浏览器都部分支持。
更广泛地说，HTML5不仅包括HTML标准，还包括相关的CSS3(层叠样式表)、JavaScript、多媒体编解码器和SVG(可缩放矢量图形)，它们共同努力，最大限度地利用了新的HTML定义。
当然，HTML5可能并不适合所有组织。它是否适用于特定情况，需要详细了解终端用户的浏览器，使用的HTML5的部分，以及组织的Web存在目标。
没有实际应用程序同时使用HTML5。您需要的部件与您的终端用户运行的浏览器的兼容性，以及您的服务器技术方面，是一个需要深思熟虑的问题。
但是，可以肯定地说，现在是大多数开发团队采用HTML5并开始利用它的四个强大优势的时候了。
1.更快的图像下载，特别是移动用户
在网页设计中，“渐变”是一种背景效果:一个微妙的阴影或纹理的“窗口”，您的网站正确地观看。企业设计师在色调的平衡、边框的匹配以及其他方面都付出了相当大的努力，以达到一种色调或风格，这种风格对大多数观众来说既重要又无意识。Jacob Gube, Six Revisions网站的创始人25个在网页设计中使用渐变效果的好例子"．
最初20年的渐变效果是通过“绘画”实现的。在HTML5之前，背景必须以图像的形式提供(可能是从几个子图像拼接在一起)。例如，Photoshop有一个“渐变工具”，主要用于构建背景图像作为渐变使用。这已经非常成功了，因为基本上每个有能力的Web设计师都会使用渐变作为背景图像。
HTML5的变化。HTML5的CSS3部分从语义上表达梯度，也就是说，用有意义的文字，而不是图片。这里有一个例子:
.gradientArea {background: -o-linear-gradient(#FFB260， #FF7F13);过滤器:progid: DXImageTransform。微软.gradient(startColorstr='#ffb260'， endColorstr='#ff7f13'， GradientType=0);｝ ｝
这个例子的详细语法，或者把它渲染成一个浅橙色矩形，都不重要;重要的是通过文字而不是图像来表达它的结果。
首先，它更紧凑。CSS3梯度规格通常是几百字节;背景图像的渐变范围往往达到数千。然而，比这种表面优势更重要的是，CSS3梯度是内联的:它的传输不需要打开另一个文件。当如此多的web站点访问者通过带宽较低的移动浏览器访问时，保持较低的页面渲染辅助连接数量对于保持性能是至关重要的。
从广义上讲，您的Web设计人员所做的事情与以前一样——使用Photoshop渐变工具，或类似的工具——但导出到CSS3而不是HTML4或XHTML。终端用户在他或她的浏览器中看到的内容是无法区分的，但这是通过更快的下载实现的，也许更快。此外，将CSS3梯度调整到不同的屏幕尺寸更容易，这对手机用户来说有明显的好处，因为他们的线性屏幕分辨率可能会有一个数量级的变化。
技术细节使这幅图稍微复杂一些:
•原则上，内联旧式渐变是可行的，这样可以降低下载成本。很少有人这样做。
•HTML5包括CSS3范围之外的其他渐变效果;和
•CSS3对梯度的支持引入了新的可编程水平。例如，可以根据观看者的年龄或位置来调整渐变。
虽然这些可能性对程序员来说很有趣，但我们不推荐它们。不要让它们分散你对HTML5语义表达梯度的注意力:它们能够更快地下载，更容易移植到手机上，并且维护成本更低。
2.改善搜索引擎优化
其他几种常见的图形效果都有CSS3表达式，包括不透明度(前景图像足够透明，使其背景部分可见)、圆角和阴影。所有这些与CSS3梯度共享紧凑上传和更容易跨平台维护的优势。他们还介绍了搜索引擎优化(SEO)的优点，值得仔细解释。
要理解SEO的含义，先回到梯度。CSS3梯度的另一个技术优势是它们与源代码控制系统(SCCS)更兼容。在CSS3之前，梯度是通过图片来实现的。在普通SCCS中更改图像是一种不透明的操作:SCCS本身只能记录发生了更改，以及关于更改的任何评论。
通过CSS3梯度的语义标记，SCCS可以方便地对表达梯度的文本进行操作。SCCS可以自动报告，在某一特定时间，梯度的色调或强度发生了变化，格式如下:
< background: -o-linear-gradient(#FFB260， #FF7F13);
---
> background: -o-linear-gradient(#FFB260， #FF3F13);
程序员发现这非常方便:他们用来管理源代码的工具，包括经过验证的产品版本的构造，可以更自然地扩展到Web设计的图形构造。
这一优势在不透明度和其他CSS3标记方面更加明显。假设一家名为“Acme Widgets”的公司在其主页上使用不透明度来设计自己的名称。在CSS3之前，这是用Photoshop或类似的工具完成的，结果是显示带有特定不透明度的单词“Acme Widgets”的图像。
不管图片多么醒目，内容都被搜索引擎搜走了。因为它们被嵌入到图像中，所以搜索引擎实际上看不到“极致小部件”这个词。在搜索引擎发展的早期，有几个著名的例子是，重要的Web页面没有精确地显示在搜索结果中，因为搜索引擎看到的文本内容比人类读者看到的要少得多。
CSS3改变这种情况。CSS3使得将页面的更多文本内容保持为文本成为可能，同时仍然对其不透明度、2d和3d效果进行样式设置，等等。本身对SEO有足够让CSS3引人注目:Web页面的美丽并不重要,当没有人看到他们,和老风格的图形实现让太多的内容可见搜索引擎和未来的访客使用它们。
3.复杂的动画效果
HTML5充满了上面已经解释过的特性:HTML5以更低的成本，更快的加载时间，以及语义标记的SEO和维护优势，提供了顶级Web设计师已经实现的外观。HTML5还引入了通常超越早期标准版本的效果;其中之一就是动画。
对于复杂的动画效果，过去的网络团队通常转向Flash。Flash有众所周知的缺点:搜索引擎不会对它进行索引(严格来说不正确，但肯定是一个不利因素)，苹果的iOS和其他操作系统不允许它安全概要文件和许可证限制了它在许多组织中的使用。然而，在HTML5中，相对复杂的视觉动画可以作为语义动画使用。
4.更容易的Web应用程序开发，特别是移动应用程序
HTML5提供的最后一个定性优势是，作为一个足以与原生应用竞争的编程环境，它足够丰富。这对移动终端用户来说尤其重要。本地应用程序开发成本高昂:它的程序员成本高昂，授权范围介于异想天开和令人沮丧之间，可移植性也是一个挑战。HTML5是如此强大，以至于许多应用程序可以完全使用HTML5进行编码。考虑一下原生应用的优势:
•搜索引擎自动覆盖;
•直接访问终端用户，不需要安装任何东西;和
•跨越内部桌面、移动和远程家庭或办公室使用的单一代码库。
HTML5已经酝酿多年。它的许多定义器捕获了web站点构造的最重要部分，并将它们作为语义标记和可理解的api提供。明智地使用HTML5可以更快、更灵活的下载、更好的搜索引擎定位和更容易的开发。
Laird是精品开发咨询公司Phaseit的副总裁，也是SVG特邀专家，经常撰写HTML和与Web相关的主题。可以和他联系Cameron@phaseit.net．