Convert Flash to HTML5 Content – Now is the Time to Modernise Your eLearning

Here we look at why now is the time to convert Flash to HTML5 content, and how it offers a great opportunity for L&D teams to modernise their elearning.

 
HTML5 for elearning development

 

Back in July 2017, Adobe announced its plans to cease all updates and support for Flash by the end of 2020, and the Google Chrome browser immediately started to try and wean its own users off it by disabling the Flash player by default.

However, as The Inquirer reported in September 2019, the Microsoft Edge web browser will also now cease support for Flash in 2020, making what was already seen as a dead system to many, even deader.

For any L&D departments still relying on the Edge browser as a way to continue using Flash for their elearning, this announcement could be a useful push to modernise their content and make it truly accessible across all browsers and devices.

This needn’t be scary though, and building your elearning content in HTML5 opens up many new possibilities to make your training more engaging, effective and trackable.

First of all though, let’s look at how we arrived at this necessary shift from Flash to HTML5 content…

 

How Apple Killed Flash

It was back in 2010 that Steve Jobs, CEO of Apple, began the slow death of Adobe Flash. The system did not work on the iPad or iPhone, and Apple were not going to budge in making it possible.

In a 1,700 word open letter titled “Thoughts on Flash”, Jobs listed many complaints about the Flash system, including “… the mobile era is about low power devices, touch interfaces and open web standards — all areas where Flash falls short.

He also criticised it for being “closed” due to its control of features and pricing, which many saw as being a hypocritical statement given that the same could be said of iTunes and the iStore.

However, the growth in popularity of Apple products like the iPad and iPhone put the brand in a virtually untouchable position, and while there was heated debate about the fairness and legitimacy of those criticisms, Flash was never going to survive.

Once the king of animation and multimedia on the web, Adobe Flash has subsequently seen a sharp decline in popularity over the last few years, and HTML5 has been one of those emerging as its successor. The official nail in the Flash coffin appeared in July 2017, when Adobe announced that it would be discontinued by the end of 2020.

Flash played a pivotal role in the development of the gaming industry and earlier days of YouTube, but don’t worry – the World Wide Web Consortium (W3C) hit the nail on the head with HTML5.

 

HTML5 – A World of Opportunities

No longer restricted to static pages and slow scripts, the newest version of HTML opened up a world of opportunities.

HTML5 is backed by the increased performance of web browsers (such as Google Chrome) and developers can take advantage of these capabilities to design web pages even more full-featured and dynamic that those created with Flash. Unlike Flash, HTML5 is an open standard and works straight out-of-the-box, without the need of additional downloads.

 

3-D Transformations

At Day One, we enjoy incorporating HTML5 into our elearning content development work and have been applying some of the latest capabilities. Using CSS3 – the language that dictates the appearance of a page – we can scale, rotate, and translate elements in all three dimensions. We combined these features with smooth CSS3-based animation to create a rich menu page that no longer really feels like a website.

However, things are never perfect. There have sometimes been problems with different browsers not supporting some of the fast development features of the CSS3 engine. Decisions still need to be made based on the device audience, and on trade-offs of style against cost.

ghd elearning menu

 

HTML5 Canvas

This is only the tip of the iceberg, as the ‘Canvas’ element can open up lots of new opportunities.

HTML5 Canvas was designed for graphical applications. A 3D graphics library, named WebGL, can be used with the Canvas element. This is very similar to the libraries used by major video games, which gives a hint of the power of it.

In fact, creating an interactive 3D world is possible – an impressive feat considering it would run in a browser!

HTML5 Canvas

We have used Canvas for a different purpose. As part of our internal workflow tools, we are able to ‘draw on’ or annotate screenshots within the browser. Using Canvas allows us to effectively create a drawing board over the screenshot. Once the user has finished drawing, we can get the current state of the canvas as an image ready to save.

 

A Future of Open Standards

New tools and functionalities appear all the time, so we look forward to the future of HTML5 and other open standards in giving us an ever-increasing array of capabilities and functionalities for elearning, games and engaging web content.

 

Need Help Converting Flash to HTML5?

If you want to get the ball rolling in converting Flash to HTML5 content for your elearning delivery, get in touch with us here at Day One for an informal discussion about your needs.