创建Apps与HTML5的应用:你需要知道的

HTML5是在这里,Web将永远是相同的。

毫无疑问,你已经听说过之前,或类似的东西。我猜想,当你做,你激动,卷起你的眼睛,或装腔作势的词:“为什么?”和紧锁的眉头有点。也许你的反应是混合所有三个。

我不会怪你这些。HTML5是令人兴奋的,它有可能改变网络,因为我们知道它,但它也被夸大了。更重要的是,其真正含义是难以捉摸的。我所经历的这些反应自己,同时建立与HTML5应用。这是一个广泛的话题,所以很难环绕HTML5的头,更不知道从哪里开始这个激动人心的新技术。

这是在一个系列的第一篇文章MSDN杂志,我们的目标是给你一个完整的画面,为什么在这篇文章中的第一句话是真实的和重要的。在未来的几个月中,我希望能帮助你明白什么HTML5的意味着你作为一个Web开发人员和开发人员使用微软的工具和技术。我希望能简化一些围绕你的HTML5的复杂性,多神秘面纱的炒作。我还将介绍一些HTML5特性,可今天,以及一些令人兴奋的技术,虽然有点进一出,是值得关注。最后,我将离开你的一些技巧,将帮助你采用HTML5的技术,现在,当你继续向用户提供与旧版本的浏览器经验。

如果你对HTML5的兴奋,我想帮助你的想法,你可以立即付??诸实践,变成兴奋。如果你持怀疑态度,我希望能帮助你理解为什么HTML5的是很重要的。如果你只是HTML5的甚至意味着什么困惑,不要害怕,这是我们在本系列的第一站。

HTML5是什么?

现在你可能已经发现,HTML5不同的人意味着不同的事情。一些,它只是意味着新的标签一样的和少数几个新的属性在标记。给别人,这意味着一切,这是新的和有趣的网站,包括实施技术只是一个单一的浏览器或其他规格没有正式HTML5的一部分。可以肯定的是,了解HTML5的真正意义,往往是我们许多面临的第一障碍。

而且,说实话,有一些不同的定义的理由。HTML5是巨大的!HTML5的正式国际标准组织万维网联盟(W3C)“的定义,由100多个规格,涉及到下一代的Web技术。通过把这些规范下的绰号HTML5的所有100多,你可能会说,W3C的事情简单化。而很难采取如HTML5的广泛的东西,和一个明确的定义,我相信,W3C试图解决什么在网络上的变化,通过引入一个统一的概念改变的HTML5的范围。

事实上,HTML5是一个总称,描述了一套HTML,CSS和JavaScript的规格设计,使开发人员能够建立网站和应用程序的下一代。该定义是什么值得注意的是它的三个部分:HTML,CSS和JavaScript。他们定义了开发人员如何使用改进的标记,更丰富的样式功能和新的JavaScript API,使新的Web开发功能。简而言之,HTML5的的HTML + CSS + JavaScript的。

这就是它。HTML5是HTML,CSS和JavaScript的变化。而不是担心所有100多规格,这三个方面描述了HTML5的广度和范围。仍然认为这是有点简单化?它可能是,但你很快就会看到,一个HTML5的全面定义不要紧,只要你选择值得你的时间和精力,采取的技术很多。

随着在手的定义,让我们花了几分钟,微软将HTML5的空间适合交谈。

HTML5和Internet Explorer中

正如我所提到的规格作出了HTML5的是由W3C stewarded。W3C的组成人员,组织和个人投资帮助推动和定义未来的Web。魔兽是共识为基础的组织,和一般工作形成党委(称为工作组)来划分对相关规范工作块。可以由任何成员提出的规格,并拥有所有规格,比那些通过五个阶段的过程中从初稿到正式的建议下HTML5伞移动的W3C标准更加规范。

微软是一个W3C的成员,许多HTML5标准和工作组在规范过程中起着非常积极的作用。就像所有的主要浏览器厂商,微软正在投入大量资金在HTML5与W3C和其他厂商合作,以确保开发人员能够依靠HTML5的技术被可靠地在所有主要浏览器上的互操作的方式实施。

在微软的浏览器供应商的情况下,该方法是四个方面:

提供最好的准备网站的HTML5今天通过Internet Explorer 9。
揭露即将推出的功能开发人员通过Internet Explorer平台预览。
在互操作性投资,通过提交给W3C的测试。
通过HTML5的实验室原型不稳定标准。

“HTML5的站点就绪”是长期微软用来描述HTML5的技术,您可以使用的今天,因为他们有在所有主要浏览器的广泛支持。像新的HTML标记技术,帆布,可伸缩矢量图形,音频和视频,地理定位,Web存储和许多新的CSS3模块,所有进入这个空间的下降,以及它们在Internet Explorer 9的实施,以及其他的主流浏览器。在这个系列中,我们将花费相当的时间讨论这些技术,以及如何可以采取他们今天。

