Italics, Obliques and Visualizing Data

Italics and obliques an interesting, slightly different font attributes that both adjust the slope of the vertical axis.

True italics, are sloped fonts that have different letter shapes than their roman counterparts. For example consider how surprisingly different these letter forms are between roman and italic: a, a; f, f; or g, g. For serif fonts, in many cases, the italics have a different letter shape.

Oblique fonts a geometrically skewed versions of the corresponding non-italic (i.e. roman) font. The font designer may have made small adjustments to letter forms and spacing for an oblique font to work well. For sans serif fonts in many cases the italic version of the font is an oblique.

In the image below, the first two lines show the full alphabetic character set for Arial bold, both roman and italic. Note how the italic version of the letters is essentially a skewed version of the roman letters i.e. oblique. Compare this to the roman and italicized versions of Segoe UI immediately beneath. There are very significant differences in the overall letterform between the roman version vs italic version of a vs a. There are also very subtle differences, such as lowercase b, in the roman version the b has a small tail, whereas in the italic version there is no tail (click image for larger version). Similarly, the lowercase e has a sharp corner in the roman version and a rounded edge in the italic version.

Italic Comparison

Comparison between roman and italics for some fonts. Note the differences in letterforms between some roman and italic letters for some font families.

These differences can be much more obvious in a serif font. Century Schoolbook has many of the expected italic variants, and in general the italics have a curvature throughout their letterforms, where even straight-edged roman letters are replaced with much more curvier italic counterparts e.g. x vs x, w vs w or the plain z vs the more flamboyant italic z. Most but not all serifs are true italics: e.g. Bookman Old Style and Courier have obliques.

Taking a roman font, and simply applying a geometric transformation, i.e. skew, to create an italic, is considered a Type Crime by Ellen Lupton in her book Thinking with Type. 

While the convention for italics is to slope from lower left to upper right, other variations exist. For example, in the font family Quadraat, the italic version is upright and readily distinguishable from the upright roman version of the same font:

Quadraat

Reverse italics do occur too. This script from the Zaner-Bloser collection shows a full reverse italic script-like character set.

ZanierianReverseItalic

Below is an example of reverse italic in use in an cartographic example (from Visual Function: An Introduction to Information Design by Paul Mijksenaar). In this case, water features are consistently labeled in a blue reverse italic typeface, while other structures are labelled in black forward italic.

VisualFuncReverseItalic

One interesting property of italic fonts is that the overall font weight remains consistent throughout all text using both the roman and italic version of a font. Changing from roman to italic in the middle of a block of text does not change the overall intensity or brightness of text that has been italicized, as opposed to bold which creates a significant difference in intensity. Going back to Bertin’s Semiology of Graphics, italics offer an associative reading when combining italic and roman alphanumeric glyphs (meaning that the italic and non-italic glyphs can be read together  at a macro level) unlike bold which does not offer associative readings. To elaborate, in Bertin’s classification of visual variables, italics , which are largely based on variation in orientation, offers both associative and selective perception (meaning that italic and non-italic glyphs can be read together or separately) whereas bold offers selective and ordered perception (meaning that bold and non-bold glyphs can be read separately and also can be ordered, e.g. from lightweight to heavyweight).

Can italics be used in information visualization typography to encode data? Certainly italics can be used to differentiate between two categories, as is done currently in prose text to create emphasis.

Going beyond simple differentiation between italic and non-italic  – can italic be used to encode quantitative information? One approach will be to skew text, like an oblique. The angle for italics, as already hinted can vary from reverse to vertical to forward slope. Furthermore there are not specific standards for italic slope: most italics slope to the right between 2 and 20 degrees, although the range can vary even further. Consider this chart from 19th century with very steeply sloped italic at approximately 35 degrees (why so steep – perhaps overlapping text at right angles is more easily separable because the none of the major x,y axes align whereas they would align if non-italic):

Steep italics at 35 degrees.

Steep italics at 35 degrees.

Text can be skewed to an arbitrary angle, thereby creating an oblique text (although type purists may consider this a type crime). By varying the skew angle, one could potentially create labels that range from reverse slope, to no slope, to forward slope. Below is an image (from this paper) using font obliques to encode information regarding recency of email received from a particular person: reverse shows people from whom an email has not been received in a long time; ranging to forward slope which shows people from whom an email has been received recently:

Italic Graph

Slope angle indicates recency of contact. Slope ranges from reverse slope (old) to forward slope (very recent).

 

The above image skews a sans serif font. An interesting variant would be to start with a true italic and algorithmically skew the text from reverse to forward. This would be interesting to compare with the sans serif. The hypothesis is that the true italic has a closer design association to handwriting and therefore be more aesthetically acceptable than skewing a hard sans serif which typically does not exist in as wide a range of slopes.

 

Advertisements

About richardbrath

Richard is a long time visualization designer and researcher. Professionally, I am one of the partners of Uncharted Software Inc. I am also pursuing a part-time PhD in data visualization at LSBU. The opinions on this blog are related to my personal interests in data visualization, particularly around research interests related to my PhD work- this blog is about exploratory aspects of data visualization not proven principles.
This entry was posted in Uncategorized. Bookmark the permalink.

One Response to Italics, Obliques and Visualizing Data

  1. Pingback: Why Visualize with Fonts Now? | richardbrath

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s