How Adobe Is Moving on From Flash to Embrace HTML5

How Adobe Is Moving on From Flash to Embrace HTML5

Steve Jobs' famous Thoughts on Flash article from April 2010 marked the beginning of the end for Adobe Flash's future on mobile. Jobs listed several reasons why iOS wouldn't support Flash. At the time, Mobile Flash was seen as a pretty hot technology and a great way to create cross-platform apps - if only Apple would just get with the times and approve it for the iPhone.

Not supporting Flash was a bold and controversial move. In short order, however, Apple's position pushed Web developers to start learning about HTML5. It also got Adobe to move beyond Flash and reinvent some of its core product offerings.

After Apple Rejected Flash, Adobe Had to Embrace Open Source

Adobe has a long history with open source - primarily in creating expensive commercial products that spur others to develop open-source alternatives. Photoshop inspired GIMP, Dreamweaver beget a passel of open-source WYSIWYG HTML editors, and Adobe's large commercial font library prompted many low-cost, free and open-source alternatives.

In some cases, Adobe spurred open-source standards by making the company's proprietary standards and products more compatible with such standards. For example, Adobe Illustrator supports SVG, and Flash's ActionScript language is a dialog of ECMAScript (aka JavaScript). Adobe also has a history of donating software to the open source community; its open-source websites on SourceForge and GitHub list more than 100 projects that Adobe has released, along with numerous projects to which Adobe still contributes.

For years, though, Adobe and Flash seemed to compete with the Open Web. Until recently, Adobe was clearly winning, too. The free (but not open source) Flash plugin is installed in nearly every desktop browser and was the de facto standard for Web video and multimedia. Adobe's goal was to make Flash just as ubiquitous on mobile devices. When Apple rejected Flash, quashing that dream, Adobe embraced HTML5 and the Open Web wholeheartedly.