超出目前,微软正在利用公共平台预 ??览告知开发人员在浏览器的下一个版本,以及什么来收集反馈。对于Internet Explorer 9,微软发布平台预 ??览每六到八周,每次宣布新的HTML5增强,功能和性能改进,为开发,试用和评估。在三月份发布的Internet Explorer 9和7月初,微软已经发布了两个用于Internet Explorer 10平台预 ??览,信号,微软将继续定期发布一个Internet Explorer的预览节奏。作为一名开发人员,你将要采取的最新预览的优势,学习,测试和影响浏览器如何演变。你可以下载在最新的Internet Explorer平台预 ??览IETestDrive.com。

为了确保HTML5的工作始终在所有浏览器,微软已经投入巨资在互操作性,创建并提交涉及到HTML5向W3C的测试用例套件的单一最大。第一次,这一套测试用例将使用由W3C HTML5的“准备”在每个浏览器的权威人士。你和我作为开发商的最终结果是,我们可以采取和实施的HTML5技术的一次,和信任,他们将在所有浏览器始终工作。微软围绕互操作性的工作更多的信息,去到bit.ly/dxB12S。

虽然一些HTML5技术已经存在的Internet Explorer 9,和别人正在为Internet Explorer 10宣布,通过Internet Explorer平台预览,一些流行的和有新闻价值的规范需要多一点的工作由W3C和浏览器厂商之前,他们将准备在我们的应用程序实施。这样的一个例子是网络套接字,一个令人兴奋的规范,让开发开放与后端服务器的双向沟通??渠道,从而实现了“实时”连接以前没有在Web应用程序的水平。作为一名开发人员,你可以毫无疑问想象中的应用,你现在正在建设的网络套接字无数用途。但Web Sockets规范仍然在迅速改变,仍然在不断变化的关键环节,在W3C正在讨论。鉴于这种情况,就很难在所有浏览器提供此功能一致,可靠的今天。

对于像不稳定或不断变化的网络套接字(我们将在以后的文章深度覆盖)的规格,微软创建HTML5的实验室,对草案实现这些技术的实验开发的网站。该网站提供的原型,你可以下载并尝试在本地,以及举办一些规格的演示。我们的目标是给你一个地方尝试这些规范自己,你给微软和W3C的反馈这些规范,因为他们在浏览器中的稳定和附近实施。对HTML5实验室的更多信息,到html5labs.com去。

HTML5和微软的开发工具

微软与W3C的参与和支持HTML5的浏览器中的技术之外,还有另外一个微软的做法,重要的是为开发的HTML5的维:HTML5的工具的方法。

*在2011年初,微软更新服务包,其开发工具:Visual Studio 2010和Expression Web中4。这两种工具的服务包提供验证HTML5的文档类型,以及新的HTML5标签和属性的IntelliSense。如果你使用Visual Studio 2010 SP1,您可以启用HTML5的模式,通过单击工具|选项|文本编辑器的HTML | |验证,然后在“目标”下拉列表中选择HTML5的选项,在如图1所示。您也可以从HTML源在任何HTML文件编辑工具栏的默认模式设置了HTML5,在图2所示。

001

图1 通过“选项”对话框启用HTML5的架构

002

图2 设置HTML5的架构上的HTML源代码编辑工具栏

一旦您的默认模式设置,您将获得28个新的语义标记的HTML,以及新的标签和全局属性在Visual Studio中的IntelliSense支持,在图3显示。

003
图3 在Visual Studio 2010 SP1的HTML5的IntelliSense

 

微软进一步更新其释放的Web标准的Microsoft Visual Studio 2010的SP1在2011年6月更新其对HTML5的支持。这个扩展,它与Visual Studio 2010的所有版本,进一步增加了HTML5的Visual Studio中的IntelliSense和验证,包括新的浏览器的功能,如地理位置和DOM存储的JavaScript IntelliSense等提供全面的CSS3 IntelliSense和验证。您可以下载该扩展,将定期更新,以提供增强工具,HTML5的发展,从bit.ly/m7OB13。

4 SP1中的Expression Web工具HTML5的架构下设置|页面选项提供相同的IntelliSense,该工具还提供了几个草案CSS3的像边境半径模块,箱阴影,改造和对CSS3的IntelliSense。

