Digital Publishing

Technology Guide
by Keith Gilbert & Justin Putney
 CONTENTS

Seeking the Perfect Solution . . . . . . . . . . . . . . . . . . . 2

Assessing Your Needs . . . . . . . . . . . . . . . . . . . . . . . . . . 2

HTML, CSS, & JavaScript . . . . . . . . . . . . . . . . . . . . . . . 4

Mobile App. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6

Mobile Web App . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8

Reflowable EPUB. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10

Fixed Layout EPUB. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11

Publish Online. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12

PDF. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13

Which Technology Is Right for You?. . . . . . . . . . . . . 14

Conclusion. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16

Digital Publishing Technology Guide

If you are reading this, you probably want to publish your content digitally—to tablets,
phones, E-readers, and Web sites. But there are so many digital publishing solutions to
choose from, and the digital landscape is changing so rapidly. Where do you start? This
guide is here to help!

Rather than focusing on specific products, this guide will provide you with an overview
of the file formats and technology that products are built upon. That way you’ll have the
background, tools, and concepts to evaluate any available product or solution.

Let’s dive right in!

1.1 © copyright 2016 Ajar Productions page 1 of 16
SEEKING THE PERFECT SOLUTION

Here’s what we all want: a universal file format that can be output
from Adobe InDesign; is easy to learn, produce, and update; allows

Wanted
for rich interactivity and media; can be easily distributed a variety
of ways; will look great on any device with any size screen; contains
searchable and selectable text; and works great with social sharing.
And this is the short list!

The bad news: there is no magic file format that meets all these
requirements. At least not today. Compromise will be required.
This guide will help you find the best solution that meets as many
of your requirements as possible.

This guide assumes that you want to create your digital content
in Adobe InDesign, or easily repurpose InDesign print content
for digital use. Only digital publishing technologies that begin
with InDesign content authoring are covered in this guide.

ASSESSING YOUR NEEDS

Begin by assessing your needs. Who is your audience? On what type of devices are they
likely to want to access your content? How technically sophisticated are they? What is
your budget, both in terms of money and time?

Consider only what you need today. Technology is moving so quickly that its impossible
to predict which solution will fit your needs 3–5 years into the future. Consider this: the
iPad was first shipped in the spring of 2010. In the short time span since, tablets have
completely changed digital publishing requirements.

Looking back a bit further, the iPhone was released in the summer of 2007.
Prior to that, most of us didn’t have a clue what an “app” was. Now apps are
everywhere. Lately, as phone screens have
gotten larger, clearer, and brighter, more and
more people are consuming content on their
phones, leaving their tablets behind. No won-
der it’s hard to keep up!

Use the following list to assess

your needs. It may be help-
ful to rank the importance of
each of the criteria on a scale
of 1–10, attempting to sepa-
rate the “must-haves” from the
“nice-to-haves.”

1.1 © copyright 2016 Ajar Productions page 2 of 16
 Digital Publishing Requirements

__I need to create my content in Adobe __My content must look great on:
InDesign and output it with pixel perfect ☐☐ iPads ☐☐ Windows tablets
precision ☐☐ iPhones ☐☐ Windows computers
☐☐ Android tablets ☐☐ Macintosh computers
__The solution must be easy to learn
☐☐ Android phones ☐☐ E-readers

__I need to be able to produce output quickly

__My text must be selectable and searchable
and efficiently

__My content must be accessible by screen-

__I want to include rich interactivity and
reading devices for the visually impaired
media in my content

__My content must be exposed to search

__I need to distribute my content to readers
engines so that it is discoverable on the Web
via a Web site

__I must be able to update and add content

__I need to be able to send my content from
periodically
person to person as a file attachment

__Users must be able to download content for

__I need to be able to distribute my content
reading off-line
through app stores

__Content must be easy to share on social

__I need to be able to monetize my content,
sharing platforms such as Twitter and
and protect it from casual theft
Facebook

__The solution must include analytics about

how many people are accessing which
portions of content

Use this list to rank each of your requirements on a scale of 1–10.

Once you have some clarity on your requirements, you can begin evaluating technolo-
gies. We will compare and contrast seven digital publishing technologies. They are:

1. HTML, CSS & JavaScript

2. Mobile app
3. Mobile Web app
4. Reflowable EPUB
5. Fixed-Layout EPUB
6. Publish Online
7. PDF

Once you understand the strengths and weaknesses of these technologies, you can shop
for a product or solution built on that technology.

1.1 © copyright 2016 Ajar Productions page 3 of 16
HTML, CSS, & JAVASCRIPT

