If you plan to publish your e-learning courses to HTML5, there are some key things you need to know about how HTML5 works with web browsers. The purpose of a web browser is to read and render HTML code into the web pages we see. Popular browsers include Internet Explorer, Safari, Firefox, Google Chrome, and Opera. These browsers are all free and available for download; however, it’s important to know that not all browsers are compatible with every computer and mobile device.
Here are some things you need to know about the way HTML5 content is displayed in web browsers and how you can make sure you provide learners with the best possible experience viewing your HTML5 courses.
1. Various Web Browsers Display the Same HTML5 Content Differently
HTML5 is still a new and emerging standard. As a result, different web browsers have implemented the standard at different rates. There are significant differences in how well HTML5 code is rendered from one browser to the next. There are even differences between one version of a web browser to the next version of that same web browser.
This means your HTML5 content may look and function just fine for someone who’s using a PC running Google Chrome, for example, but not for someone accessing it through Internet Explorer on a Windows tablet.
2. Certain Web Browsers Display HTML5 Better Than Others
It’s important to know that not all browsers render HTML5 equally well. Some are much better at displaying HTML5 content than others. How do you find out how well a specific browser renders HTML5 content? On the website HTML5test.com you can rate the various browsers against HTML5 features. As of early 2014, Google Chrome consistently ranks the highest for HTML5 support, and Internet Explorer ranks the lowest.
Older versions of many browsers don’t fully support HTML5 (for example, Internet Explorer 8 doesn’t support it at all). As new versions of browsers are released, which can happen multiple times per year, HTML5 compatibility improves, so it’s possible that all browsers will be fully compatible in the future.
3. Optimize Your Course for the Browser Your Audience Primarily Uses
When developing e-learning, you should always optimize your screen resolution and file size to meet the technical requirements of the majority of your audience. The same rule applies when developing mobile learning using HTML5.
Don’t assume that learners keep their browsers up to date. Especially in corporate environments, browsers can often be years behind the latest release. Determine whether learners will access your course through desktop computers or mobile devices (each is compatible with a different browser). Investigate which browser learners will use to view your course, and optimize your e-learning for that browser.
If learners will access your HTML5 content from a variety of devices, you need to do cross-browser testing to make sure the output looks and behaves as intended across multiple browsers.
Remember to keep in mind these three critical things about HTML5 and web browsers: various browsers display content differently, some browsers display HTML5 content better than others, and you should optimize your content for the web browser that most of your learners will use.
Armed with this information, you can better optimize your projects for learners’ browsers.