I enjoy typography a lot. Choosing great typefaces is a fundamental part of making a website look good. But while typefaces get a lot of attention, characters themselves are often neglected. People do many approximations when typing and don’t realize it. They can’t be blamed for it, since keyboard layouts hide away all the richness of our writing system by showing only 70 characters or so.
The very comprehensive Copy Paste Character is useful for copying any special character, but the most common of them can be typed even more quickly using just your regular Mac and iOS keyboards.
The apostrophe is the easiest to spot typographic approximation. Sadly, the straight “typewriter” version is almost always used instead of the much prettier curly one.
Here's a typewriter apostrophe and here’s a curly one.
It’s interesting to see that Apple labels the apostrophe key on the iOS keyboard as a curly apostrophe, while the default character it prints is the typewriter apostrophe.
Quotation marks also have a common straight typewriter representation while their gorgeous curly version is left behind.
"Here" are typewriter quotation marks and “here” are curly ones.
The ellipsis is almost always represented as three periods. People probably aren’t even aware of the existence of the single–character ellipsis. With most typefaces you can distinguish the ellipsis by the slightly larger gap between the dots.
Here are three periods... and here’s an ellipsis…
It can also save you two precious characters in a tweet!
Dashes are ridiculously easy to mix up. There are many kinds, they look mostly the same and their usage can be hard to differentiate. The hyphen and minus sign can take the confusion ever further. Dialogs should be represented by em dashes, not hyphens.
- Here’s a hyphen.
- Meh. Isn’t it too short for a dialog?
— Fine, here’s an em dash instead.
— Oh, how pretty!
Note that the horizontal bar is the official character for this purpose, but the em dash is equally accepted.
On OS X, you may also enable text substitutions in the Edit > Substitutions menu in most apps. This setting isn’t system–wide so you’ll need to enable it in every app. “Smart Quotes” will automatically replace typewriter apostrophes and quotation marks with curly ones, “Smart Dashes” will replace two consecutive hyphens with an em dash, and “Text Replacement” will replace three periods with an ellipsis, among others. You can add custom substitutions in System Preferences > Language & Text > Text.
Go ahead and give your everyday writing a classier feel!
The Beginning Of Something
7 steps to help you design websites for the modern age