[ Commentary: What Adobe's Decision to Kill Mobile Flash Means to You ]

Adobe's problem, however, was the lack of a good alternative to Flash. HTML5 was still in its infancy, and key features still weren't well-supported in any browser, especially mobile versions. Apple's creation and open sourcing of the WebKit browser engine moved the Open Web and HTML5 a giant leap forward - but there was (and still is) a long way to go before Web standards could compete with Flash in terms of functionality, ease of development and ubiquity.

In a perfect world, HTML5, CSS3 and JavaScript would be stable and fully baked the same way in every browser. But even HTML5 and WebKit lacked key functionality that Flash could provide. Compared to Flash, HTML5 had a few big shortfalls, including the following:

  • Lack of good development tools
  • Unfinished HTML5 and CSS3 standards not fully implemented anywhere
  • Inability of HTML5 and CSS3 to access device functionality directly
  • No way to distribute HTML5 apps in app stores

While the focus was on the death of mobile Flash, Adobe got busy pivoting to address the shortcomings of HTML5 and Web browsers in a mad dash to stay relevant in a mobile world. Adobe's efforts fall into three main categories: Web platform, open-source projects and Web tools. Let's take a closer look at each of these efforts.

Adobe's Web Platform Work

HTML5 and CSS3 promise plugin-free animation, video and typography. Many key standards remain incomplete, though, and none is widely implemented. Furthermore, good how-to documentation is hard to come by.

The Adobe-led Test the Web Forward aims to hurry HTML5 standardization by holding worldwide hackathons to recruit and train Web developers to create tests for HTML5 features. Through these events, hundreds of bugs have been found in the Web platform specifications and in browser implementations. Thanks to those efforts, we're a step closer to HTML5 actually and verifiably working the same way in every browser.

[ Feature: 8 Reasons to Gear Up For HTML5 Now ]

Adobe has been busy with proposing new specifications to fill holes in HTML5's layout and graphics capabilities as well. One such spec is Regions, now implemented in several browsers. Regions lets Web developers do something that seems basic to anyone who has used a desktop publishing tool, but that has never been possible in a browser: Link containers and flowing text between them.

Compositing and Blending Level 1, created by Adobe and recently made a W3C candidate recommendation, specifies how the colors of multiple stacked objects should be blended in browsers. Again, this is basic functionality of graphics tools but very advanced stuff in a browser.

Finally, Adobe is heavily involved not only in testing the Web but also in documenting it. The Web Platform Docs project aims to be the authoritative source for documentation of the Open Web. Along with Adobe, contributors include Apple, Facebook, Google, HP, Intel, Microsoft, Mozilla, Nokia and Opera.

Adobe's Open Source HTML5 Projects

The survival and growth of the Open Web and HTML5 on mobile devices depends not just on the creation of better standards but on their implementation as well. This is where the open source community comes into play. Adobe has a presence in several of the most important open source HTML5 mobile projects today.

[ Analysis: SAP Bets on HTML5, Open Source For Its Mobile App Platform ]

WebKit, the browser engine created and open sourced by Apple from the KHTML browser engine, sparked the HTML5 mobile revolution. Prior to WebKit, mobile Web browsers were severely limited in their capabilities to display standard Web pages. With WebKit, HTML5 support on mobile devices suddenly became first-class; today it even rivals desktop browsers.

Even with a first-class browser, HTML5 apps still suffer several disadvantages when compared to native ones - namely, the application programming interfaces (APIs) for interacting with the underlying hardware aren't fully implemented yet, and app stores still dominate app distribution. To address issues, Adobe bought Nitobi in 2011 and gave its product, Phonegap, to the Apache Foundation, where it became Apache Cordova.

Cordova bundles HTML5 code as a native app on multiple mobile platforms. Unlike apps created with Flash, hybrid apps created with Phonegap are routinely accepted into the Apple App Store as well as Google Play. Besides compatibility with the app stores, the biggest benefit of Cordova is that it allows developers to write standard HTML5 code and use it to access native device features previously off-limits to Web apps.

[ More: 6 Things You Need to Know About jQuery ]

There's also jQuery Mobile, a jQuery plugin for creating mobile Web apps that simulate native app user interfaces and that function well across most modern mobile platforms. In addition contributing to this open source project, Adobe has also built tools to work with jQuery Mobile in Dreamweaver.

Adobe's HTML5 Tools and Services

Flash Professional, a powerful and polished multimedia and application development environment, has been around for many years. Adobe continues to develop and improve Flash tools, recently adding HTML5 Canvas support.

However, Adobe has also created some cool tools to develop HTML5 content, including Edge Code and Edge Animate. These Edge tools adhere to Web standards such as JavaScript, run atop WebKit and employ Adobe's new open-source fonts: Source Sans Pro and Source Code Pro.

While not quite a Flash replacement, Edge Animate provides a WYSIWYG interface for creating HTML5 multimedia content. Edge also supports audio, video, responsive design, keyframe animation and more - all without plugins.

Edge Code, meanwhile, is built on Adobe's open-source code editor, Brackets. One of its most compelling features is Live Preview, which lets you view HTML, CSS and JavaScript rendered live in Google Chrome as you work.

Death of Adobe Flash May Be Best Thing to Happen to HTML5

While the Flash Player browser plugin is still installed in 99 percent of desktop browsers, it's effectively dead for mobile devices (and browsers). Adobe has been watching which way the wind is blowing and is betting its future on HTML5. In doing so, it's become one of the most active contributors to the Open Web.

Apple's rejection of Flash was the end of mobile Flash, but it's probably the best thing that could have happened for the future of HTML5. After the last splash screen and plugin update notification go away, moving the Open Web forward may be Adobe Flash's most lasting legacy.

Chris Minnick runs a Web design and development company and regularly teaches HTML5 classes for Ed2Go. Ed Tittel is a full-time freelance writer and consultant who specializes in Web markup languages, information security and Windows OSes. Together, Minnick and Tittel are the authors of the forthcoming book Beginning Programming with HTML5 and CSS3 For Dummiesas well as numerous other books.

Follow everything from on Twitter @CIOonline, Facebook, Google + and LinkedIn.

Read more about internet in CIO's Internet Drilldown.

Join the CIO Australia group on LinkedIn. The group is open to CIOs, IT Directors, COOs, CTOs and senior IT managers.

Join the newsletter!


Sign up to gain exclusive access to email subscriptions, event invitations, competitions, giveaways, and much more.

Membership is free, and your security and privacy remain protected. View our privacy policy before signing up.

Error: Please check your email address.

Tags open sourceinternetAppleadobeflashhtml5softwareTechnology TopicsTechnology Topics | InternetCSS3

More about Adobe SystemsApacheAppleFacebookGoogleHPIntelMicrosoftMozillaNokiaSAP AustraliaW3CWYSIWYG

Show Comments