Interactive PDF is dead—here’s what you can create from InDesign that’s even better

Justin | design,extensions,HTML5,InDesign,interaction,publishing,Tutorials | Monday, March 26th, 2018

tombstone for interactive PDF says R.I.P.

It sounds like I’m exaggerating doesn’t it?

I’m not.

Almost none of the interactivity in an interactive PDF actually works, even in Adobe Acrobat and Adobe Reader.

What doesn’t work in a PDF

Here’s a list of things that you can create with InDesign that don’t work in a PDF:

  • Animation
  • Video*
  • Animated GIFs
  • Multi-State Objects
  • Embedded HTML content (like YouTube videos)
  • Button actions related to several of the above items
  • Scrollable Frames
  • Custom page transitions (like flipbook pages)

Flash Player SWF icon broken down the middle*Video was supported previously in Acrobat and Adobe Reader, but it was dependent on the Flash Player (which no longer comes bundled with the Adobe apps).

The introduction of smartphones and tablets—almost none of which now support Flash—and a slew of new PDF readers, essentially guarantee that interactive PDF features will not work when your clients view your PDFs.

To see the breakdown of an interactive PDF in action, and to get a sneak peek at the solutions that I describe below, you can watch the following video.

Here’s what you can switch to today that supports interactivity

HTML. It’s the language of the web page that you’re reading right now.

HTML has all of the same layout capabilities that PDF does and has a much greater interactive capacity.

Remember the list of interactivity from above?

  • Animation
  • Video
  • Animated GIFs
  • Multi-State Objects
  • Embedded HTML content (like YouTube videos)
  • Button actions related to several of the above items
  • Scrollable Frames
  • Custom page transitions (like flipbook pages)

HTML supports all of them (and more).

Don’t know how to (or don’t care to) write HTML? Not a problem.

InDesign can export it for you.

How to create interactive HTML from Adobe InDesign

InDesign logoI’ve detailed three ways to export HTML from InDesign (included in the video above as well).

  1. Fixed Layout (FXL) EPUB
  2. Publish Online
  3. in5 (InDesign to HTML5)

Each of these solutions is HTML at its core.

Creating the interactivity with InDesign

It’s rather straight-forward to create interactivity with InDesign.

The tools are visually-oriented and easy-to-use, so you don’t have to know any code.

  • Video and animated GIFs can simply be placed in InDesign using File > Place.
  • HTML embeds (like YouTube, Google Maps, Twitter feeds, etc) can be pasted onto the page or inserted via Object > Insert HTML.
  • Animation, Button actions, and Object States can be created with InDesign’s built-in panels.
  • Scrollable Frames are supported via the Universal Scrolling Frames panel.
free digital publishing course taught by the expertsFor step-by-step lessons on how to create interactivity with InDesign, check this free course on Becoming a Digital Publishing Master.

Any of the HTML options in this article will then export this InDesign-based interactivity, so let’s look at each of those options in more detail.

Creating a FXL EPUB

An EPUB is essentially a zipped-up folder of HTML that can read by an EPUB reader app (like Apple iBooks or Adobe Digital Reader).

It’s typically used for ebooks.

InDesign lets you export FXL EPUB via File > Export.

Pros of FXL EPUB

The EPUB is the only HTML option that produces a single distributable file (an .epub) that can be (fairly) easily read like a PDF.

This makes it easier to email your digital content and, in some cases, easier to sell your content in a marketplace (such as the iBooks Store).

Cons of FXL EPUB

EPUB readers are inconsistent in what they support.

iBooks, for example, has a habit of blocking outside content (or even inside content that appears to be outside content).

The reader app controls the page transitions and the overall experience.

Using Publish Online

Publish Online is a “technology preview” from Adobe. It’s been in “preview” mode since 2015, so the future of this option is unclear, but it is super easy to use.

The quick and simple nature makes Publish Online a great tool for client and internal review.

Pros of Publish Online

It’s push-button publishing. With a single step, your interactive document is sent to Adobe’s servers and you’re given a URL (web address) where your content can be viewed online.

Cons of Publish Online

Publish Online content only lives on Adobe’s servers. You cannot put it directly on your site (though you can embed it inside of a container).

Adobe can choose to remove or alter your content at any time.

cannot edit - pencil with red circle and slashSince you don’t have access to the files, you also cannot customize them in any way.

Similarly, you cannot repurpose the HTML or convert it to a mobile app (which you could easily do with the actual HTML files).

Your Publish Online link is essentially private unless you choose to share it (though you cannot password protect it), which means it’s also not exposed to search engines, so it won’t appear in a Google search, or improve the SEO (Search Engine Optimization) of your site like HTML hosted on your own site would.

Publish Online uses the same underlying FXL export, which means it has some of the same underlying bugs, like the Object State rollover bug shown in the video above.

Creating HTML that you own with in5

in5 (InDesign to HTML5) logoin5 (InDesign to HTML5) is a custom HTML export that I created.

Once installed, you can export from within InDesign using File > Export HTML5 with in5…

in5 exports HTML to your local computer, so you can do anything that you want with it.

Pros of in5

Unlike Publish Online, with in5, you own the files that you export. You can put them on your own web servers.

can edit - pencil with green checkmarkYou can also customize the files as much as you would like and you can create mobile apps from your in5 output.

in5 also offers a huge amount of flexibility with several push-button customizations like flipping pages for digital magazines, and additional interactive options like 3D Flip Cards.

You can test drive in5 for free.

Cons of in5

in5 is a commercial tool, so there is an additional cost to use it (in5 pricing page).

Unlike Publish Online, in5 doesn’t automatically upload your content to the web, so you’d have to take this step yourself.

Bonus option: hacking Adobe’s FXL export

If you like the free price tag of Publish Online, but want more freedom with the files, check out Keith Gilbert’s free script, which uses the underlying FXL export to save your files as local HTML. It’s not as fully-featured as in5, but very handy if your project has no budget.

Which digital publishing option is best for your project?

PDF is still a great format for static documents, but if you want interactivity take a long, hard look at the HTML options that I’ve outlined above.

cover for digital publishing guideIf you need more information about which digital publishing option best fits your project, check out the free Digital Publishing Technology Guide.

Get updates from Ajar Productions

Splittext id 400px

Sign up today and get the InDesign Split Text premium extension for free!

Unsubscribe at any time. Powered by ConvertKit

6 thoughts on “Interactive PDF is dead—here’s what you can create from InDesign that’s even better”

  1. judblakely says:

    Justin, in5 is a brilliant tool for getting the most out of any on-line publication. To me, in5 amounts to kind of a “magic Swiss Army knife” that is about as easy to grasp and apply as a magic Swiss Army knife can be. Your brief tutorials hit the necessary bull’s-eyes without fail and have zero fat. They are as enjoyable to watch as they are valuable in what they provide a viewer. Keep on keepin’ on.

    1. Justin says:

      Thanks, Jud! Really appreciated it. 🙂

  2. David Bell says:

    Very, very helpful…thank you.

    1. Justin says:

      Glad to hear it, David! 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *