Jump to: Navigation.

Fraktur letterſpacing

On this page:

Fraktur Letterſpacing

In proper fraktur typography, the markup for emphatic text is not “italic” or “bold”, but “letterſpacing”.

There is a catch to fraktur letterſpacing: The fraktur ligatures ‹ch›, ‹ck›, ‹ſt›, ‹tz› are treated as ſingle letters with regard to letterſpacing. If you uſe letterſpacing on a word like “ſitzen” (‘to ſit’), for inſtance, then there muſt be no additional ſpacing between in the ‹ch› or the ‹tz›, as can be ſeen in the following image:

letterſpacing ſample: ſitzen

This image is really a ſcreenſhot from Firefox 16.0.1 on Mac OS X 3.5.8 – ſince the releaſe of Firefox 4.0, all Firefox builds are capable of correct fraktur letterſpacing. If you want to know whether your browſer is, compare the following text:

ſitzen – ſitzen

This text ſhould really look exactly like the above image (except for differences in font raſterization), ſince the image is a ſcreenſhot of that very text.

Fraktur letterſpacing and ſmart font technologies

There are four ligatures that do not get letterſpacing: ‹ch›, ‹ck›, ‹ſt›, ‹tz›. However, moſt fraktur fonts will uſe other ligatures as well, for inſtance ligatures for ‹ſi› or ‹fl›. Theſe other ligatures get letterſpacing juſt like normal ſequences of letters. This means that a fraktur font needs a way of diſtinguishing between two types of ligatures, the required ligatures that do not get letterſpacing and the other ligatures that do get letterſpacing. The different ſmart font technologies provides different means for doing ſo:

OpenType
In OpenType, the required ligatures that do not get letterſpacing have to be defined in the feature ccmp („Glyph Compoſition/Decompoſition“), while the other ligatures that do get letterſpacing have to be defined in the feature liga (“Standard Ligatures”). Both features ought to be activated by default in all ſcripts (ſee Features: Standard OpenType ſpecification). The ſpecification of the feature ccmp does not explicitly mention fraktur typography, but it perfectly matches its requirements: „[I]t may be preferable to compose two characters into a ſingle glyph for better glyph proceſſing“ (ſee ccmp in the OpenType Layout tag registry). The required ligatures behave like ſingle glyphs with regard to letterſpacing. That is why it is deſirable to compoſe them into a ſingle glyph before further glyph proceſſing adds letterſpacing.
AAT
In AAT, the required ligatures that do not get letterſpacing have the Setting Required Ligatures and the Settingcode 0, while the other ligatures that do get letterſpacing have the Setting Common Ligatures and the Settingcode 2.
Graphite
As far as I know, Graphite cannot diſtinguiſh between required ligatures and other ligatures.

Browſer teſt for different ſmart font technologies

Browſer teſt

OpenType
beſitze/Zeit‌zone – beſitze/Zeit‌zone
AAT
beſitze/Zeit‌zone – beſitze/Zeit‌zone
Graphite
beſitze/Zeit‌zone – beſitze/Zeit‌zone
Reference image
correct letterſpacing in Firefox: beſitze/Zeit‌zone

The browſer teſt ſhould look exactly like the reference image (except for differences in font raſterization), a ſcreenſhot from Firefox 16.0.1 on Mac OS X 3.5.8.

Explanation of the browſer teſt

In order to teſt what ſmart font technologies is diſplayed by which browſer, the browſer teſt uſes ſpecial builds of UniFraktur Maguntia that only uſe one ſmart font technology at a time, while the normal UniFraktur Maguntia releaſe combines them all.

The following features are teſted:

Support in miſcellaneous applications

As of 2012-10, ſupport for correct fraktur letterſpacing ſeems to be very poor. The following table gives ſome impreſſions. It does not claim to be a comprehenſive overview – and it is not even complete (pleaſe contact me if there are miſtakes or if you know other applications):

