SHIFT's eLearning Blog

Our blog provides the best practices, tips, and inspiration for corporate training, instructional design, eLearning and mLearning.

To visit the Spanish blog, click here
    All Posts

    Top Developer Questions about HTML5 answered (Part II)

    Building apps in HTML5 is probably easier than using other development tools, but there's still many things you should learn. Continuing the interview, "Rambling on HTML5" with software developer and interactive media producer, Adrian Murillo, he discusses some important things you should know if you want to create solid HTML5 applications.

    html5 elearning

    1. What about apps? What if I want to publish my content to the Apple App Store, for example?

    You can create content with HTML5 and then delpoy it as an app. There are several frameworks that let you wrap your code, and generate a native application. Apache Cordova, also known as PhoneGap, and Appcelerator Titanium are two of the most relevant projects on that subject.

    Both let you integrate native device behavior into your HTML5 based applications, like interfacing with the camera, the address book, GPS, etc. You pack them up, and they are, for all practical purposes, just the same as a native app.


    2. Using these frameworks, is it also possible to build them as a Windows or OS X program?

    Yes, Appcelerator Titanium lets you do that. Apache Cordova does not, but you can still use it if you only want to target phones or tablets.

    That is not to say that you always need to use them to deploy your content. You can just as easily distribute your plain HTML5 files, and they will run on all platforms.

     

    3.  So, I then just create once, and my content will be visible just the same way on all these platforms, right?

    More or less so. One of HTML5’s main characteristics, is that it is an interpreted language. What that means is that it does not build your content; it depends on another piece of software to read the instructions it defines, and show it to the user. That piece of software is usually a web browser, like Firefox, Safari, Chrome, Opera or Internet Explorer. It takes all the elements described on the HTML files, and presents them to the user.

    The biggest consequence of this, is that your content may show up somewhat differently on each platform, and there’s not really anything you can do to avoid it. However, instead of fighting against it, you should go with it, embrace the differences, and develop with that in mind.

    It’ a fact of life; when working with HTML, the pixel-perfect design as you know it does not really exists. The inherent portability of HTML5 has that key side effect.

    Accordingly, when developing with HTML5 you should test in as many platforms as you can, to make sure you catch any exceptions that may arise. There are lots of tools to make this easy, and it will always be an inevitable step on your workflow.

    Also, as HTML5 is still a working draft, some web browsers may even lack some features, or may implement them in particular ways. This will become less important in the future, as the base becomes more stable, but is one very important thing you should keep in mind right now.

     

    4. Ok then, I just have to learn HTML5 to begin creating mobile ready, platform independent, content?

    Not quite. HTML5 is just one piece of the puzzle. You also need to learn CSS and Javascript.

     

    5.  What are those for? I thought HTML5 was all I needed.

    html5 and cssHTML5, or any HTML version for that matter, is used for defining structure. You specify semantics for your data elements, and group them in logical sets. You can define hierarchies, dependencies, etc. However, it does not really let you perform advanced graphical layout by itself, or implement run-time interactive elements. That’s what CSS and Javascript are for.

    CSS, and its latest iteration, CSS3, let you associate visual styles to your structural elements, and even change them over your application’s life cycle. You can animate, apply transitions and lots of other things, independently from your data.

    Javascript is the programming muscle. It lets you add interactivity, respond to your user actions, interface with other systems, and all sorts of things you expect from a full featured application.

    Without both these elements, HTML5 would just be a way to tag your content, pretty much like it was back in 1991. Using the three of them combined, you can overcome their limitations, complement them, and create rich content.

     

    6. Are there any real-world applications that can show me what HTML, CSS3 and Javascript can do?

    There are lots of real applications out there, ranging from proof-of-concept kind of things, to complete production level software. You may already be using some of them. For example, Google and GMail have versions based on HTML5. Also, there are some very nice games created with it, like Pirates Love DaisiesGoogle Pac-Man, and Cut the Rope, to name a few. You can just google it, and get score after score of application listings.

    You’ll see that this technology is already widely used, not only for games or productivity applications, but also for elearning content, online magazines and ebooks, and pretty much whatever you can imagine.

    Click me

    Karla Gutierrez
    Karla Gutierrez
    Karla is an Inbound Marketer @Aura Interactiva, the developers of SHIFT. ES:Karla is an Inbound Marketer @Aura Interactiva, the developers of SHIFT.

    Related Posts

    AI and the Future of Workplace Training: 2025’s Game-Changing Trends You Can’t Ignore

    The world of workplace learning is changing fast, and let me tell you, Artificial Intelligence (AI) is at the center of it all. By 2025, AI is set to completely transform how we handle training and development, making everything faster, smarter, and way more personalized. Here's the scoop: studies predict that the AI market in workplace learning will hit around $6 billion by 2025. That's huge!

    Tips & AI Tools to Make Complex Concepts Engaging in eLearning

    Have you ever tried to teach concepts in eLearning courses, only to notice your learners’ attention drifting away? One of the biggest challenges is transforming dense, theoretical content into a format that's not just a wall of text, which can quickly turn off learners. When concepts are delivered in long, unbroken paragraphs without visual aids or interactive elements, learners often struggle to maintain focus and interest. But there's hope! With some creative approaches, you can transform these dry theoretical concepts into engaging and meaningful learning experiences. This article will delve into several key strategies and show how integrating artificial intelligence can take your content from mundane to mind-blowing, making your eLearning courses not just informative but truly captivating.

    Revolutionize Your L&D Strategy: The Essential AI Checklist for 2025

    As we stare down the runway toward 2025, it's clear that AI isn't just knocking on the door of Learning & Development—it’s already inside, reshaping the landscape. But let's address the real question: Is your company merely experimenting with AI, or are you fully leveraging it to transform your eLearning strategy? The way you answer this could dramatically influence the success of your training programs.