Golden Rules of Typography

Leave a Comment / Typography / By

BEFORE reading Jane’s Golden Rule, read/ watch these important links:

– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – 

Jane’s Golden Rule of Typography
by Jane Hannah, edited by Ian Rogers

PART I

A few pointers…


  • Read the text before designing it;

  • Choose a typeface or a group of faces that will honour the character of the text;

  • Start with a single typographic family;

  • Use a single word space between sentences;

  • Add little or no space within strings of initials;
  • At hyphenated line-ends, leave at least two characters behind and take at least three forward;

  • Avoid more than three consecutive hyphenated lines;

  • Hyphenate according to the conventions of the language;

  • For abbreviations and acronyms in the midst of normal text, use spaced small caps;

POINT SIZE


  • Print Publications

Body texts should have a body size of 9 to 11 points — for most projects between 9, 10 or 11 points is ideal.

  • Commercial Business

For business cards, usually the point size should be between 8.6 pts and 9 pts… not smaller than 8.6 and not bigger than 9!

WEB

  • 
between 12 px and 16 px is ideal. 16 px is equivalent to 12 points.

TYPE CASE
PRINT & WEB 


A good rule of thumb is this one — Do not use ALL CAPS unless for major headlines with a maximum of 3-4 words. All cap settings for lengthy text are more challenging to read due to the lack of ascenders and descenders which contribute to character recognition, so stick to upper and lowercase when readability is of prime importance. Similarly, avoid using centre alignment except in short headlines or in specific use cases where this is conventional, such as restaurant menus.

LEADING
 PRINT PUBLICATIONS


Point sizes that range between 9 points and 11 points.


  • 130% to 160% more than the point size… this means that you multiply your point size by 1.3, or 1.4, or 1.6, or… etc.;

For point sizes between 18 and 72 points:


  • Leading is BLOCK or SOLID, meaning 18 on 18 or 21 on 21, etc.

For point sizes over 72 points, then we start deducting space:


  • -110%, etc. For this you must really look at a typeface and determine visually what is best with that specific typeface.

WEB


Default leading for the web is set by the browser and is not the same. 

Desktop browsers (including Firefox) use a default value of roughly 1.2, depending on the element’s font-family. The ideal line has a length of 60 to 80 characters with a line-height of around 1.5 (150%) to 1.6 (160%). It always depends on your typeface.

PART II

FONT FAMILIES


If the body text is in a SERIF typeface, then its titles and subtitles should be in SANS SERIF, however if the body text is SANS SERIF, then titles and subtitles should be in SERIF.

PARAGRAPH INDENTS


1 pica per 10 picas wide or one-tenth (1/10) of the total column width.

Note: Paragraph indents are considered terribly old-fashioned, much like having a double space after the period in a sentence. Both are a holdover from typing.

HYPHENS


Hyphenation is the automated process of breaking words between lines to create more consistency across a text block.

ENGLISH language (as per Robert Bringhurst, “the” king of typography)
• 5 characters: smallest word possible;


  • 2 characters: before a hyphen;

  • 3 characters: after a hyphen.

ENGLISH language (as per Richard Rutter, the web typography king — however I cannot agree with this premise as it takes too little of the word ahead to the next line)


  • 6 characters: smallest word possible;

  • 3 characters: before a hyphen;

  • 2 characters: after a hyphen.

FRENCH language, high-end print publications:


  • 5 characters: smallest word possible;

  • 2 characters: before a hyphen;

  • 3 characters: after a hyphen.

FRENCH language, newspaper quality publications:


  • 4 characters: smallest word possible;

  • 2 characters: before a hyphen;

  • 2 characters: after a hyphen.

“Fi-nally is a conventionally acceptable line-end hyphenation, but final-ly is not, because it takes too little of the word ahead to the next line.”

i.e.: “In English one hyphenates cab-ri-o-let but in French ca-brio-let. The conventions of the individual language should be followed even for single foreign words or brief quotations.”

NOTE ABOUT WORKING IN FRENCH:

Always refer to le Ramat de la Typographie as the final authority.

Au Québec, le Ramat est l’ouvrage de référence en matière de règles typographiques depuis presque 40 ans.

Il concerne les règles d’écriture

  • de la ponctuation ;
  • des abréviations ;
  • des majuscules ;
  • des nombres ;
  • des adresses ;
  • des dates.

On y indique aussi

  • les accords grammaticaux ;
  • les principales difficultés orthographiques ;
  • la nouvelle orthographe ;
  • la féminisation des textes.

De plus, on y trouve

  • une liste d’anglicismes avec leurs équivalents français ;
  • un chapitre consacré aux règles typographiques en informatique ;
  • un chapitre portant sur l’emploi de l’italique ;
  • des exercices accompagnés de leur corrigé.

PART III

CONSECUTIVE HYPENS IN A ROW
High-end quality (magazines, books, etc.): 2 consecutive hyphens in a row;
Newspaper quality: 3 consecutive hyphens in a row.

MARGINS
COMMERCIAL margins are usually equal on all sides… so for example 0.5 inches all around.

PUBLICATION margins. Two simple ways of calculating margins for publications (books, magazines, booklets, etc.)

[according to Robert Bringhurst’s wonderful book The Elements of Typographic Style]

COLUMN WIDTHS
The ideal way is the first one (this is the one that I verify).
1❖ Count the number of words in a line — between 11 and 16 words per line;
OR
2❖ 2x times to 3.5x times the Point Size in picas ie: point size is 11 points, therefore my column width should be 11 x 2 = 22p0 to 11 x 3 = 33 picas wide — I prefer this equation as I use 3x most of the time;
OR
3❖ count the number of signs — between 55 and 80 signs in a line.

NUMBERS
Under the number 10, we write the complete number.. ie: three not 3.

WIDOWS & ORPHANS
Widow: paragraph-ending line that falls at the beginning of the following page/column, thus separated from the remainder of the text;

Orphan: paragraph-opening line that appears by itself at the bottom of a page/column;

Word, part of a word, or very short line that appears by itself at the end of a paragraph. Orphans result in too much white space between paragraphs or at the bottom of a page.

THE ELEMENTS OF TYPOGRAPHY STYLE FOR WEB

(information taken from the following site: http://www.webtypography.net)

WORD SPACE

“If text is set ragged right, the word space (the space between words) can be fixed and unchanging. If the text is justified (set flush left and right), the word space must be elastic. In either case the size of the ideal word space varies from one circumstance to another, depending on factors such as letterfit, type color, and size. A loosely fitted or bold face will need a larger interval between the words. At larger sizes, when letterfit is tightened, the spacing of words can be tightened as well.”

SPACES

  •   en space
  •   em space 
  •   3-per-em space
  •   4-per-em space
  •   6-per-em space  
  •   figure space
  •   punctuation space 
  •   thin space  
  •   hair space  

LENGTH OF LINE


“Anything from 45 to 75 characters is widely regarded as a satisfactory length of line for a single-column page set in a serifed text face in a text size.
The 66-character line (counting both letters and spaces) is widely regarded as ideal.
For multiple column work, a better average is 40 to 50 characters.”

ALIGNMENT


“In justified text, there is always a trade-off between evenness of word spacing and frequency of hyphenation.
Narrow measures – which prevent good justification – are commonly used when the text is set in multiple columns. Setting ragged right under these conditions will lighten the page and decrease its stiffness. 
Many non serifed faces look best when set ragged no matter what the length of the measure. And mono-spaced fonts, which are common on typewriters, always look better set ragged.”

Alteration of letters
“In the world of digital type, it is very easy for a designer or compositor with no regard for letters to squish them into cattle trains and ship them to slaughter.”
LEADING
“Vertical space is metered in a different way [to horizontal space]. You must choose not only the overall measure – the depth of the column or page – but also a basic rhythmical unit. This unit is the leading, which is the distance from one baseline to the next.”

Add/delete vertical space in regular intervals
“Headings, subheads, block quotations, footnotes, illustrations, captions and other intrusions into the text create syncopations and variations against the base rhythm of regularly leaded lines. These variations can and should add life to the page, but the main text should also return after each variation precisely on beat and in phase.”

HYPHENATED LINE-ENDS


At hyphenated line-ends, leave at least two characters behind and take at least three forward
“Fi-nally is a conventionally acceptable line-end hyphenation, but final-ly is not, because it takes too little of the word ahead to the next line.”

CONSECUTIVE HYPHENATED LINES
BEFORE reading Jane’s Golden Rule, read/ watch these important links:

https://helpx.adobe.com/ca/indesign/using/paragraph-character-styles.html

Leave a Comment

Your email address will not be published. Required fields are marked *