技术开发 频道

Web开发者:从Flash到HTML 5的捷径

        【IT168 技术】Steve Jobs在2010年4月发布文章《关于Flash的思考》,引发了HTML5与Flash史诗般的论战。许多积极的开发者提出了他们的观点。一些人说Jobs错了,或者部分的或完全的同意。3年过去,HTML5日益强大,我这样的聪明人当然应该过去瞅瞅。可问题是:怎么开始呢?

  身为Flash开发人员,从巨混乱的HTML5工具、库类或框架里找到入手之处,真是难为我的。经过忍受学习HTML、JavaScript、jQuery和CSS基础的头痛,加上很好的耐心,我挑选了一些工具,认为可以简化从Flash到HTML5的转换。我的想法是尝试用Flash已有的东西创建HTML5。这些有:

  PreloadJS加载资源

  有很多不同和有趣的方式加载资源到HTML5页面中。Grant Skinner有长时间Flash开发经验,他的PreloadJS似乎是个好的开始。PreloadJS是CreateJS的一部分,包含了许多的库类,比如动画。

  使用Cufón支持大尺寸自定义字体

  自定义字体在Flash中使用频繁,但是在HTML5上很难做。最大的问题是浏览器的不一致,也是HTML作品面临的最大问题。你可能会用CSS属性 @font-face嵌入字体。不过Cufón提供JavaScript的解决方案,可以减少一些问题,尤其是使用大尺寸字体的时候。

  Cufón的优势是处理大字体时Windows上看起来更平滑,在不同浏览器上看起来完全一样。

  Cufón另一个好处是使页面加载更快,不需要等待整个字体文件下载。你还可以只加载特定你需要的几个字符。你可以从这个体验教程开始。

  补间动画(Tweening)是大头

  动画使项目更好看,以前也有如Tweenlite样的好工具。幸运的,Greensock的创始人和他的伙伴决定让Greensork Tweening支持JavaScript。

  HTML5 Canvas 绘图API

  谁不被ActionScript的绘图API所吸引?事实上,有很多开发者更喜欢用可重用的代码制作组件,而不是依靠Flash IDE。HTML5 Canvas API带来了方便。它和Flash不完全相同,但绘出一些图形后你会发觉一些和Flash“grapics.drawRect()”相似的方法。如果你想更接近Flash的操作,使用EaselJS,也是CreateJS的一部分。Lee Brimelow写了体验教程入门。

  更好的信号事件机制

  事件机制是绝大多数Flash应用的核心,而且他们无法在HTML5中那么有效。当然你可以使用JavaScript的原生事件功能。我找到Miller Mederios开发的自定义事件/消息系统,JS-Signals,可能是更好的选择。

  Flash深链接,试试Crossroads

  不是什么项目都需要这个,不过Flash深链接增强可用性很多使用。Miller Mederios的Crossroads胜任。还有别的选择,不过我还是觉得这个易用。

  为了方便,我就不提及比如音频、视频、3D、物理、地理和本地存储这些更先进的技术。不过我建议你试试我提到的一两个工具。它们会是很好的热身,更方便的从Flash到HTML5,希望这些对你有帮助。

0
相关文章