Doc-To-Help 2012 has a new Mobile Help output that is browser-based, and easy to create.

It uses two Web technologies — jQuery and jQuery Mobile — that make it browser- and device-independent, plus it is Section 508 compliant. Future blog posts will focus on those features, but today I want to talk about best practices for Mobile Help projects. Let’s talk structure today. In Part 2, we will discuss Mobile Tips and considerations.

Any existing Doc-To-Help project can be output as Mobile Help, just open your project and choose Select Target > Mobile Help and build it. Take a look and see what you think. Right out of the box, you will have usable Mobile Help output.

Selecting a Mobile Target

First I would like to point out that Help on mobile devices doesn’t have to be traditional Help (it absolutely can be, but it doesn’t have to be). It can be something completely different that can benefit people using mobile devices. Doc-To-Help includes 3 samples — one is a knowledgebase for a service team (“Brew Crew Answer Station”), one a tourism resource (“Pittsburgh Fun”), and one is Help for the fictional game named “Peeved Penguins.” These projects are a great starting point for trying out Doc-To-Help’s Mobile Help, and they may also inspire you to create something new and useful for your customers.

To open the Sample Projects, click File > Help > Getting Started Wizard and choose Open a Sample Project. Two samples use Word source files and one uses the built-in XHTML Editor, so you can try both options out.

Structuring your project while writing it

Now we can use the “Brew Crew Answer Station” sample to discuss structuring a Mobile project. This sample contains one document, and that document has a fairly traditional structure that works well in both online and print outputs. This structure will also work for Mobile Help.

Doc-To-Help creates Help topics based on Styles, and uses those styles to create the Table of Contents for the project. The “Brew Crew” sample uses only the Heading 1 and Heading 2 styles, so the “home page” of the Mobile version will display all the Heading 1 topics, then users will tap to view to the Heading 2 topics nested under them. You can add more heading levels (H3, H4) and make a deeper table of contents, but for Mobile Help, keeping the table of contents “shallow” can make it easier for customers to find information. It is also a good idea to keep the Headings short, so that users don’t need to “wipe” to read the TOC.

Here is the Table of Contents of the “Brew Crew” project in Doc-To-Help, along with the style used for each topic. It is a single Word file, with 9 Heading 1′s — and each Heading 1 has two or more Heading 2′s under it. Doc-To-Help creates  the TOC automatically for you, based on the Heading styles:

"Brew Crew" Table of Contents in Doc-To-Help

If you’d like to take a look at the document this TOC was generated from, click to open the Brew Crew Answer Station Word document. (Please note, the olive color text  in the document indicates that those items have been added to the index — that color will not appear in the final output.)

When you build the Mobile Help, it will look like this:

"Brew Crew" Table of Contents

The user can tap on the first item to read the introductory topic, and every other TOC option will display the Heading 2′s nested under it.

If you’d like, you can display the default topic for the project instead, just by selecting one check box in Doc-To-Help.*

Here is what the Mobile Help will look like on your device if you display the default topic as the “home page.” If you tap the Contents button on the top, the TOC will display. The “Related Topics” list at the end of the topic also lists the TOC entries, so your customers have another sensible navigation option.

"Brew Crew" with Help Topic Displayed

So with Doc-To-Help’s Mobile Help, you have two different display options. An additional feature: if you don’t create an index, the Index button will not appear at the top of the display automatically — only the  Contents and Search options will be displayed.

The “write topics first, create structure later” method

You don’t have to structure your project exactly as I described; you can create separate files for each topic, and arrange them later in the Doc-To-Help Contents Pane. The “Peeved Penguins” Sample project uses this method (the source documents for this project were written in the built-in XHTML editor, but you can do this with Word also). Here are the documents I created — each one contains 1 topic, each beginning with a Heading 1 style.

"Peeved Penguins" Documents

In the TOC, I created a “book” for each category, then dragged the appropriate Topics into each one. See below to view the resulting Table of Contents in Doc-To-Help and in Mobile Help. The “books” in the TOC do not contain any content, they are merely containers that organize your topics. Structuring your project in this way gives you the flexibility of working with individual topics, while still creating well organized and usable Mobile output.

"Peeved Penguins" TOC and Mobile Help

Now that you have some examples, you can see how easy it is to structure a project for Mobile Help. In Part 2 Mobile Tips and things to consider, we’ll discuss some other Mobile tips and tricks.

Have fun creating Mobile Help!

About that check box …

* I mentioned a check box earlier that will switch your Mobile Help “Home page” from a TOC to a topic. That check box is in the Theme Designer. Click on the Edit Theme button and in the General category, select the “Show Topic At Startup” check box.

"Show Topic" check box

Tags: , , , , ,