游戏邦在:
杂志专栏:
gamerboom.com订阅到鲜果订阅到抓虾google reader订阅到有道订阅到QQ邮箱订阅到帮看

论述2011年HTML5技术的六大发展趋势

发布时间:2011-12-09 16:31:15 Tags:,,,

作者:Dan Rowinski

HTML5从根本上改变开发者应对网络的方式。无论是桌面浏览器,还是手机平台,未来很快就会出现新语言和标准。

在手机领域,分歧开始出现:网络还是原生?随着HTML5标准的出现,二者的差异开始逐渐模糊。本文主要谈论HTML5的发展情况。

HTML5 Logo from de.appchina.com

HTML5 Logo from de.appchina.com

1.移动优先

从根本来说,移动优先首创精神主要起源于网页应用与原始应用孰优孰胜这个问题。

今年我们发现有些大型公司在HTML5设计上开始采取移动优先方案。《金融时报》将其《金融时报》iPad原生应用移除苹果App Store,旨在跳过其订阅和分成政策,其凭借锁定手机平台、运用HTML5技术的网页版内容取得突出成就。

由于越来越多智能设备开始运算处理中占据优势地位,尤其是在消费者/消费方面,优先锁定移动网页开发内容的趋势未来将继续延续。从某种程度上看,用户并不在乎应用所采用的语言,只要其运作效果达到预期标准即可。随着HTML5的发展,网页应用和原生应用间的性能差异逐步缩小。

2. 游戏开发者独领风潮

今年我们多次看到某些手机开发商开始追求游戏多元化策略。从某种程度看,游戏开发者通过以HTML5充当新平台,避开苹果在App Store付费应用和虚拟交易中的30%分成,成为最大受益者。游戏是手机平台最热门的应用,也是Android和苹果设备如此大受用户追捧的一个原因。

很多游戏开发者都受到Facebook、Zynga等公司的推动而继续向前。Facebook应用生态系统的未来将基于HTML5。游戏开发者,例如MocoSpace或Moblyng等公司正努力制作既有应用的HTML5版本。

但游戏不是网页应用的全部。通过PhoneGap及appMobi HTML5开发工具包XDK,网页手机游戏能够轻松入驻原始应用商店。这同Facebook处理自身手机应用的方式相似。内容基于网页和浏览器,但具备原生功能。

3. 响应式设计&处理屏幕尺寸

在HTML5真正变革各平台的开发模式前,定需要取得某些根本性的突破。今年的的一大突破就是“响应式设计”的发展。从根本来说,响应式设计需让内容适应任何屏幕尺寸。今年响应式设计最引人注目的案例要数Boston Globe推出BostonGlobe.com(游戏邦注:其移动优先网页应用适用任何任何屏幕尺寸)。我们9月份曾采访Filament Group,他们是Globe响应式设计背后的开发商,从中我们发现进行响应式设计绝非易事。有些基本概念需要从头做起,例如处理媒体查询的RespondJS概念。而基于第三方资源处理照片和广告也是难事。

4. 访问设备功能

appmobi dec11 from readwriteweb.com

appmobi dec11 from readwriteweb.com

消除网页应用和原生应用差异性所面临的一大障碍是让基于浏览器的应用能够利用手机设备的某些基本性能,如摄像头、通讯录、日历、和加速计等。

对手机开发者而言,访问设备功能是HTML5技术最大的创意点。这意味着真正的网页应用能够出现在手机平台,无需进行任何PhoneGap式包装。游戏开发者将感到非常高兴,因为之前未解锁的内容,如加速计或手机阅读状态,将植入游戏。这带来新的可能性,例如更优质的云端整合,强化游戏玩法。根据平台的不同,应用能够基于Javascript、CSS3、HTML及其他语言进行制作,通过APIs、SDKs、云技术及其他活动部件获得创造功能。HTML5也是最近才支持其中某些功能。这依然处在变化中,将会是2012年的一大发展。