HyperText Markup Language (HTML), Cascading Style Sheets (CSS) and JavaScript are the
technologies that make every Web site work. The HTML language by itself contains only
very simple formatting instructions. But the addition of CSS makes it possible to include
rich formatting that nearly rivals print typography and layout in variety and precision.
Adding JavaScript into the mix allows for rich interactive experiences.

Once created, your HTML/CSS/JavaScript output can be put on a Web server and viewed
in a browser running on a phone, tablet, laptop, or desktop computer. HTML can even
be written in such a way that the layout changes depending on the size of the screen on
which the page is being viewed. This is called “responsive” or “adaptive” HTML. But, as
you can imagine, this type of HTML is more time consuming to create. Someone has to
decide what the layout should look like at the various screen sizes.

HTML, CSS, and JavaScript are foundational technologies that are used in one way or
another by all of the other digital publishing technologies described in this guide except
for PDF.

Briefly, here are three ways to create HTML output from InDesign layouts:

1. Copy and paste text and images from InDesign, recreating the layout and format-
in5 is an InDesign
ting in a code editor like Adobe Dreamweaver or a visual Web authoring tool like plug-in that exports
Adobe Muse. InDesign layouts to
HTML5. This HTML
content can then be used
2. Use InDesign’s Export command to export your layout to HTML. However, this is only
on a Web site, in a Web
effective for highly repetitive documents where strict layout rules are enforced and app, or in a mobile app.
paragraph and character styles are used fastidiously.

3. Use the InDesign plug-in in5 to export your layout to HTML. in5 does an excellent job
of translating the richness and complexity of an InDesign layout into corresponding
HTML, CSS, and JavaScript.

Besides posting your HTML output on a Web site, HTML

output can also be turned into a Web app, or “wrapped” in
an app package. See the mobile Web app and mobile app
sections of this guide for more information.

This is an example of how a

typical folder of HTML, CSS, and
JavaScript may be organized.

1.1 © copyright 2016 Ajar Productions page 4 of 16
 Top 3 Pros Top 3 Cons

Easy to create from InDesign with in5
Output viewable on any device with any size screen
(phones/tablets/laptops/desktops, iOS/Android/
Windows/Mac OS X)
Selectable, editable text that is accessible by screen
reader software
Difficult to create from InDesign without in5
No simple, standard way to distribute a “package” of
HTML/CSS/JavaScript as a file via email or other ad-
hoc methods
Difficult to monetize

Learn more…
• To learn more about HTML for digital publishing see 10 Reasons to Consider HTML for
Digital Publishing at bit.ly/29oBNzK.

• A good training resource for exporting HTML from InDesign is Michael Murphy’s ex-
cellent InDesign CS6 to HTML course at bit.ly/29s25BF. Still relevant for current
versions of InDesign.

1.1 © copyright 2016 Ajar Productions page 5 of 16
MOBILE APP

From the perspective of a user, the biggest advantage of a

mobile app is simplicity. Since the advent of smartphones,
almost everyone understands how to obtain and install
apps for their mobile devices. A mobile app “lives” on a
device’s home screen. But how are mobile apps created?

Highly-interactive mobile apps such as games, social media

apps, and photo editing apps are typically created by devel-
opers using a programming language such as Objective-C
or Java. However, there are various ways to create mobile
apps without writing any code that can display rich interac-
tive content created in InDesign.

One low-cost, fairly easy way is to create HTML content

(see HTML, CSS, & JavaScript above) and then package
the content into a mobile app using a service like Phone-
Gap Build (build.phonegap.com) or Baker Framework
(bakerframework.com).

Another way to produce content-rich mobile apps without coding is to use a solution such
as AEM Mobile (adobe.ly/1Zxmcyq), Twixl Publisher (bit.ly/2a3riDO), Aquafadas Combining in5 with
(www.aquafadas.com), or Mag+ Designd (www.magplus.com). These products each PhoneGap Build,
offer a complete ecosystem for building a mobile app, producing interactive content Baker Framework,
in InDesign, and distributing your content into the app. Services such as Liquid State Liquid State, or
(liquid-state.com) or Paperlit (paperlit.com) are similar, but work with content Paperlit is a powerful,
created from InDesign using in5, as well as PDF content. All of these solutions make low-cost way to
periodical content easy to distribute, “pushing” your periodical content into the app create content-rich
whenever you are ready to publish new content. mobile apps.

