Designing mobile eLearning courses

Before embarking on creation of a mobile accessible course you will want to understand how the learner’s experience changes when they view your course through a mobile device. Mobile devices are typically used in a very distraction-filled environment. Learners may be on a bus, on a train, at the store, eating lunch, or at work. The mobile device screen is very small. This limits what the learner can see and can make it difficult to read a large amount of content, view graphics, or see moving graphics.

Course content behaves differently when the display window shrinks. Graphic artists and many course creators like to design eLearning courses so that all aspects of the visual layout are tightly controlled. They like to precisely specify the position of each character. This is called absolute positioning. Absolutely positioned pages work well for printed brochures, but don't work well for environments where the learners have different screen/display sizes. Because the designer has specified positioning for a specific screen size ahead of time, the browser cannot rearrange the content optimally for the end-learner's current screen size. Absolutely positioned content may require horizontal scrolling to read, or may simply be illegible because the font size is too large or too small. Along the same line of thought, many test questions are built with tools that only work on specific browsers. For example, tools assume that the learner uses only Internet Explorer 7 or later or has flash installed. Mobile devices (event those that use Microsoft Windows Mobile) use older, simpler browsers making many web pages and web forms unusable.

Additionally, in a mobile environment your content will be most effective if you only provide a small amount on each page. While learners can scroll horizontally on a mobile device, it may be difficult to follow the content if they have to scroll too much. The rule of thumb, is to provide about twice the amount of content that can be viewed on the screen: If an average mobile screen supports 300 characters, limit your pages to 600 characters. This leads to content that is short, quick, and fast. Mobile devices have different size and capability limitations. Some browsers will resize the fonts, some support zooming, some don’t respect style sheets, some have a portrait layout, etc. Avoid multiple columns, since they will require horizontal scrolling.

There are a few simple rules to follow when creating graphics for mobile devices. Avoid placing important text inside graphics. That is, it is possible to put text inside a graphic to serve as a label. The mobile browser may shrink graphics so that they fit on the small display size. Any text that is in the graphic will also be shrunk, potentially to a size that is illegible. On other devices, if the graphic is too large, the visitor will need to scroll horizontally and vertically to see it. This can become frustrating for your learner since horizontal scrolling is annoying and is not supported on all mobile devices. So, graphics should be designed for low resolution screens.

None of the currently available mobile devices support multimedia that is part of web pages. This means that content requiring plug-ins such as Flash, PDF, Java, and most movie formats do not work across the platforms. The movies that are becoming popular on iPod require a proprietary movie application, separate from the browser. This means that rich/multimedia should be avoided.

The overall layout/look-and-feel of your site can also be a challenge. If you plan to use the same content for the desktop and the mobile learners, one option is to have two different style sheets, with the appropriate one loading at run time. In a properly designed site, the style sheet specifies layout, positioning, font sizes/colors, backgrounds, borders, and many other display attributes. It is important to understand that style sheet support is not uniform across mobile devices. Because of the non-uniform support, you might consider creating two separate eLearning courses: one for PC access and one for mobile access. Some basic considerations when creating a template for mobile devices:
• Most branding can be done through font and background colors
• Use small or unobtrusive graphics and logos
• Avoid navigation bars that may take up a large percentage of the screen. If you want to include complex navigation, place these at the end of the page content so that learners have access first to the primary content.
• Avoid background graphics.
o The end learners ambient light will vary depending on whether they are indoors or outdoors.
o A background that causes low contrast difference between text and decoration may make content impossible to read.
• Pull-down menus don’t necessarily work on mobile devices (because of uneven JavaScript support), so consider using arrows to take learners through a tour of your course.
• Graphic navigation icons should be simple arrows or a descriptive word such as “next” or “back”.
• Navigation frames work well on some devices, but not others. It’s best to place them below or after the main content.

When you build your content using recommended web practices it will work effectively on all platforms. Content that follows W3C recommendations including HTML implementation, style sheets, and relative positioning is the most accessible from the largest number of platforms. If you are already using a tool, confirm that it works on all mobile devices. You may need to do your own testing since most vendors have focused on the desktop market.

Also consider the connection speed for your visitor’s device. Many mobile devices only have access to low bandwidth services. Your visitor might only have access to download speeds comparable to what most people had in the mid 1990's. Since access speeds vary tremendously, make sure your content can be downloaded quickly.

Tests can work over mobile devices, but they need to be implemented using standard HTML. A big caveat is your LMS. Most LMS’s do not work in a mobile environment since they created their environment in tools (AJEX and Rich Media) that do not work on mobile devices

My Interview on "Jim Blasingame"

What doesnt work

The need to download or install an application before accessing a course is one of the major reasons that learners abandon a course. In fact, when learners need to install a plug-in in order to view the content, they only do so 10% of the time. This means that the hurdle of installing a plug-in or media viewer is enough to prevent most learners from taking a course.

