Cross-posted from The League of Design Aspirants, where I’m hoping to contribute actively from now on.
What are ‘em’ and ‘en’ While type is normally measured in points and picas, horizontal spacing is measured in ‘ems’. An ‘em’ has no absolute value, an ‘em’ is a distance equal to the type size. This means that in 6pt type an ‘em’ is 6 points and in 18pt type it is 18 points. So, while the value of an ‘em’ keeps changing with the type size, it remains proportionately equal. The ‘en’ quite simply is half the width of an ‘em’. This couldn’t have been better illustrated than in the image of Laurel & Hardy used in the last post. To avoid mistakes or confusion in oral instructions, the ‘em’ and ‘en’ are also called muttons and nuts respectively.
Kinds of Dashes The dashes are quite simply classified on the basis of their lengths, and each has a distinct use that a typographer must learn.
Em Dash The em-dash is one-em wide and is used to express strong grammatical breaks. For instance, the em-dash followed by a thin space is the normal European method of marking dialogues. In manuscripts, em-dashes are often represented by a double hyphen, which must be replaced by an em-dash by the typographer.
En Dash One-en wide, the en-dash is used to indicate a range or to connect numbers. In this role, the en-dash stands for the word ‘to’. It is however advised than in running prose the en-dash is replaced by the proposition to make the meaning clearer.
Hyphens The standard hyphen is shorter in length than both the en and em-dash, and it is used to link words and phrases, or break words at the end of the line. A discretionary hyphen can be inserted by a typographer when lines are broken manually. They disappear in subsequent re-editing when the text reflows.
Some typefaces also have a different symbol for the minus sign.
Keystrokes for Dashes Given below are the keystrokes for the dashes discussed above but unfortunately I’ve only got them for the Mac. These work in Adobe InDesign.
Em Dash shift+option+hyphen
En Dash option+hyphen
Hyphen (hyphen key)
Discretionary Hyphen command+hyphen
Using em-dash and en-dash in CSS For those of us who design for the web, it would be useful to know that the em-dash can be created by using
— and the en-dash by
Want to know more? Ellen Lupton’s Thinking with Type and Robert Bringhurst’s Elements of Typographic Style give a definitive overview on the usage of the different kinds of dashes and go into great detail not only about dashes but also the spaces used around them. If you’re looking to implement brilliant typography to the web, this article on A List Apart can be a useful resource.