With over 50% of internet traffic coming from mobiles in 2019*, we know learners expect to be able to complete their online courses via mobile. Developing a single course that works across all devices might sound challenging, but here's some tips to make mobile-first content easily.
We now use our smartphones and tablets for pretty much all web-based services, and eLearning is no exception. Users expect that level of freedom to complete their courses as and when they can – regardless of whether they are in the office, sat at home, or in between meetings. Developing a single course that works across devices might sound complicated, but with the right authoring tool this is much easier than you might think.
The secret behind this is responsive course design. eLearning can be easily adjusted for multi-platform use, so long as your authoring tool incorporates it. When your content is opened across different devices, this will ensure it is automatically resized to fit the dimensions of the screen. Being coded into the design framework of the authoring tool, there’s no need for any additional programming skills or technical knowledge.
Look for an authoring tool which allows you to preview how the course looks on different devices with the click of a button. Within your tool, look for the screen display from within the browser to switch between desktop, tablet and mobile formats. It will readjust the layout for you, but you can amend any minor details like resizing a heading or realigning an image. It can really be as straightforward as that.
If you are building in a web browser, some authoring tools allow you to right click > Inspect and then explore how your content responds to different screen sizes.
It pays to plan ahead however as people interact with content on mobiles a little differently to the way they interact with the same content on desktop. If people are happy to interact with your course on a mobile, usually they will also be happy to interact with your content on a desktop too, but this is not necessarily true in reverse.
Consider a mobile-first approach to design because of this. For example, think about how the user navigates from page to page. Consider the small details such as choosing the right font, and minimising your use of images and graphics to only what is important. This will also positively impact factors like page loading times, particularly where on-the-go learners are not connected to Wi-Fi.
aim for bitesize
Lengthy modules and bulky content is not ideal for smartphone users, so try breaking it down into sub-sections. While this will have little impact on those working from a desktop, those on mobile will benefit from bite-sized learning and more frequent opportunities to save their progress. It helps to make courses that work for them – providing more consistent access and increased motivation.
Think about the end-to-end journey and foresee potential issues with compatibility. Interactivity and multimedia like video lectures and quizzes are easy to incorporate into responsive web design. Scenario-based study can be delivered on smaller screens if using a slide-based course structure, so long as there are clear navigation buttons rather than a need to click on objects within the slide. Small amendments like this can be all that is needed to make a course cross-compatible.
Ensuring multi-device usability does not restrict you to basic content. Apps like Duolingo or Memrise, for example, allow users to learn foreign languages through gamification. While these are based on more complicated algorithmic learning, it goes to show that mobile-friendly courses don’t have to be so different from their desktop counterparts. The computer-based versions of these apps do provide extra resources, but these are supplementary rather than essential. It’s a great example of mobile-first design.
Multi-device learning improves, motivates and empowers learners by giving them more control over how they work. There are a few additional factors to consider in course development but with substantial benefit to the end-user. Creating with responsive web design will remove the need for additional technical knowledge, so ensure this is a priority when choosing an authoring tool. Just remember that there can be restrictions on functionality, but not as much as you might think. Some forward planning will mitigate these concerns and keep you from running into design troubles down the line.