On iOS devices mobile apps can only be distributed two ways: through the Apple App
Store, or privately within a single company through “enterprise” distribution. If your
app and content are free, Apple will host it on the Apple App Store free of charge. If you
charge for your app or your content, Apple will retain a percentage. There is no way to
distribute an iOS app to the public outside of the Apple App Store. There is no way
to distribute an iOS
On Android devices, you can either distribute your app through Google Play, with a app to the public
similar financial arrangement to the Apple App Store, or by distributing it yourself and outside of the Apple
instructing users how to “sideload” the app directly on their mobile device, bypassing App Store.
Google Play.

1.1 © copyright 2016 Ajar Productions page 6 of 16
 Top 3 Pros Top 3 Cons

Brand experience (icon lives on home screen)
Easy to monetize in an app store
Good for periodicals (multi-issue publications)
Some app-building solutions are very expensive
On iOS, apps must be distributed through the Apple
App Store
Restricted to mobile devices only. iOS and Android
mobile apps can’t be installed on desktop or laptop
computers. (Some mobile app solutions such as AEM
Mobile and Twixl Publisher automatically create a
Web-based simulation of the app content.)

Learn more…
• How to create mobile apps with in5, PhoneGap Build, Baker Framework, and Liquid
State at bit.ly/29JzerV.

1.1 © copyright 2016 Ajar Productions page 7 of 16
MOBILE WEB APP

A mobile Web app is a Web site that contains some special code that prompts the user
to add the site as an icon to the home screen of their tablet or smartphone. This causes
the app to occupy some valuable screen real estate on the user’s device, hopefully re-
minding them to revisit the app again and again. Here is how a mobile Web app works:

1. Convert your InDesign layout to HTML using one of the methods described in the
HTML, CSS, & JavaScript section above.

2. Add special code to the HTML that causes

the mobile Web app behavior. (in5 has an
option that makes this one-click easy. Just
choose one of the “Web App” options in
the Output list.)

3. Put the HTML on a Web server and send the URL to your audience.

4. When a user visits the URL in a Web browser on

a smartphone or tablet, they receive a message
prompting them to add the page to their home
screen.

5. When they follow the prompt, an icon is added to their home screen. The ap-
pearance of the icon is specified in the HTML code, or if you’re using in5, the
in5 Advanced screen.

6. Now, when the user wishes to run the app, they just tap the
icon on their home screen.

With some additional HTML code, or using the in5 Advanced dialog box, mobile Web
app content can be set to “cache,” meaning that once the user has visited the page, the
content of the page will be viewable off-line in the future.

Since mobile Web apps are just a special bundle of HTML, CSS, and JavaScript, they have
the same “top 3” pros and cons as regular HTML, CSS, and JavaScript listed above. But,
they also have some unique pros and cons:

1.1 © copyright 2016 Ajar Productions page 8 of 16
 3 Additional Pros 3 Additional Cons

A branded experience that looks like a “real” mobile Unlike a true mobile app, mobile Web apps require a
app Web server
Easy installation of the app on devices, no App Store Limited support on older versions of the Android
required operating system
Off-line viewing of content is possible No Windows Mobile support

Learn more…
To learn more about mobile Web apps, check out the following articles: A Web app has many
of the advantages
• Create an iPad Web App, a Lynda.com course by Chris Converse at bit.ly/29mUbpX. of a “real” mobile
app without the
• Introducing the Web App, an article by Justin Putney at bit.ly/29q3hn3. complexities and
costs of app store
• Publishing to a Web App, lesson 15 from the Becoming a Digital Publishing Master with distribution.
in5 course at bit.ly/1TQHTGf.

1.1 © copyright 2016 Ajar Productions page 9 of 16
REFLOWABLE EPUB

EPUB is an open-standard file format for publishing, distributing, and reading con-
tent on e-readers such as Nook and Kobo devices, as well as e-reader apps on tablets,
smartphones, laptop, and desktop computers. The EPUB format is maintained by the
International Digital Publishing Forum (idpf.org). There are two types of EPUB files:
reflowable and fixed-layout (see next page).

Reflowable EPUB files dynamically reformat to fit the device on which they are being
viewed. The reader, not the designer, controls the typeface, type size, line spacing, and
margins. In-line graphics can be included, but options for embedding video and inter-
activity are very limited. For these reasons, reflowable EPUBs are typically used for
novels and other long, text intensive documents.

To create a reflowable EPUB in InDesign, choose File > Export, and select
EPUB (Reflowable) from the Format drop down list. Then, select a few
options in the Export Options dialog, click OK, and you’re done. That part
is easy. But in most cases a fair amount of document preparation needs
to happen first. In particular, paragraph and character styles need to be
applied consistently throughout the document, which may require some
learning and changes to workflow for some users.