5. 离线缓存

是指应用能够在未连网的情况下继续运作?离线缓存的概念相当新颖,是有待网页应用深入挖掘的HTML5重要性能。今年,说明离线缓存得到广泛运用的例子要数Kindle Cloud Reader,这是入驻亚马逊的网页应用,旨在通过浏览器提供Kindle同步功能,在Kindle用户文库中记录所有内容。这能够运用于Firefox 6+、Chrome 11+、Safari 5+和iOS 4+。离线缓存的拓展空间很大,其主要优点是让网页应用能够在未连网的情况下继续运作。很多学者认为这是令原生应用走向消亡的一大原因。

Kindle Cloud Reader Browsers from readwriteweb.com

Kindle Cloud Reader Browsers from readwriteweb.com

6. 开发工具的成熟

读写网今年8月的一篇文章曾给予瞄准HTML5的开发者如下建议:

* 考虑时间。这可能会耗费比你之前项目更久的时间。

* 给出合理预算。这不是网站,其成本会更多。

* 确保内部具有合适人才。若这些问题在那些经验丰富的专家看来都非常棘手,那么团队成员定也会感到非常头疼。

*不存在 “标准开发工具”。通常你需要创建自己的工具。

* 考虑所有选择。手机领域没有对错。秉承心虚态度,着眼用户需求。

Anatomy HTML5 from readwriteweb.com

Anatomy HTML5 from readwriteweb.com

第4点的工具内容最为重要,因为这是8月份以来变化最多的内容。除appMobi提供的工具外,框架和IDE供应商Sencha和Appcelerator也卷入HTML5游戏开发,让开发者基于系列标准开发应用。目前这些工具还不像某些原生Android和iOS开发者框架和工具那么强大或简单,但在未来1年里,它们还会继续发展。框架、IDE、模拟器、漏洞探测器及其他开发者依靠的基本功能将向HTML5开发领域开放,逐渐融入此生态系统。当开发者获得生存日益简单,他们就会更具创造性,就会有更多网页应用融入市场。

总结

HTML5的其他功能,如形式和新标准,依然将继续发展。很快,随着开发社区和W3C开始将技术标准化,HTML5就变成只是HTML。HTML5开发的主导者将会是Sencha、Adobe、Appcelerator和appMobi等公司,以及投身Facebook、Amazon和Google领域的巨头公司。

