How-to guides page navigation
transcript-content-from-adobe-indesign-to-epub

From Adobe InDesign to EPUB

[Narrator:] Adobe InDesign is a desktop publishing software developed by Adobe Inc. The software can be used for print or digital publishing to create documents such as posters, brochures, magazines, newspapers, books, e-books and interactive PDFs. Its primary target groups are graphic designers and desktop publishers. InDesign is a commercial product, available on a subscription as a single program or as part of Adobe’s Creative Cloud suite.

InDesign has native support for creating e-books based on the EPUB format. Please note that this is not an InDesign course. We assume that you already have basic knowledge of how to use InDesign. This course focuses on how to improve the accessibility of your e-books. We will not explain how to lay out, design or print documents. This chapter is similar to the one about creating accessible PDFs with Adobe InDesign. If you have watched that chapter, you will notice some repetition here. If you are only interested in creating accessible e-books with Adobe InDesign, then this lesson is for you and there is no need to watch the chapter about PDFs.

Let’s see how we can create accessible e-books with Adobe InDesign. Before we start using InDesign itself, we need to think for a moment about the images that we want to include in our InDesign documents. Images in accessible e-books require alternative texts. Alternative text can be stored in the form of metadata inside the image file, as part of the image. This means that we can reuse this description in many other documents without having to retype the alternative text. When we copy an image, its alternative description will be copied as part of the image file as well. So let’s see how we can add alternative text to an image file.

There are many programs on the market that can modify the metadata of image files. For our example, we will use Adobe Bridge as it is included in Adobe’s Creative Cloud suite. After starting Bridge, the program opens a file browser for us. We can use the file browser to select the file that we want to add alternative text to. The program will now open a preview of the image.

On the right-hand side, we see the metadata of the file. Some metadata attribute values cannot be changed without modifying the image such as file format, creation date or resolution. Other metadata add additional information to the file without modifying the image itself. Bridge indicates editable metadata attribute fields with a little pen to the right of the field.

Metadata attributes are grouped into different sets, such as File Properties, International Press Telecommunications Council (or IPTC) Core, IPTC Extension and Camera EXIF data. Each of these sets is defined by different standards or media types. We will take a closer look at the IPTC Core attributes in order to edit the headline, description or title. InDesign will be able to access any of these attribute values and add their content as alternative text. For our purpose, it is sufficient to add a description to the image. We type “Alice, the rabbit and the mad hatter at the tea party”. To apply and save our modifications we click the little tick in the lower right-hand corner of the Metadata pane. From now on the alternative text will stay with the image file whenever we move or copy it.

Pros and cons of metadata in images

Let’s summarise the pros and cons of having the alternative text as part of the metadata. The pros are that the alternative text becomes part of your image file. Whenever the file is copied or moved, the metadata stays with it. The alternative text can be reused in multiple documents. All text descriptions in the metadata can be used to search for an image, which can be extremely useful when handling a large number of images. When the alternative text in the image is updated, the update is automatically applied to all relevant documents.

The con, or limitation at least, is that metadata are limited to a single language.

Text styles

It is time to start InDesign and open our example document We can see that this document contains information such as headings, which present the structure of our document. The text uses links, which can guide the user to a website. We can see images, which need alternative text. Furthermore, we can see a list and a table. Beyond this, there is a complementary block of information, which offers more information about the author of the document.

First, we bring structure to our document using the headings. We open the Paragraph Styles panel via Window, Styles, Paragraph Styles. All text is associated with a style. This is the first heading and therefore obviously a level 1 heading. For a new document, we have the Basic Paragraph style. For our heading, we create a new style and name it “Heading Level 1”. As we know that this text style should be exported as a level 1 heading, we can immediately define this using the Export Tagging options. Under EPUB and HTML, Tag, we assign the H1 tag for a level 1 heading. Please note that even though we named our style “Heading Level 1”, we could have chosen any other name too. Also, it is important to assign a heading level style to a tag of the correct level.

This looks like a level 2 heading, so we create a style named “Heading Level 2”. This looks like another level 2 heading, so we can apply the newly created style here too. We assume that these are level 3 headings. Each heading is marked with its own style, which is named in such a way that we can identify its level.

Please note that you can use multiple styles for the same heading level. Here we want a level 1 heading, but with a different appearance from the style we named “Heading Level 1”, so we name it “Heading Author”.

If you have an existing document, there is no need to open each paragraph style and assign the HTML tags individually. You might prefer to edit all export tags at once. To do this, go to the Paragraph Styles panel and select Edit All Export Tags. Activate the EPUB and HTML options. Now you can see all your styles and their tag assignments. If you want to modify a tag assignment, use the pop-up to select the appropriate tag value.

Lists

You can easily create lists in InDesign. Select the text you want to convert to a list and select Type, Bulleted and Numbered Lists, Apply Bullets. Of course, you can also create a Numbered list. Lists can be identified by a screen reader and presented as such to the user if the e-book reader software supports it. Feel free to nest numbered lists of different levels. Unfortunately, bulleted lists cannot be nested in InDesign.

Tables

In InDesign, you can easily create and modify tables. The first row of our example table is its header, which describes the type of content in all the data cells below. Table headers can be recognised by screen readers and presented as such to the user if the e-book reader software supports it.

There are two options for defining table headers. For the first option, select Table, Convert Rows, To Header. The alternative is to select Table, Table Options, Headers and Footers. Here you will find many options to modify your table’s layout and styles.

One important point to note about tables: Tables should be used for table-based data only. You should never use them for layout purposes. For example, some people misuse tables to create a multi-column text layout, which should never be done. The text in an e-book should always be presented as reflowable. If readers want to read the text using a multi-column layout, then they can configure this in their e-book reader settings.

