Transitioning to HTML5 for the iPad
As I’ve written before in my blog post “The Reports of Flash’s Death Are Slightly Exaggerated,” the decision to move away from Flash in favor of HTML5 is complex. Web Courseworks recently had to address the issue for a project for a regional electrical utility company. The project was originally developed over ten years ago for CD-ROM to educate middle school and high school students on renewable energy, but the company wanted to update the content and make it available on all web accessible devices.
In response to the company’s request to maintain a high level of graphical quality and interactivity on devices like the iPad, Web Courseworks was not able to rely solely on the traditional method of using Flash to create educational interactivities because of technology issues noted by Apple. In this instance, HTML5 became the development method of choice.
At Web Courseworks, we view the HTML5 standard as an opportunity to build our portfolio using a standard that continues to improve the tried-and-true HTML. Since completing the project, we sat down with Asia Comeau, Lead Developer at Web Courseworks, to get her take on the Flash vs. HTML5 debate.
What do you see as the advantages and disadvantages of HTML5 over a plugin like Flash?
An advantage of HTML5 is that it is not an all or nothing situation. Using feature detection, we can create one template that serves the advanced HTML5 features to modern browsers and Flash-based media to older browsers. You can view it on an old browser and still get a similar experience as someone viewing it from a new browser.
HTML5 introduces the audio and video tags which allow us to include media that previously required a plugin such as Flash. However, if you want to create really rich audio experience using HTML5 audio, such as within a game, sound capabilities have not matured to the level of Flash or other game development environments. Also, Apple does not allow you to autoplay sounds on the iPad, so that is somewhat limiting. The supposed rationale is to limit data consumption. However, some have argued that it is an attempt to protect the App Store, which does allow for that capability.
With the recent explosion of device development, people can be viewing eLearning content on so many different devices; compatibility issues definitely come up. When we start any project, we ask the client to list their typical user’s environments so we can narrow the scope of development. There are now so many ways to access the web – tablets, mobile phones, desktop, game consoles, and all the different browsers – each environment we don’t support reduces development and testing time. What often hinders development in a project is not HTML’s technical limitations; it is budget considerations. For some clients, if the final product is accessible to 95% of devices, that’s plenty based on their need for accessibility.
HTML has the upper hand compared to Flash with regards to search optimization and accessibility. Content can be structured in a way that search engines and screen readers can easily interpret. There are methods you can use to improve SEO and accessibility in Flash programs, but it is not an innate capability like it is in HTML.
As a developer, what is most difficult about transition from development from Flash to HTML5?
Implementing the interface layout takes longer. With Flash, wherever you place an element is where it’s going to show up in every browser. With CSS, you need to test in every supported environment and the most basic layouts can show up differently from one browser to another.
One of the reasons that we’ve been staying with Flash for highly interactive games and simulations is that the HTML5 alternative, canvas, is not universally supported and it’s a challenge wherever frames per second matters. There’s only so much optimization you can do; at some point the browser will limit the performance.
If you are working on an HTML5, non-Flash project you have to include double the audio and video files because some browsers only play one codec or the other. It is not a technical limitation; it’s a licensing and money issue.
What steps should an eLearning manager take to address the HTML5 issue?
I see an eLearning Manager’s role as monitoring web development trends, keeping tabs on competitors’ development practices and allotting time for staff to do research in their fields of expertise to stay on pace with other developers.
What do you see happening with Flash and HTML5 in the future?
It would be ideal to have consistent browser support where everyone can easily develop programs that work on everyone’s machines. That would be ideal. There are many moving parts in web development. I look forward to seeing what will happen.
Managing eLearning is written by the Blog team at Web Courseworks which includes Jon Aleckson, Karissa Schuchardt and Adelaide Blanchard. Ideas and concepts are originated and final copy reviewed by Jon Aleckson.