Most eLearning courses currently work well on a desktop computer with a moderate resolution screen, but work poorly on a mobile device. This is primarily because of design decisions course creators have taken when they built the course. Most course creators assume that learners have the same size/resolution display as what they have on their computer. They only test the course with their computer, at their preferred browser setting. For example most courses only work properly if the display device is at least 700 pixels wide. (Most mobile displays are less than 400 pixels wide). So, to read a line of text, the end-learner will need to scroll horizontally, something very difficult to do on mobile devices that don’t have a touch-sensitive screen. Another big reason courses are being designed in unfriendly manners is the rush to Rich Internet Applications. This just means content that requires plug-ins like Adobe Flash or Java in order to display. These applications provide pretty movies, visual stimulation, and responsive content, but add little content value. Currently, most mobile devices (including the iPhone) are unable to play rich media as part of web pages. This means that courses that require plug-ins are inaccessible to mobile consumers.

An even bigger problem exists with tests. Most test questions are built in tools that output flash, are browser specific, or use other rich media formats that are inaccessible to mobile devices The end result are test where a learner is unable to set the focus on an entry box, and typing doesn’t work. Tests are also being designed to use the latest instantaneous feedback mechanisms such as AJAX. These technologies are not yet supported on many mobile browsers. So, when a learner wishes to take a test when they are in a mobile environment they can not do so.

If you are building courses, you need to ask some fundamental questions:
- Why are you building these courses?
- Who is your learner?
If you want learners (employees, customers, prospective clients, and partners) to take your courses you will need to ensure that your course works in your learners’s environment. With maturity in cell-phone/mobile device technologies, your learners will be moving away from their desks, and will want to learn when they are mobile. This means that courses that have worked nicely until now will needs to be able to handle the changing learning environment.

Currently about 15% of the cell phones in the US have a web browser. Most people exchange their cell phone for the latest model every two years. This is why Internet accessible mobile device adoption is growing exponentially.

Your training strategy need to ensure that you are not repelling learners. If your courses do not work with mobile devices how many learners will you not be accessing in the future? If you require that they download and install an application or plug-in so that they can take a course, how many learners have you lost? The questions you need to ask to see if you should be looking at a mobile training strategy is:
· Are your learners sitting at a desk or are they out and about?
· Do your learners use cell phones or other mobile devices?
· What do they currently read on their mobile devices (nothing, short e-mails, long messages?)
· Do they currently use mobile devices to send e-mail?
· Does their mobile devices have a browser (is it a smartphone)?
· Do they have or are they looking at purchasing a mobile device with a browser?
· Would they want to access training when they are away from their desktop computers?
· Are your courses useful to a mobile audience?

If the answer to any of these questions is yes you should consider expanding your course options to support mobile devices.

It is acceptable that some of your courses are designed for desktop learners primarily. However, you should critically review your courses and decide which ones a mobile learner would be interested in accessing.

Courses that heavily use graphics, test questions that require a lot of typing, exercises and simulations that use multimedia generally do not work well on mobile devices because of small display sizes, small keyboards, and lack of processing power. The good news is that some minor modifications of the content can make the critical material accessible via mobile platforms. Typical information in courses can be delivered using HTML/XML (web page) format, without the need for multimedia. With a graphic design that allows the content to resize itself for the mobile device, the content becomes mobile-accessible.

Mobile Applications

Analysts, reporters, and computing futurists believe that mobile applications are the greatest path for growth in the computing industry. Their focus and enthusiasm centers on applications that can be installed natively on the mobile devices, rather than on the use of the mobile device as a communication gateway. For example, software that tells you how many of your “friends and acquaintances” are currently within 500 yards of where you are sitting, or can identify a song being played over a PA system. However, mobile devices can have a role that is much larger than they currently have as a platform for handy applications. Mobile devices can provide highly portable, low cost Internet access, thereby opening up huge new information consumer bases.

Many of the mobile applications being featured are productivity tools like scheduling or notification software or entertainment tools like music players and games. In order to run, these applications need to be purchased, downloaded, and installed on the mobile platform. Each mobile platform/operating system requires its own, natively compiled version of the application. The applications need to be redesigned and rebuilt for each target platform (e.g. iPhone, Blackberry, Windows Mobile, Android, etc.). While most of the focus on mobile computing has been on specific applications, the most obvious and potentially most important application has been forgotten: web access.

Most people who are currently using the Internet are accessing web sites. Web pages provide businesses, organizations, government, and individuals a portal to the world where they can provide information, sell products, and gather feedback. An organization’s web site is accessible to visitors through a web browser (e.g Firefox, Internet Explorer, Chrome, Safari), regardless of the operating system (MS-Windows, Mac, etc.) the visitor is using. This access to information is provided without purchasing, downloading, or installing anything - since most computers are delivered with a web browser already installed.