Friday, February 24, 2012

Returns in EPUB

We have these crazy complicated tools that can do amazing things for us but they have gotten so complicated that it's sometimes hard to take advantage of even their most basic power. Case in point: returns.

So, here's the rule: At the end of a paragraph, use a single return. Then adjust the style for the paragraph so that it has the correct amount of spacing after it.

The most important advantage is that you gain flexibility. If you decide you want more or less space after each paragraph, all you have to do is adjust the style, not delete or add additional returns. And while a return will always give you a set amount of space, you may want to add half, twice, or three times that much space.

This is particularly important when exporting to EPUB. If you add extra space by adding returns in InDesign or Word, those returns will disappear in your ebook. This is because HTML (which EPUB is based on) treats white space in its own special way.

Let's look at an example. You're laying out The Legend of Sleepy Hollow, and you've decided to start your paragraphs flush left, without indents. Therefore, you want space between each paragraph so that readers can see where one paragraph starts and the next one begins.

You add two returns after each paragraph to add this space in InDesign (or Word).

extra returns

You export your book as usual, and notice that the code reflects the extra return:

extrareturn

But when you open your book in your ereader, the space disappears:

Returns not reflected in EPUB

What happened? White space in HTML is collapsed. Three spaces are converted to one. Two paragraph returns are converted to one. And an empty paragraph, like the one shown in the code, is simply ignored. You could hack the code to make the ereader pay attention, but a much more sane solution is to adjust the spacing around the paragraph.

There are two strategies. The first, which I highly recommend, is to return to InDesign, remove all the extra returns, and then specify a value for Space After in the Paragraph Styles Option box:

SpaceAfter

The amount you put in the Space After determines the amount of space that will be added to every paragraph marked with this style. Don't like it? Change it once in this box, and all your paragraphs will be updated at once.

SpaceAfter applied

When you re-export to EPUB, the Space After is properly applied to the CSS of the affected paragraph(s):

template.css

And we no longer have the extra paragraph in the HTML code:

spacing.html

But best of all, now we have space where we wanted it in the ebook on the ereader:

Space after in ereader

And the second solution? I didn't forget. If you've already got your InDesign or Word document set up, you could theoretically ignore the extra p elements that will be generated and just adjust your CSS by hand, by adding a margin-bottom value to the paragraphs in question. It's not the best solution, but sometimes, you've only got so many hours in the day and the OCD well in check :)

Finally, I don't know why they spelled tranquility with so many l's!

3 comments:

  1. You need to be telling people not to typeset blank spaces between grafs. Set them solid and indent any paragraph following another paragraph. No exceptions.

    This isn’t MS Word or some crap-ass blog on TypePad. These are books.

    ReplyDelete
  2. On the question of tranquillity: once upon a time, a man named Orm proposed a new spelling rule. Simple. After a "short sound" vowel, you always double the following consonant. After a "long" vowel, you use a single consonant. Thus, you would spell "serendipity" this way: serrenndippitty. Never any doubt how that vowel was to be pronounced. If you could remember what the vowel was by the time you had counted consonants. He wrote a great deal of paper to that effect, and his "dictionary " was called The Ormulum. Spelled, I assume, with two m's at the end. But it didn't catch on. Two many "minims" - short, single strokes in a word. Exactly the reason you couldn't count the "l"s up there.

    ReplyDelete
  3. Hi, since InDesign convert any values for "text-indent" and "margin" in pixels (in your example, from 5 mm to 14 px) what happens on the New iPad with Retina display?

    On the New iPad 14px is half the distance it was on the old iPads, so the distance between paragraphs is halved as well?

    ReplyDelete

More of my books