发布 WebStandards Update - Visual Studio 2010 编辑器 中的 HTML5 支持

[原文发表地址] Announcing the Web Standards Update - HTML5 Support for the Visual Studio 2010 Editor

[原文发表时间] 2011-06-15 04:59 PM

很多人问道：“Visual Studio 2010什么时候才会支持HTML5？”我开玩笑道：“答案就是“昨天”，因为今天没有什么能阻止你在Visual Studio 2010或ASP.NET中创建HTML5功能”。然而，智能感知的缺乏和大量被标上红色下划曲线的代码不禁让人很郁闷。同时HTML5不断的在变化，没有明确的界定。我们以前就提到过，Visual Studio的下一个版本将会更好的支持HTML5功能，但是现在的事实是怎样的呢？

现在，在Mads Kristensen的带领下，Web 平台和工具团队的部分成员很高兴地宣布Visual Studio Web Standards Update的发布。这款更新向所有 Visual Studio 版本增加了更好的 HTML5、CSS3 和新 JavaScript 功能的支持。

需注意，这并不是微软官方发布的产品，而是一些热衷于此的人利用他们闲暇时间做的一些改进支持。

下载the first Visual Studio Web Standards Update

HTML5 正在迅速发展，而这项更新也志在与它保持齐头并进。它增加了Visual Studio对HTML5的支持、HTML5编辑器、CSS3和新的JavaScript的支持。它的目标可能是当出现新的性能或元素时能够实现约每季度一次的升级。我们希望ASP.NET web开发者们能够使用最新的标准，同时也能够从现有的标准中进行选择。请记住，现在你可以同时使用HTML5和诸如Modernizr的JavaScript 库，并允许你通过所有的浏览器来创建新的网页，其中包括一些过时的蹩脚的浏览器。

The Visual Studio Web Standards Update为下列内容提供智能感知和验证：

HTML 5 功能

视频和相关标记

音频和相关标记

新输入类型，比如电子邮件、url、日期等

拖放支持

辅助功能标准WAI-ARIA

微观数据

浏览器APIs

地理定位 -- 网站能感知位置站是一个日益明显的发展趋势，而现在你也能在Visual Studio里获得全面的智能感知技术和验证功能。作为一个很好的示例，请查看 IE9测试演示网站上的源文件。

本地存储 -- IE从IE8开始就支持本地存储，所以现在Visual Studio会为你提供完整的智能感知技术来创建能在浏览器内保存其状态的网站。关于这个例子，请查看HTML5演示网站上的源文件。

CSS3

2D变换 3D 变换 动画 背景和边框 基本边框模型 基本UI 行为 颜色 灵活的框布局 字体 为分页媒体生成的内容 超链接表示 行 列表 跑马灯效果 媒体查询 多列 命名空间 分页媒体 演示效果 Ruby 选择器 语音对话 语法 模板布局 文字 动画过渡效果

另外，如果你正试图创建一些能在一系列平台和浏览器上运行的网站的话，你会喜欢上这样一个事实，Web Standards Update不仅支持IE上一些特定的前缀如“-ms”;而且还支持其他供应商的前缀如“-webkit和-moz.

Visual Studio中的HTML5

启动Visual Studio 2010时，你可以逐个文件选择想要的 HTML 版本。或者你也可以设置默认值。

旁注：看到单独列出的IE6了吗？它自从前就一直在那里。但愿它能早日消失。不用理会它。

你同样可以把它设置为默认，通过Tools | Options | Text Editor | HTML | Validation。注意和错误相关的选项。

所有新的HTML5语义标签都在那里，比如section, svg, video,等等。这仅仅是第一个版本，因为它非常复杂，我确信肯定会有bugs.但是，它会定期地进行更新，所以请确保您报告了您所发现的任何错误并期待它在下一个版本中得到修复。

这里对重要的（但是未被完全应用，或未得到足够重视的）属性如WAI-ARIA（Web Accessibility Initiative - Accessible Rich Internet Applications）也提供支持。

同时，aria-*属性的智能感知支持不仅包括了属性本身，同时还包括了枚举值：

标记当然非常有趣，那么微观数据又如何呢？Bing、Google 和 Yahoo 都支持微观数据，以及更具体的 schema.org 词汇。因此，此更新将对大部分流行词汇（包括 schema.org 和 data-vocabulary.org）添加智能感知。

说真的，请告诉我这并不是过于狂热。SEO是最棒的。

Visual Studio中的CSS3

前面仅仅介绍了 HTML5。而CSS3也同样有所支持。CSS3相对于CSS2来说是更好的一个版本。

它包括所有最酷最新的CSS3功能，比如多列布局，当然还有 边框圆角，动画和图形转换等等。关于其他供应商特定的前缀如-webkit, -moz 和-ms等，也有许多详细信息。

请注意当我们选择-webkit-transform速记属性时，下拉条会在弹出的“工具提示“中显示相关信息。

Visual Studio中的JavaScript 和HTML5

此更新增加了众多 JavaScript 智能感知功能。比如，通过navigator.geolocation来实现地理定位，通过window.localStorage来实现DOM 存储功能。

下面是用HTML5和JavaScript写的简单的代码段，使用了一些最新的本地存储功能，并展示了智能感知功能。

你或许会把智能感知看作一个概念或辅助工具，我更倾向于把它看作是一个“实时的对象浏览器”。它帮助我开发新技术，挖掘那些可能没有注意到的边边角角。

我们不能预知Visual Studio或HTML5的下一个版本，但对此有兴趣的人来说，我希望这个会不断更新的 Visual Studio Web 标准支持工具能帮助到你们。

亲爱的读者朋友，希望你们喜欢。

PS：这项更新是针对于那些想使用HTML5，新的JavaScript 性能和 CSS3的ASP.NET 和HTML5的编辑者们。我并没有提到Silverlight。 因为它与这款Update毫无关系。我曾经讲过：“你最喜欢的技术在主题演讲中没有提到并不意味着它就没有用武之地了。”这同样适用于博客文章。

补充备注：右侧的徽标并不是官方徽标，只是觉得有趣就放在这里了。