Table of contents

To create a table of contents, select Layout. The modal dialogue box opens. We give our table of contents a name and select a predefined style to define its visual appearance.

Now add the heading styles, which should be used for creating the table of contents in the correct order. Typically the lines in the table of contents do not use the same styles as the originating headings. We select the new styles here. We can define the hierarchy of our table of contents step by step by selecting the different heading levels in the correct order.

It is important to save the settings for this table of contents as a style. We click the Save Style button and give the style a name. In our case, we will call it “Alice TOC Style”. We will refer to this style when we export our document to the EPUB file format.

For our example, we will position the frame of the table of contents inside the visible area of the page, but the table of contents doesn’t need to be made visible. You can choose to position it outside the visible area. In that case, a user would only be able to access it by using the e-book reader’s navigation functions. For our e-book, we prefer to have both navigation options.

Hyperlinks

This text looks like a weblink, which we need to turn into a clickable hyperlink for the user. We select the text and right-click on it to open the context-sensitive menu and select Hyperlinks, New Hyperlink. We enter the web address. Under the Accessibility tab, there is an option to add alternative text. Now confirm your selection with OK. Once the e-book is exported, this link will be clickable for the user.

Images

Here we see an image which needs alternative text so that a screen reader can describe the content of the image to a user with visual disabilities. Right-click to open the context-sensitive menu and select Object Export Options. Now select the Alt Text tab. From the Alt Text Source pop-up, select the source of the alternative text. Before we have seen how to add metadata to an image, including the title, description and headline. We can now select which of these attribute values we would like to use as the source of the alternative text. If you do not want to use alternative text from the metadata of the image, just select Custom and type your text.

In the same dialogue box, there is an EPUB and HTML tab. You can assign the object to a specific epub:type element. For example, any footnotes could be declared as such, so that they can be detected by EPUB reader software. As this is highly technical and requires extensive knowledge about EPUB element types, we will not discuss this here and will use the default value.

If your object uses a graphic format that is compatible with EPUB, for example PNG or JPEG, then you do not need to change the appearance of the layout. If your object is not compatible, for example, if it uses a vector graphic, then it needs to be rasterised to be compatible with EPUB. The other options offer additional parameters to override the existing layout and text flow options during EPUB export.

We have added alternative text to our image, but when should the text be spoken? The image needs to be anchored in the text so that the screen reader knows when to read out the alternative text. To anchor an image to text, use the anchor icon on the image frame. Click and drag the anchor to the target position in the text. Once it’s in place, release the mouse button. The image is now anchored to that text. Make sure that its placement in the text is appropriate for its content. InDesign allows you to anchor an image anywhere in the text, even in the middle of a word.

Note that when the document is exported to EPUB, the image will be positioned after the paragraph that you anchored it to, so you cannot anchor an image to text on a different page. To see the position of the anchors, select View, Extras, Show Text Threads. The dashed line indicates the connection between the image and its position in the text.

Reading order

The document needs a reading sequence so that a screen reader can read out the different elements in the correct order. To define a reading sequence, open the Articles pane. Select Window, Articles. Now drag and drop the individual frames into the Articles pane in the sequence in which they should be read out. For our example, we decide that the text describing the author should be read out at the beginning of the document, so that it does not interrupt the flow of the novel.

Multilingual documents

Let’s talk about multilingual documents. Sometimes parts of your document may be in a different language, for example certain quotes. InDesign allows you to set the content language as part of the paragraph styles or of the character settings. We will show you how to set the language using the character settings.

First, check that the language of your default styles matches your primary language. Here we have an example document with three paragraphs in three different languages. InDesign allows you to set the language using the Character settings. Select Window, Type & Tables, Character. Now select the text for which you want to define the language. Select the corresponding language from the language pop-up menu. This will enable InDesign to embed the set languages as part of the EPUB. A screen reader will then be able to read each section of text using the correct voice and pronunciation.

Export

To save your file as an accessible e-book, select File, Export. The file selector dialogue box will open. Now type the file name and enter your destination. As the file format, choose EPUB (Reflowable). Do not choose EPUB (Fixed Layout) because your e-book would only work on devices using a specific screen resolution.

The program allows you to enter additional export options. Under General, select EPUB version 2 or 3, depending on your needs. For the cover, you can choose to rasterise the first page of the e-book to use as the cover. Another option is to choose an existing image. For our demo, however, we won’t create a cover.

For the sidebar navigation, we want a multilevel table of contents. Before we have already defined a style for the table of contents using the structure of our headings. We choose this style here, so all our previously defined settings are applied. If our document uses multiple text and graphic frames, we need to define the criteria for ordering their content. We want to use the sequence we created using the Articles pane.

There are many more parameters. As this course is too short to explain them all, please consult Adobe’s documentation for more information. Of course, feel free to experiment with them to see if they can enhance your e-book document. There are tabs to configure parameters for text, graphic and media objects, conversion settings related to the resolution and format of your images, code generation details, JavaScript coding and metadata.

If you are creating an e-book for distribution, you should add metadata to your product. You can add a unique identifier, the title, the author, the publication date, the description, the copyrights and a few keywords to your document.

Finally, you can configure which program to use to view your EPUB once it’s generated.

Where to continue?

This is the final chapter regarding EPUBs. You have been introduced to: the EPUB file format; the EPUB accessibility specification and how it relates to the Web Content Accessibility Guidelines; the validation and testing of an EPUB; and the creation of an accessible EPUB with Adobe InDesign.

Depending on your personal interests, you could continue with one of the following chapters:

  • Introduction to web standards
  • Apps

[Automated voice:] Accessibility. For more information visit: op.europa.eu/web/accessibility.

Close tab