I just returned from PePcon last week. In a previous post, I wrote Why I’m Excited About PePcon 2015, citing the intimacy of the conference and the ability to interact with speakers and attendees. Well, PePcon 2015 did not disappoint. I had many wonderful conversations with several fantastic people. The post for Why I’m Excited About PePcon 2016 writes itself: all the same reasons from 2015, plus it’s in sunny San Diego.
One of the many valuable conversations that I had was with Mira Rubin, an author and trainer who is pushing the bounds of animation and interactivity in ePubs. Mira was looking for a way to include outside HTML (like that produced from Captivate or Muse) inside of her published ePub that she was building in InDesign. Something about our conversation triggered an idea and I stayed up into the wee hours of the morning building a prototype that I then showed at the next night’s CreativeWow! (a session where developers show new and experimental projects they’re working on). I’ve recorded a video of that demo so that you can see it as well.
In the video, you’ll see that the prototype can import interactive HTML that works in an ePub.
One of the best things about exporting HTML5 from InDesign using in5 is that the output is infinitely extendable. Here’s a collection of free code snippets from the Answer Exchange that can be use to alter the functionality of your exported content:
Scale to Desktop Browser Window – in5 can automatically scale to a mobile device window using the viewport meta tag (which is configured by default), but desktop browsers don’t support the viewport meta tag. This solution provides a workaround for modern desktop browsers.
Allow Text Selection with Swipe Enabled – With the swipe enabled, the page is listening for swipe gestures, which prevents text selection. This bit of code lets these two bits of functionality live together by disabling the swipe on live text only.
The latest version of in5 includes some big updates that should make several tasks more accessible to designers. It’s been possible to add custom code to in5 output for quite some time, but if you’re not used to working with code, there’s definitely an intimidation factor. With version 2.4, we’ve made it easier than ever to incorporate Google Analytics and Social Sharing buttons in your HTML (or app), without having to copy and paste code!
One-Step Google Analytics Tracking
You can now add Google Analytics to your in5 project simply by copying and pasting your Google Analytics Tracking ID into the in5 dialog.
That’s it! No more setup required. No need to even look at the tracking code below the ID.
As soon as you post your HTML to a web server, Google Analytics will begin collecting data.
In addition to the basic tracking functionality, you can choose to monitor other events within the document:
Pages – lets you track which pages are viewed most and least often.
Button Clicks – lets you track how often buttons are clicked.
Audio and Video Playback – lets you see which media are being played in your document.
Social Sharing – lets you see how often your document is shared using the Social Sharing Buttons (more info below).