如果你使用WebMatrix(见web.ms / WebMatrix),你可能已经注意到,所有新的HTML。cshtml。vbhtml您创建的文件包含类似什么在图4所示的默认标记。正如我在本系列的下一篇文章将讨论,这是一个基本的,有效的HTML5文档。最值得注意的是,DOCTYPE和meta charset标记已失去的克鲁夫特很多。使用这个简单的doctype将触发模式,在所有的现代浏览器的HTML5的WebMatrix使你更容易默认情况下,通过提供一个HTML5文件。

004
图4 在WebMatrix一个默认的HTML文件

如果那不是足够为自2011年1月所有新的HTML5工具,ASP.NET的方式,最近的乐趣了MVC的ASP.NET MVC 3工具更新在四月宣布在MIX11。随着许多其他伟大的新工具功能,在ASP.NET MVC 3工具的更新提供选择使用HTML5的新项目和船舶,在新的应用程序的脚本文件夹中的Modernizr 1.7 DOCTYPE。Modernizr的是一个JavaScript库,大大简化了HTML5的发展,我会在以后的文章中深入讨论。

这里的外卖,即使HTML5只是在我们的浏览器出现,官方工具支持迅速增加,而微软甚至加入社区图书馆的支持(如Modernizr的)。一些从今天的微软工具的帮助下,你可以针对HTML5的期望,HTML5的支持,将继续增长,并且随着时间的推移提高。

在您的应用程序中采用“HTML5的”

现在,你应该认识到HTML5的不是一个单一的实体,你可以采取或迁移到一举。采用HTML5的,而不是作为一个批发的选择,是技术通过技术评估,并确定哪些技术是适合您的应用。每个HTML5技术为您评估,看看(至少)时,决定是否为您准备采用该技术是以下因素:

如何广泛实施在所有主要浏览器是技术?
你将如何采用此技术“polyfill”支持不支持特定功能的浏览器?
第一个因素是最重要的,了解您网站的访问者常用的浏览器相结合时,应该给你一个清晰的照片,其中100多规格的子集,值得进一步评估。该子集组成了一套稳定的规格,您可以可靠地通过用户的今天。

然而,即使是一套稳定的HTML5技术,你不应该忽视用户还没有移动到一个新的浏览器。如果你大量参与为您的网站在一天到一天的发展,毫无疑问有一些粗略的想法,一个给定的浏览器访问您的网站的用户的百分比。对于大多数人来说,它很容易与旧的浏览器访问的用户的比例看,得出的结论采取任何HTML5的技术将产生负面影响这些用户。幸运的是有“polyfilling”拯救我们未来在等待,直到采用HTML5的一些雾日。

保罗爱尔兰的jQuery和Modernizr的项目的开发人员定义1 polyfill“…… 1垫片,模仿1日后的API,旧的浏览器提供备用功能。”一个像您的网站spackle polyfill;这一种方法来确定,如果一个给定的HTML5的功能是提供给用户浏览您的网站,并提供一个垫片,支持或优美的退化过程,使您的网站仍然运作完全“填满”。

最流行 ??的库与polyfilling相关Modernizr的是,我刚才提到的JavaScript库。Modernizr的语义标记,主要的HTML5技术的功能检测和支持有条件的CSS支持的功能提供了一些基本的polyfills。如前所述,Modernizr的将是即将推出的文章的主题,它也将重点突出整个系列(以及许多其他polyfilling库)。要了解更多信息,下载的Modernizr modernizr.com。

当它来选择采用哪种技术,您的最终名单,可能是一个得到广泛支持的技术规格和其它规格,而你必须,polyfill对某些浏览器的支持相结合。只有你会知道根据您目前的需求和上下文,列表的确切构成。

在未来几个月内,我将讨论几个著名的规格,从地理位置和形式和Canvas,网络工作者,网络套接字和IndexedDB。其中一些广泛的支持和“现场准备,”一些,如Web插座,太突破性的忽视,无论今天拔地而起。每个规范,我将讨论当前和未来已知的支持,有关如何实现规范的功能,在您的网站上的一些基础知识,以及如何polyfill支持不支持特定功能的浏览器。

如果你想挖成HTML5的今天,我建议你拿起几个方面的书籍。特别是,我建议“介绍HTML5的”布鲁斯·劳森和雷米夏普“的HTML5和运行马克朝圣”(O’Reilly媒体,2010)(新车手,2010年)。此外,请确保所有规格的最新信息,以及BeautyoftheWeb.com和IETestDrive.com下载Internet Explorer 9,在Internet Explorer 10平台预 ??览版,分别访问W3C.org,了解更多有关伟大的HTML5的经验微软通过浏览器提供。

高于一切,开始采用HTML5的今天。该网站将不会是相同的,真的,你可以通过建设一个伟大的Web应用程序使用HTML5催化剂的一部分。

原文:http://msdn.microsoft.com/en-us/magazine/hh335062.aspx