It’s well-known that Adobe InDesign is a powerful layout tool.
It’s slightly less well-known that InDesign is loaded with interactive capabilities (buttons, object states, animation, audio, video, etc).
These interactive capabilities were partially supported by interactive PDFs…until mobile devices came around.
These devices used all different kinds of PDF reader applications, and none supported the Flash-based interactivity inside the PDFs.
Now even the desktop version of Adobe Reader doesn’t automatically come with the Flash Player installed.
So how can a designer make use of all the interactive tools?
HTML can support the interactivity that PDF does not, and it can be viewed on mobile devices.
InDesign has a “technology preview” called Publish Online that publishes a document as HTML onto Adobe’s servers.
This is an amazingly fast way to get your document online and viewable.
However, the content is only hosted on Adobe servers and cannot be saved, moved, or modified.
What if I want to customize my output? Or host it on my own site? Or make it viewable to search engines? Or create an app?
If you want the files to be your own and to host them on your own servers, etc…you’re in luck, but you’ll need to use a tool other than Publish Online.
Keith Gilbert’s free script
Keith Gilbert discovered a hidden scripting object that let him make use of InDesign’s Publish Online export (essentially the same as the Fixed-Layout ePub export) and save the files locally.
The script is awesome and free, but limited in certain ways (e.g., you have to take some extra steps to create working page navigation, but Keith created a script to help with that as well).
in5 is fully-featured, supports all of InDesign’s interactivity, and lets you add new kinds of interactivity.
It’s easy to customize, built to host on your own site, has easy search engine optimization features, and the output can easily be converted into a mobile app.
in5 (InDesign to HTML5) is incredibly flexible. It’s easy to attach custom functionality to your output.
I’ve shared several customizations on this blog and on the Answer Exchange.
The most popular customization by far is the “desktop scaling” code that scales layouts proportionally to the browser window.
In fact, when most people ask me about a “responsive” layout, they actually want to maintain their layout and simply scale it proportionally (a truly responsive layout changes at different sizes—I’m working on that, too).
To make it even easier for you to create flexible layouts (on both desktop and mobile), I’ve folded this scaling feature into in5 and refined it further.
Check out the video below to see it in action.
(It even works with the new page flip transition!)