Publishing to Mobile Devices: Best Practices and Strategies

Publishing toMobile Devices:

Best Practices and Strategies

Mike HamiltonV.P. Product EvangelismMadCap Softwaremhamilton@madcapsoftware.com

Agenda

•Types of Devices•Delivery Formats•Delivery Strategy

Type of Device

Type of Device

Smartphones

Tablets

Smartphones/Hand Helds

• Small form factor (7cm to 13cm)• Relatively low resolution

–320x480–480x360–400x800–640x960

• Low resolution pointing device (Touch)

Smartphones/Hand Helds

Primary Limitations:• Limited screen width

–Fine for text–Problematic for large, non-text content

• Touch interfaces–Elements must be sized to be compatible with human touch

Tablets• Medium form factor (17cm to 26cm)• Medium to high resolution

–800x600–1024x600–1024x768–1366x768–2048x1536

• Touch/Mouse interfaces

Tablets

Primary Limitations:• Multiple interface options• Touch interfaces

–Elements must be sized to be compatible withhuman touch

Tablets

Primary Limitations:• Multiple interface options• Touch interfaces

–Elements must be sized to be compatible withhuman touch

• Mouse interfaces–Can use standardelements

DeliveryFormats

Delivery Formats

•EPUB•HTML5 •WebHelp Mobile

• Designed for long, linear documents (novels)

• Requires a viewer

• Presents like a book, but reflows content like a web page

EPUB

Advantages • Comfortable book-like feel• “Off-line” format• Single file• Standards-

based

EPUB

Disadvantages • Requires an installed viewer• Difficulty with “overflow”• Inconsistent

viewers• No branding

EPUB

HTML5• Optimized for medium or large

format devices • Uses the on board

browser• Tested:

–Int. Explorer–Chrome–Firefox–Safari

HTML5

Advantages:• Cross-browser and cross-

platform• No frameset!• Can be

branded• Known

experience

HTML5

Disadvantages:• No Internet Explorer 6 or 7

support (use the older WebHelp)

WebHelp Mobile• Optimized for small format

devices • Uses the on board

browser• Tested:

–Android–Blackberry–iPhone–Windows Phone

WebHelp Mobile

Advantages:• One output supports

all devices• Can be branded• Always up to date• Handles “overflow”

content well

WebHelp Mobile

Disadvantages:• Requires a live

data connection• Can be quite

technical

Mike’s Mobile Support Strategy

Phones and Hand Helds

WebHelp Mobile• Use an appropriate navigation

strategy for the small screen• Customize your CSS• Use conditionals / meta-data

to remove any unnecessary content

Tablets

Modified WebHelp or HTML5• Customize your CSS using a

Mobile “medium”• Increase the size of navigation

items

Summary

• Determine what devices you need to support

• Select an appropriate format for each type of device

• Tailor content using templates, CSS, and meta-data

• Modify navigation elements for touch compatibility

Questions?Mike HamiltonV.P. Product EvangelismMadCap Softwaremhamilton@madcapsoftware.com