Windows Mac OS Linux
Firefox full
Internet Explorer poor [1] N/A
Opera poor [2] no
Safari partial [3] N/A
Google Chrome poor [4]
InDesign ? full N/A
QuarkXPress ? no N/A
Scribus ? no
TextEdit N/A partial [5] N/A
LibreOffice partial [5]
Gimp partial [5]
XeLaTeX full [6]

Notes:

  1. Internet Explorer 9 does not diſplay any ligatures until they are manually triggered by layout control characters (ZWNJ or ZWJ). Of courſe, this pretty much defies the very purpoſe ſmart ligatures. Ligatures may be called for by uſing a ZWJ.

  2. On Windows and Mac OS, Opera does not diſplay any ligatures until they are manually triggered by layout control characters (ZWNJ or ZWJ). Of courſe, this pretty much defies the very purpoſe ſmart ligatures. Ligatures may be called for by uſing a ZWJ.

    Additionally, Opera will diſplay the ligatures in any word that has a layout control character (ZWNJ or ZWJ). When letterſpacing is increaſed, all ligatures are retained. This cannot be fixed with a ZWNJ, becauſe a ZWNJ will cauſe double letterſpace.

  3. Safari does not diſplay any ligatures unleſs two requirements are met: (a) There muſt be an additional CSS definition; (b) there muſt be no intervening non-printing characters. Since theſe two requirements may be ſet globally, they allow for a workaround. However, even if both requirements are met, ligature diſplay in text with increaſed letterſpacing is ſtill not correct.

    1. Safari requires the following additional non-ſtandard CSS definition:

      text-rendering: optimizeLegibility;

      Since this definition is non-ſtandard, your CSS will fail to validate when you uſe it.

    2. Safari will fail to diſplay the ligatures if there are any non-printing characters ſuch as a ſoft hyphen or – ironcally! – a ZWJ.

  4. Google Chrome will not diſplay any ligatures until three requirements are met: (a) There muſt be – like in Safari – an additional CSS definition; (b) there muſt be – like in Safari – no intervening non-printable characters; and (c) the font muſt be locally inſtalled. Of courſe, this pretty much defies the very purpoſe of font embedding. On Windows and Linux, there is at leaſt one additional requirement, but I have not been able to pin it down.

  5. In TextEdit, LibreOffice and Gimp, ligatures are diſplayed, but when letterſpacing is increaſed, the required ligatures are not diſtinguiſhed from the other ligatures; inſtead, either kind of ligatures is retained. Additionally, the ZWNJ cauſes double letterſpace when letterſpacing is increaſed.

  6. For letterſpacing in XeLaTeX to work correctly, I uſe the packages fontspec and xspace to renew the command \emph ſo it produces text with increaſed letterſpacing:

    \usepackage{fontspec,xspace}
\renewcommand\emshape{\xspace\addfontfeature{LetterSpace=20.0,WordSpace=1.5,Ligatures={NoCommon}}}

Additional browſer teſts

Different font formats

WOFF
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone
TTF
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone
EOT
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone
SVG
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone

Reference image (ſcreenſhot from Firefox 3.6.12 on Mac OS X):

reference screenshot: beſchütze/Zeit‌zone

Different embedding codes

Paul Iriſh’s Bulletproof @font-face: Smiley variation
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone
Richard Fink’s Mo’ Bulletproofer @Font-Face CSS Syntax
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone
Conditional comment
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone
Google Font API
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone

Reference image (ſcreenſhot from Firefox 3.6.12 on Mac OS X):

reference screenshot: beſchütze/Zeit‌zone

Different ways of CSS definition

The following all use a conditional comment CSS. They all uſe the font-family name “UnifrakturMaguntia“ that is defined by the Google Font API.

Selector from main ſtyle ſheet (body)
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone
Special claſs from main ſtyleſheet
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone
Selector from additional ſtyleſheet (dd i)
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone
Special claſs from additional ſtyleſheet
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone
Selector from style tag (dd b)
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone
Special claſs from style tag
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone
Span tag with style attribute
beſchütze/Zeit‌zone – beſchütze/Zeit‌zone

Reference image (ſcreenſhot from Firefox 3.6.12 on Mac OS X):

reference screenshot: beſchütze/Zeit‌zone

Further reading