File last modified on August 18, 2022

OpenType Fonts

If asked what type of fonts are best for ePubs the answer is OpenType because OpenType fonts have many advantages over previous font formats such as they contain more glyphs, support more languages (OpenType uses the Unicode standard for character encoding), and support rich typographic features such as small caps, old style figures, and ligatures — all in a single font.

If you need a font from UTC most OpenType fonts are stored under the OpenType directory. You can drag and drop a font on your Desktop but you will get an error if a font is dragged with My Fonts highlighted.

CSS

Any font added to the font directory should be referenced in the CSS, example:

css
1
@font-face {
2
font-family: 'Adobe Garamond Pro';
3
font-style: normal;
4
font-weight: normal;
5
src: url('../font/AGaramondPro-Regular.otf');
6
}

by default the format is not included and should be added, regex:

bash
1
## Find:
2
(?<=\.otf"\));$
3
4
## Replace:
5
format('opentype');

If a font comes in italic it should be coded with a font style of italic and oblique, example:

css
1
@font-face {
2
font-family: 'Adobe Garamond Pro';
3
font-style: italic;
4
font-weight: normal;
5
src: url('../font/AGaramondPro-Italic.otf') format('opentype');
6
}
7
@font-face {
8
font-family: 'Adobe Garamond Pro';
9
font-style: oblique;
10
font-weight: normal;
11
src: url('../font/AGaramondPro-Italic.otf') format('opentype');
12
}

OPF

All OpenType fonts have to be included in the OPF Manifest, example:

html
1
<item
2
id="AGaramondPro-Italic.otf"
3
href="font/AGaramondPro-Italic.otf"
4
media-type="application/vnd.ms-opentype"
5
/>
6
<item
7
id="AGaramondPro-Regular.otf"
8
href="font/AGaramondPro-Regular.otf"
9
media-type="application/vnd.ms-opentype"
10
/>

Order in which doesn't matter but order scripted from the app OPF Builder reads the font directory with a top down approach.

If a font has whitespace in the name it's likely the font wasn't from UTC. If this is the case the font should be pulled from UTC and the file replaced. By default OPF builder will pull any font located in the font directory even if the name has whitespace and if this is added when you go to validate it will fail validation.

ON THIS PAGE
Last build: Thursday, 08/18/2022, 01:01:08 AM