如今堪称是开发者的美好时光,无论你是投身于视频渲染新形式,如 Brightcove,还是试图探究HTML5的最佳音效运用方式(就像SoundCloud那般)。从桌面到手机网页,HTML5正逐步变成网页的真正杀手应用及创新中心。(本文为游戏邦/gamerboom.com编译,拒绝任何不保留版权的转载,如需转载请联系:游戏邦

Top 6 Trends In HTML5 In 2011

By Dan Rowinski

HTML5 is fundamentally changing the way developers approach the Web. Whether it is for desktop browsers or mobile, the language and standards of the future are not some distant point on the horizon. It is right now.

In the mobile realm, the debate rages on: Web or Native? The difference between the two is beginning to blur as HTML5 standards evolve. We examine what happened in HTML5 in this year in our third installment of 2011′s top trends. Check out the rest of the series, starting with John Paul Titlow’s music trends and Alicia Eler’s mobile commerce trends.

1. Mobile First

Yesterday, we named appMobi as our ReadWriteWeb Most Promising Company of 2012. As a startup, the company is doing interesting work on the fundamental goal of making HTML5 easy to use and ubiquitous with an emphasis on mobile first development. appMobi is carrying the torch for mobile first but it is a trend that is fast sweeping the development community as smartphones and tablet use explodes with data usage projected to increase by orders of magnitude in the next several years.

Fundamentally, the mobile first initiative revolves around the simple yet loaded questions of Webs apps versus Native apps.

This year we saw some large companies go to mobile first initiatives in regards to HTML5 design. The Financial Times pulled its native app iPad from the Apple App Store over its subscription and in-app revenue policies and has done very well with its Web app, designed with HTML5 with mobile devices in mind. Game developers, as discussed below, are leading the charge in creating dynamic mobile Web apps.

The trend of developing for the mobile Web first will continue into the new year with the explosion of smart devices coming to dominate computing, especially on the consumer/consumption side of the equation. To a certain extent, users do not really care what an app is written in, as long as it works like they expect it to. With some of the evolutions of HTML5 described below, the line of capabilities between Web apps and native apps is starting to blur.

2. Game Developers Take The Lead

We noted multiple times throughout the year that some of our favorite developers in the mobile realm were of the gaming variety. To a certain extent, game developers have the most to benefit from taking on HTML5 as a platform to avoid the 30% that Apple scrapes from paid games in the App Store and in-app purchases. Games are some of the hottest selling apps in all of mobile and a one reason that platforms like Android and Apple look so attractive to people looking to buy a smartphone or tablet. It is not just about reading email or making phone calls and texts. If that was so, Research In Motion would be doing a lot better with BlackBerry than it currently is.

A lot of game developers are being pushed along by the likes of Facebook and Zynga. The future of the Facebook app ecosystem is based on HTML5. Game developers, such as those working at MocoSpace or Moblyng are hard at work creating HTML5 versions of their publication library. As Stewart Putney, CEO of Moblyng, told me in August, “do you know how hard it is to make a Texas Hold’em game in HTML5?”

Games are not all about Web apps though. Through the magic of PhoneGap and HTML5 development through appMobi’s XDK, Web app mobile games can be wrapped for easy integration into the native app stores. The approach is very similar to what Facebook does with its own mobile app. Based of the Web and browser but wrapped for native functionality.

We wrote about how game developers have taken the mantel of pushing the bounds of technology from the porn industry and it is true. Porn, an industry that once was the bellwether for technological adoption, has now fallen behind the times. We expect this trend to continue in the next couple of years as HTML5 matures as a platform.

3. Responsive Design & Handling Screen Sizes

There are fundamental advancements that need to happen before HTML5 truly changes the way that development is handled across platforms. One big step was taken this year with the evolution of what is called “responsive design.” Essentially, responsive design will let content adapt to any screen size that it is on. The brightest example of responsive design this year was when the Boston Globe released BostonGlobe.com, its mobile-first Web application designed to work on any screen size, anywhere. We interviewed Filament Group, the developers behind the Globe’s responsive design, in September and learned that responsive design is not actually an easy to figure out. Some basic concepts had to be built from scratch, such as the notion of RespondJS that handles media queries. Learning what to do with photos and ads from third-party sources also proved to be problematic.

“I think some facets of this could have been done in the past. I mean, HTML5 has a lot more APIs available for targeting features. Like, being able to check for touch support is technically part of HTML5 even though it is not HTML5 markup,” Filament developer Mat Marquis said at the time. “So, that definitely allows us to do all of that conditional loading and such. In terms of the markup itself, we are doing a lot of HTML5 with additional semantic meaning, it could have been done in HTML4, just not meaningfully in terms of the markup.”

Dealing with responsive design has a lot to do with understanding how content is going to react to a particular screen size. ZURB, a Silicon Valley design company, is also working on responsive design implementations. Responsive design is based off the concept of “fluid” design and is complete shift in how content has been handled on websites and mobile devices for much of the last 16 years or so. It is still a work in progress but HTML5 is finally making it possible.

4. Device Access

One of the biggest barriers of erasing the line between Web apps and native apps is the ability for browser-based applications to have access to some of the most fundamental aspects of mobile devices, like the camera, contacts lists, calendar, accelerometer etc. This is another area where appMobi is a leader in the HTML5 space, especially after it open-sourced all of its APIs the day after Thanksgiving. Mozilla has also been working hard on creating device access through the Fennec mobile browser project.

To mobile developers, device access is the most exciting innovation within the HTML5 set. It means that true Web apps can come to mobile, without the need of doing any PhoneGap-style wrapping. Game developers will be pleased because aspects previously locked to them, such as the accelerometer or the phone’s read state, can be integrated into games. This opens a world of possibilities, such as better cloud integration (which can help with in-app purchases, push notifications etc.) and enhanced game play. Depending on the platform, apps are fundamentally built off Javascript, CSS3, HTML and other programming languages and given functionality through APIs, SDKs, cloud functionality and dozens of other moving parts. HTML5 did not allow for many of those functions but until recently. That is beginning to change and will be a development to watch in 2012.

5. Offline Caching

Hold, wait a minute here. You mean that my app can work even when I am not connected to the Internet? Well, I’ll be a goat in a canoe on the River Thames. The concept of offline caching is fairly new and still one of the trickier aspects of HTML5 development for Web apps to master. This year, the prime example of offline caching to be deployed on a grand scale is the Kindle Cloud Reader, a Web app from Amazon that is supposed to give the Kindle sync functionality through the browser and remember everything in in a users Kindle library. It works in Firefox 6+, Chrome 11+, Safari 5+ and iOS 4+. There is so much that can be done with offline caching but the prime benefits, combined with device access, are to make Web apps work when not actually connected to the Web. That possibility is what many pundits think will eventually be the doom of native apps because overall deployment of Web apps will be frictionless, of every platform and no platform.

Mozilla is also working on offline caching with Fennec. Actually, name any particular trend in HTML5 development, and Mozilla has a hand in there somewhere. Check out Mozilla’s mobile roadmap that we wrote about a few weeks ago to fully understand how the open-source organization plans on integrating HTML5 into its smart devices platform.

6. Maturation Of Developer Tools

In August we wrote that, “HTML5 Can Get the Job, But Can HTML5 Do the Job,” a riff on a Pinch/Zoom blog post on the anatomy of an HTML5 Web app. In that post, Brian Fling said this about developers planning on HTML5:

* Allow for time. Assume it will take far longer than any other project you’ve previously done.

* Budget appropriately. This is not a website, and it will cost you a lot more.

* Make sure you have the right talent in-house. If these problems are hard for the most seasoned experts in the world that do it every day, assume they will be hard for your team, too.

* The “tools” are non-existent. More often than not, you will have to build your own tools.

* Consider all your options. A dogmatic approach to technology is a surefire way to spend money unnecessarily. There are no right or wrong answers in mobile. Keep an open mind and focus on what your customers need.

The fourth bullet point on tools is perhaps the most pertinent of all because it is the aspect that has changed the most from August until now. In addition to the tools that appMobi provides, framework and IDE providers Sencha and Appcelerator have gotten into the HTML5 development game, providing new ways for developers to create apps with the set of standards. At this point those tools are not yet as power or simple as some of the native Android and iOS developer frameworks and tools but in the next 12 months they will continue to evolve. Frameworks, IDEs, emulators, bug detectors and other basic functions that developers have come to rely on will roll out for HTML5 development and become more ingrained into the ecosystem. When developer lives’ are easier, the more productive they can be and the more Web apps we will start seeing flood the market.

Conclusion

Other functions of HTML5, such as forms and new standards, continue to evolve. Fairly soon, HTML5 will probably be just HTML as the community and the W3C work to standardize the set. The leaders in HTML5 development will be companies like Sencha, Adobe, Appcelerator, appMobi along with the titans of the industry in Facebook, Amazon and Google.

It is an exciting time to be a developer whether you are working on new forms of video rendering such as Brightcove or trying to figure out the best implementations of HTML5 for audio the way SoundCloud is. From the desktop to the mobile Web, HTML5 is making the Web’s one true killer app, the browser, the centerpiece of innovation.(Source:readwriteweb


上一篇:

下一篇: