Content management solutions (CMS) allow anybody to publish content on their website. While this is certainly an advantage, I have noticed that most of my clients make four common typographic mistakes typical of amateur publishing.
Do not use two spaces after punctuation.
Since the invention of the Gutenberg press in the early 15th century, we have found that pages full of words are easier to read if the spaces between letters, between words, and between sentences look consistent. Two spaces after punctuation litter the page with little visual “holes” that spoil the uniform appearance of text blocks and distract the eyes. This is especially noticeable in justified text.
If you are still using two spaces that is probably because you learned about it from typing classes—most of which were still based on old typewriter usages. On a typewriter, all letters and punctuation have the same width and, therefore, it is acceptable to type two spaces after a punctuation to help the eye separate sentences. Desktop programs and web browsers use proportional type (letters of varying widths), and therefore have no need for double spacing.
Do not use foot and inch ditto marks instead of genuine curly apostrophe and quotation marks.
All proportional typefaces have extended characters not available on a computer’s keyboard. What you might think are single and double quote marks—apostrophe and quotation marks—on your keyboard are really foot and inch marks, which are designed as straight, vertical lines. Apostrophe and quotation marks are designed to harmonize with all other letters of the font. Quotation marks are designed as open and close curls or slants to specify whether a quotation is beginning or ending.
ExpressionEngine, like other CMS programs, offer a WYSIWYG editor that includes a function to select and include special characters such as the proper apostrophe and quotation marks. You can also learn how to type the correct marks straight from your keyboard.
Do not use double hyphens instead of em dashes and single hyphens instead of en dashes.
This is another carryover from typing classes and consequence of not knowing about extended characters in proportional typefaces. Professional typography use three distinct dash marks:
- The hyphen is used in compound words and to indicate the break of a word at the end of a line.
- The en dash is used for ranges (1984–2002; Monday–Friday).
- You’ll use the em dash to indicate a pause or to separate a phrase in a sentence.
Do not use underlining instead of italics or bold.
As just one character style was available on typewriters, we had to underline when we wanted to show emphasis or indicate titles or foreign words. But with today’s modern fonts we have many better options like bold and italics that look more elegant but also have rules of their own.
On a website, underlines indicate hyperlinks. Don’t confuse your reader by underlining non-clickable text!
Do not use double paragraph breaks instead of one.
Wonder what my most repeated task has been as a graphic designer and since the beginning of desktop publishing in the early eighties? Searching for and replacing double paragraph breaks with single ones in text sent to me for layout.
To make page layout to look great and long text easier to read, you need to have control over the spacing before and after paragraphs.
- In newspaper and magazine articles, paragraphs typically begin with a first line that is indented and without additional top or bottom spacing.
- When two paragraph breaks are used, the additional space typically seems to be too large and tends to tire the eye after a long read.
Frankly, this is not an hugely important mistake, but it becomes one if your website text has been styled to only accept one paragraph break. Always ask your designer what the proper way should be to handle paragraphs within the CMS you are using. This website is a good example: all the paragraphs end with one paragraph break and the spacing between two paragraphs is controlled by a style sheet rule.