Content that is published to a Web-based format using Lectora or Lectora Online can be accessed and viewed on most smartphones. These types of mobile devices provide a great means of accessing eLearning, especially just-in-time training. But, to ensure the content is usable on a variety of Smartphones, eLearning authors must design and create the content with the device in mind.

The following list of tips will help you design and create your Lectora or Lectora Online title for use on a Smartphone.

  • Size the width of your content pages to a width suitable for smartphones. Most smartphones have at least a 320-pixel-wide screen resolution, although some still use a 240-pixel-wide resolution. You can size your pages vertically as large as you want. Users will then only be required to scroll vertically to access content that is not initially visible on the screen.
     
  • Use background images to create the look and feel of your content. Because background images are tiled both horizontally and vertically, the appearance on devices of varying resolutions will seem consistent.
     
  • Stay away from Flash animations and video. The iPhone, for instance, does not support SWF or FLV files.
     
  • Screen real estate is precious and navigation components can take up a lot of real estate. Consider only placing your navigation on the first page of your title, and on the other pages, only include links back to the previous page the user may have visited. Show these links at both the top and bottom of the pages so they’re easily accessible to users.
     
  • Make user input as simple as possible. If you require user feedback, consider providing radio buttons or check boxes for users to select their responses, instead of having to type them into an entry field.
     
  • If you want to create a title that is typically accessed on a computer, but that should also be easily accessible on a mobile device, consider creating a single title that contains the content in a format suitable for a computer, and also the content in a format suitable for a mobile device. Place your mobile-device-specific pages in a separate chapter and design them appropriately. When the course is launched, you can use a script to detect if the content is being accessed from a mobile device, and if so, redirect users to the pages designed specifically for the mobile device. These scripts can be integrated using Lectora and Lectora Online’s External HTML object. To save time, you can find scripts in a variety of languages that can be used for these purposes at http://detectmobilebrowser.com.  
     
  • If you’re creating a title that should be viewable on an iPhone or iPod touch, add a Meta tag to the title level to ensure that the pages are sized to fit the device screen. Add an External HTML Object of type Meta tags to the title level (or the chapter level if your mobile-sized pages are contained in a separate chapter) and insert the following code: <meta width=device-width;"/>.  You can modify this Meta tag in a variety of ways to ensure your content is displayed as you desire. Access the Safari Reference Library for more information about configuring the viewport: http://developer.apple.com/safari/library/documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html

     
  • Lastly, and perhaps most importantly, test your content on a variety of mobile devices.

Lectora and Lectora Online both contain a variety of templates, categorized as iPhone templates, which are designed for a screen resolution width of 320 pixels. These already include the appropriate Meta tags and can be used as a starting point to create and design your Smartphone-friendly title content.

For more information about templates and publishing to the new Apple iPad with Lectora, click here.

Tanya Seidel
Tanya is the Vice President of Product Management and Training for Trivantis. Amongst her duties, Tanya works together with the Sales, Marketing and Development teams to ensure that Trivantis’ products and product information are meeting client needs. Prior to joining Trivantis, she worked as a Software Engineer at IBM in Boca Raton, FL. She was involved in the development of a records management solution and oversaw the solution’s certification by the US Department of Defense. Tanya has a Bachelor of Science in Mathematics and a Master of Science in Applied Mathematics from Florida Atlantic University.