Amazon Kindle e-readers use their own proprietary “mobi” and “kf8”
file formats. EPUB files cannot be read on Kindle e-readers. Thankfully,
once you’ve created a reflowable EPUB file, converting it to Amazon’s file
format is not too difficult.

EPUB files are generally distributed through online stores like iTunes or
Kobo. Typically, these stores will distribute free EPUB files at no charge,
but they take a cut of any EPUB files that you offer for sale.

EPUB files can also be distributed via your own Web site, email, or whatever distribution
method you choose. However, users may not know what to do with an EPUB file that
they obtain outside of a store. If they are on a laptop or desktop computer, they would
need to have e-reader software installed to read the EPUB file.

Top 3 Pros Top 3 Cons

Easily monetized Very little control over layout and appearance.

Complex layouts are impossible.
Easy to distribute Support for media and interactive content very limited
Low cost to create and distribute Creating a quality EPUB file that looks good on all
e-readers can be somewhat technical

Learn more…
• InDesign CC 2015: EPUB Fundamentals, a Lynda.com course by Anne-Marie Concepcion
at bit.ly/29IyWjL.

1.1 © copyright 2016 Ajar Productions page 10 of 16
FIXED LAYOUT EPUB

Fixed layout EPUB files, part of the EPUB 3.0 specification, are very easy
to create in the latest versions of Adobe InDesign. You simply choose
File > Export, and select EPUB (Fixed Layout) from the Format drop
down list. Then, select a few options in the Export Options dialog, click
OK, and you’re done. No special preparation of your file is necessary,
aside from the requirement that you use only fonts that are legal for
embedding in EPUB files.

The resulting EPUB file will look exactly like your InDesign layout. The
appearance will be preserved no matter what device is being used to
view the file. The layout will simply scale up and down to fit the screen
of the device.

Unfortunately, fixed-layout EPUB files created from InDesign can only

be read in the iBooks app for iPhone and iPad, the iBooks app for Mac
laptops and desktops, and the Kobo reader. Specifically, they aren’t
supported by any of the Kindle e-readers or tablets. Furthermore, con-
verting an InDesign-generated fixed layout EPUB file to the kf8 format
required by Amazon is very difficult.

Top 3 Pros Top 3 Cons

Very easy to create from InDesign
Good support for interactivity and media
Easy to distribute and monetize
Supported by a limited number of e-readers and
e-reading apps (primarily iBooks and Kobo at this
point)
Content doesn’t reflow to accommodate different
screen sizes.
No mechanism for periodical content or subscriptions

Learn more…
• Creating Fixed-Layout EPUBs with InDesign CC, a Lynda.com course by Anne-Marie
Concepcion at bit.ly/29N0Qxu.

1.1 © copyright 2016 Ajar Productions page 11 of 16
PUBLISH ONLINE

Publish Online, a relatively new feature added to InDesign CC v11.0, is an easy way to
publish pixel-perfect layouts to a Web site. Just click the Publish Online button at the
top right corner of the screen in InDesign, answer a few questions, and the layout is
uploaded to a Web site hosted by Adobe, and the URL is given to you.

You can then include this URL on your Web site, in an email, or whatever you want to do
with it to drive people to your content.

After clicking the Publish Online button, you Once the Publish Online upload is finished, you are given
can specify a Title, Description, and a few other a unique URL for the document.
publishing options.
There is no way to
To see what the Publish Online interface and user experience is like, see this example: monetize Publish
adobe.ly/29VCrFj. Online content, and
the content must be
Publish Online works really well. But the main drawback for many people is that the hosted on Adobe’s
content must be hosted on Adobe’s servers. You cannot download the code and put it Web servers.
on your own Web server. Nor can you customize the URL. It will begin with the domain
indd.adobe.com. There is no way to monetize the content, or protect it with a password.

Top 3 Pros Top 3 Cons

Free and easy to create from InDesign Content must be hosted on Adobe’s servers
Good support for interactivity and media Text is not selectable or searchable
Good social-sharing mechanism No way to monetize content

Learn more…
• A curated list of some examples created in InDesign and published with Publish On-
line at adobe.ly/29TE7Qf.

• Publish Online from InDesign, an Adobe.com tutorial at adobe.ly/29NcTuF.

• Publish Online with InDesign, a Lynda.com course by Diane Burns at bit.ly/2a3QNVE.

1.1 © copyright 2016 Ajar Productions page 12 of 16
PDF

The venerable Portable Document Format (PDF) still has a place in digital publishing.
A PDF is a single file that is easy to create and can be easily distributed in a number of
ways. Most people know what to do with a PDF when they encounter it.

