If I am lucky, I know just enough about typography to write this article. If the way the article is set appeals to you, you can probably thank your browser, or luck, I am no type expert by any means. I wonder at the artists who create fonts—fontographers and those who know how to use them well—typographers. This post is about how to use certain typographical characters correctly in XHTML documents.
em and en are units of typographical measurement. An em is the size of the letter M. Since type sizes may vary the size of an em is relative to the size of the type. (An em inside of an <h1></h1> is larger than an em in <h2></h2>)
em dashes (
—) are an em in length, and are used to represent a break in thought, or to set off a parenthetical expression such as in the first paragraph of this post.
en dashes (
–) are about one half an em in length and are usually used to indicate a range of numbers, such as 1–10.
The thing on your keyboard a couple over from the backspace key is called a hyphen-minus, and unless you want to get very technical about it, its probably not important to know that a real minus is
It may not be important to know that en dashes are not hyphens. But it might make good conversation at a boring cocktail party where you get trapped by the company webmaster. Hyphens are used in typography to break words at the end of a line, and HTML has some support for that sort of thing. Use of hyphens in writing has a number of different purposes in the written English language.
I am not making this stuff up, and I am not even the first one to write with a title that makes a pun about the units en and em, or em and en and a certain popular rap artist. Whatever. See Also:
- The HTML Specification for character entities.
- An article at A List Apart with details about even more character entities, written by a guy who knows gobs about typography in HTML, Peter K. Sheerin. (His was written in 2001, and the information is still accurate even if references to browser versions are outdated.)
- A thread on the forum at typophile.com which discusses some of the finer details of how to format the spaces around dashes.