High Five for Hyphens

Image for High Five for Hyphens

iPad users can turn on hyphenation and full justification

Image for High Five for Hyphens

Text is justified but with hyphens

Image for High Five for Hyphens

Text is justified but with no hyphens

Image for High Five for Hyphens

Text is left aligned with no hyphens

When it comes to the display of text in your re-flowable eBook, you have a some choices about hyphens.

Some general points

Hyphens can be useful to break up long words across the line break. This is particularly appropriate if you want to justify your text, since the renderer will need to space words out, and this can lead to uncomfortable spacing! But you need to adhere to the following rules:

  1. Don't justify headings. This is because they may not span the line, and so you are going to get horrid space between the words.
  2. Don't hyphenate the headings
  3. Don't justify your verse
  4. Only hyphenate if you are justifying the text and the line width (measure) is relatively short.


How do we control hyphenation in InDesign?

This is all done through a setting for each paragraph style. You will see a check box under the Hypenation panel to turn on or off. You will notice a lot of other settings for hypenation, but none of these settings will have any relevance to the ePUB file ... ONLY the switch ON/OFF will do anything at all!

Of course, as I mentioned above, this relates to the decision to justify the text.

Then what happens in the ePUB?

Ok, so you turn off the hyphenation in InDesign and you then export to ePUB3.

In the CSS for each paragraph style you should then see:


This, of course is great for devices that support the ePUB3 format properly. The iPad will show no hyphens with this in the CSS.

However, Adobe Digital Editions does not appear to support -epub-hyphens:none, so if you want to turn off hyphens you need to edit the CSS to include the following:


You need this in the selector rule for each paragraph. If you wanted to turn off hyphens everywhere then put this in the body rule:

body {adobe-hyphenate: none;}

And then what about iBooks on the iPad?

iBooks is the APP that delivers the eBooks on the iPad (actually there are other readers). iBooks has some settings available that will effect hyphens and justification. The user of the iPad/iOS device can switch on hyphenation and justified text (see the images here).

Of course, we accept that the user of the tablet or iOS device can control their settings, the designer may prefer to have total control. If the eBook designer explicitely turns off or on hyphens or justification then these settings will be respected but only if fonts are embedded and turned on in the metadata for the ePUB3 eBook. If the user selects a different font then their hyphenation and justification settings will be respected; although this is only true for body text not for headings if they are tagged as h1 through to h6 in the HTML markup.

How to control hyphens then?

If your starting point is InDesign, then turn off hyphens for headings and make sure that the headings are not justified; use Centered or Left-aligned instead.

If you want your body text to be justified then turn on hypenation for that style in InDesign. iPad users can turn this off if they have selected an alternative font to the one you have embedded.


Edit: Thanks to the question from Carlos, I should clarify something:

If you turn off hyphenation for any style in InDesign, the resulting CSS for that element in the exported ePub3 will be:


If you have hypenation on for any style the resulting CSS rule for that element will be:


In both cases, the user will not* be able to change to their preference (through their iBooks setting panel).

So, if you want to give the user total control over their hyphenation settings, then remove the references to -epub-hyphens in the CSS altogether!

*But, if the user changes the font in the their iBooks app, then the hyphenation settings in the iBooks preferences panel will be respected, in any case.

**Edit again: It appears that in iBooks 3.02 for iOS7, the behavior has changed; hypenation settings are no longer respected when the font is changed from 'original'.

***Edit again: If you want hyphenation because you are wanting justified text then follow the suggestions above, BUT if you have a compound word like six-pack, then you don't want that to be broken at the hyphen. The solve this you need to wrap the word in a span tag and use a CSS rule to prevent the break thus:

<span style="white-space:nowrap;">six-pack</span>

There is a character entity for a non-breaking hyphen, but this does not get much support through eReader software.

Posted on 21 Mar around 12pm


Commenting is not available in this channel entry.