But as mobile devices have proliferated, so too have the number of different PDF “reader”
apps. As a result, the on-screen fidelity of a PDF and support for interactive features isn’t
as robust as it once was. In fact interactivity, animation, and video in PDF is so poorly
supported in many mobile PDF reading apps, that unless you can dictate which PDF
reader app your audience uses, it is best to avoid including most interactivity, anima-
tion, and video in PDFs.

Top 3 Pros Top 3 Cons

Free and easy to create from InDesign Difficult to monetize; may require download to view
Can be shared via email or the Web Not responsive for different screen sizes
Selectable, editable text that can be made accessible A lot of interactive content doesn’t work on mobile
by screen reader software PDF readers

1.1 © copyright 2016 Ajar Productions page 13 of 16
WHICH TECHNOLOGY IS RIGHT FOR YOU?

Since any solution you choose will require some investment in time, learning, and money,
your inclination will be to invest in a solution and stick with it. However, be open to us-
ing multiple solutions. You may want to publish the same content using two or three
technologies so that you can reach the broadest possible audience. Or, you may need
to use one solution for one project, and another solution for a different project.

Here are some rankings of each of the technologies in four categories, from most to
least capable.

Control over appearance Device compatibility

1. Mobile app; Publish Online; Fixed-Layout EPUB (tie) 1. HTML, CSS, & JavaScript
2. PDF 2. Publish Online
3. HTML, CSS, & JavaScript; Mobile Web app (tie) 3. PDF
4. Reflowable EPUB 4. Reflowable EPUB
5. Mobile Web app
6. Mobile app
7. Fixed-Layout EPUB

Ease and cost of production Capacity for interactivity and media

1. PDF; Publish Online (tie) 1. HTML, CSS, & JavaScript; Mobile Web app (tie)
2. Fixed-Layout EPUB 2. Mobile App
3. Reflowable EPUB 3. Publish Online
4. HTML, CSS, & JavaScript 4. Fixed-Layout EPUB
5. Mobile Web app 5. PDF
6. Mobile App 6. Reflowable EPUB

The following table documents whether or not each technology meets each of the cri-
teria that you ranked earlier. Keep in mind that there are many exceptions, as well as
some gray areas, depending on which commercial solution is being used to implement
the technology.

1.1 © copyright 2016 Ajar Productions page 14 of 16
 Mobile Web app

Publish Online
Fixed Layout
& JavaScript

Reflowable
HTML, CSS,

Mobile app

EPUB

EPUB

PDF
Can be created in Adobe InDesign with pixel-
perfect precision ✓ ✓ ✓ ✓
Easy to learn
✓ ✓ ✓
Can be produced quickly and efficiently
✓ ✓ ✓ ✓ ✓ ✓
Allows for rich interactivity and media
✓ ✓ ✓ ✓ ✓
Can be distributed via a Web site
✓ ✓ ✓ ✓ ✓ ✓
Can be sent from person to person as a file
attachment ✓ ✓ ✓
Can be distributed through app stores
✓ ✓ ✓
Ability to monetize content, and protect it
from casual theft ✓ ✓ ✓
Supports content scaling to fit any size screen
while keeping pixel perfect layout intact ✓ ✓ ✓ ✓ ✓ ✓
Supports reflowing content to provide a better
reading experience on smaller screens ✓ ✓ ✓ ✓
Selectable and searchable text content
✓ ✓ ✓ ✓ ✓ ✓
Accessible by screen reading devices for the
visually impaired ✓ ✓ ✓ ✓ ✓ ✓
Content exposed to search engines so that
content is discoverable on the Web ✓ ✓
Ability to update and add “issues” of content
periodically ✓ ✓ ✓
Can be read off-line with no internet
connection required ✓ ✓ ✓ ✓
Is easy to share on social-sharing platforms
such as Twitter and Facebook ✓ ✓ ✓
Provides analytics about how many people
are accessing which portions of content ✓ ✓ ✓ ✓

1.1 © copyright 2016 Ajar Productions page 15 of 16
CONCLUSION

Certainly there is an awareness on the part of software creators, mobile device makers,
and others that content authors and publishers are seeking a universal solution that
just works everywhere. We aren’t there yet, so you need to find the best solution that
works for you and your content today. Keep in mind that you may need to employ more
than one solution in order to meet the needs of your audience.

As the creators of in5, we believe that in5 is the solution that meets the needs of
many content authors and publishers. in5 can be used to create content for Web
sites, Mobile apps, and mobile Web apps. We are continuing to develop and refine
in5 so that it meets the needs of more and more users. Please download a trial ver-
sion of in5 at bit.ly/13lOGiV and give it a try!

1.1 © copyright 2016 Ajar Productions page 16 of 16