How Does Adobe Captivate Facilitate the Development of HTML5 Friendly eLearning?

The Role of Adobe Captivate in Creating HTML5 Friendly eLearning

The downward spiral of Flash began with the advent of mobile devices, introduction of a number of new web browsers, and the rise of HTML’s popularity. ‘Flash’ was once Adobe’s Flagship product. But Adobe has gracefully faced the sudden changes and came up with updates and a new product portfolio that supports HTML5. No one expected that. Adobe quickly aligned to the sudden technological changes and completely updated its eLearning authoring tool ‘Captivate’ that helps develop HTML5 friendly eLearning.

So, here’s how Adobe for Captivate helps create HTML5 output online courses and also convert Flash courses to HTML5.

HTML5-Friendly Features of Captivate

1. Publish E-learning to HTML5 in Captivate

After completing your eLearning project or online course in Adobe Captivate, you can publish it to multiple formats in a simple way.

You can choose from the publish options in the Publish window. If you select the publish to HTML5 option, your learners can view the course on iPads and mobile devices. If you publish to both SWF and HTML5, learners will be able to view the course on desktops, iPads, and mobile devices.

2. Publish eLearning Project as Apps

Adobe Captivate 8.0.1 and above versions support publishing eLearning courses as mobile applications (Apps). This is possible with PhoneGap. You can publish eLearning courses to PhoneGap without using a separate App packager application. Publishing to Devices (app) menu item is integrated with Captivate.

3. HTML5 Tracker

This feature is very helpful in converting Flash-based courses to HTML5. Objects in eLearning courses that are not supported in the HTML5 output get listed in the HTML5 Tracker automatically. If you delete or modify such objects in the courses, the tracker also gets updated.

These area few objects and slides that may not be published to HTML5 output:

  • Text and SWF animations
  • Mouse click animations
  • Slide transitions
  • Slide background if an SWF file is used
  • Audio attached to invisible objects

One exception here is that FLV files created using On2VP6 codec are supported in HTML5 output.

Object effects: Unsupported effects are marked with an asterisk (*) in the object effects list. The effects marked with double asterisks (**) are rendered differently in HTML5 output compared to an SWF output.

4. Host & Access HTML5 Output on Web Servers for iPads/iPhones

Online courses developed with HTML5 output can be accessed on iPads/iPhones through web browsers. You have to upload the whole HTML5 output folder to a web server root folder and make the URL available to your learners. They can access the URL from their iPads/iPhones and view the course content that plays within the web browser.

Accessing HTML5 output from iPads/iPhones is supported only with iOS version 5 or later. The courses developed with HTML5 output are supported on the following browsers in Apple devices:

  • Internet Explorer 9 or later
  • Safari 5.1 or later
  • Google Chrome 17 or later

Tips to Create eLearning for iPads with Adobe Captivate

  • Use the recommended project resolutions (presets) for iPad to get better quality HTML5 output.
  • Avoid overlapping of audio in the eLearning project, if it’s to be used on iPads.
  • It’s better not to have too many overlapping media for videos that have to run on Apple devices.
  • Disable Scalable HTML Content in the Publish dialog box.

Hope the given features and tips help you use Adobe Captivate to create HTML5 output for your eLearning projects and convert Flash courses to HTML5. For more insights on Flash to HTML5 conversion and how authoring tools can help, check this eBook.