Post on 23-Dec-2015
ABC of Typography
Typography
useful art (creating typefaces, design pages, books) science (typographic rules) craft, work (typographer ~ printer)
History of Writing advent of writing system – the result of the evolution of
the human society (the necessity of recording) pictogram (a picture representing a thing)
king
ox
ideogram (a picture representing an idea) pictographic script – hundreds of symbols phonogram (a symbol representing a sound) –
revolution in the evolution of writing (“several” symbols)
Hieroglyphs pictographic script syllabic script
phonetic script
Cuneiform writing pictographic script syllabic script
China’s script
(word script up to present)
sun
mountain
tree
centre
field
boundary
door
The Earliest Scripts
History of Writing in Europe
Phoenician alphabet 22–24 geom. symbols for consonants
Greek alphabet• signs for vowels (!)• the basis for Latin and Cyrillic
Czech alphabet• capital letters – ancient Rome• small letters ~ 800 AD• accents (Jan Hus)
(Carolingian minuscule)
Evolution of Numerals
Romanused till 15st century MDCCLXVIIMDCCLXVIIMDCCLXVIIMDCCLXVII
1767176717671767 Arabic
origin in India
Typeface – Set of Characters
a, b, c, lower case, small lettersA, B, C, upper case, capital letters1, 2, numeralsˇ ´ ¨ diacritical marks, accents. , ! ? ; : punctuation marks ( ) [ ] { } brackets„ “ ’ quotation marks, apostrophe+ = mathematical signs% § & other symbols
Typeface – Boundaries
cap line
ascender line
mean line
base lineRbydescender line
cap
h
eig
ht
x-h
eig
ht
asce
nd
erd
esce
nd
er
Typeface – Letterform stem – the main vertical stroke serif – the small cross-stroke added to the end of main strokes contrast – the degree of difference between thick and thin strokes
no contrast
contrastoblique stress
strong contrastvertical stress
serif
overhanging
stem
counter
A AA A
A AA A
A A
A A
proportional monospacedproportional
proportional monospacedproportional
style of the serif (bracketed / unbracketed)
contrast / no contrast
thickness of strokes
proportions- width- height
Distinguishing features:
end of the strokes (serif / no serif)
Typeface – Letterform
Family – collection of variations designed with the same characteristics of types
Face – one of the styles of a family
Common faces (styles of font):
• roman (regular)
• bold
• italic
• bold italic
• (small capitals)
Type Family
Times New Roman
Times New Roman
Times New Roman
Times New Roman
TIMES NEW ROMAN
(Times New Roman)
Classification of Tapefaces several different systems of classification English classification is based on history
Blackletter (Old English, Gothic)
Old Style Typefaces(Garamont)(Palatino)(Bembo)
(San Marco)(Clairvaux)
Transitional Type(Fourier)(Baskerville)
Classification of Tapefaces
Slab Serif (Egyptian)(Glypha)
Script, Brush, Freehand
Sans Serif (Grotesque)(Helvetica)(Eurostile)
Modern Type(New Century Schoolbook)(Bodoni)
(Lubalin Graph)
(Brush Scripr)
Measuring in Typography
Europe system (Didot)• 1 point = 0,3759 mm • 12 points = 1 cicero = 4,513 mm
English-American system• 1 point = 0,3528 mm • 12 points = 1 pica = 4,23 mm• 72 points = 6 picas = 1 inch = 2,54 cm
0,
9385
1,0655
Eu-pointsAm-points
60 points 60 points60 points 60 points
Body Size (Point Size)
size of the metal body of a type
actual height of letters depends on the typeface
Using of Body Size
poznámka, newspapers, magazines, books, schoolbooks, childbooks, headers 16 pt, headers 18 pt, headers 24 pt poznámka, newspapers, magazines, books, schoolbooks, childbooks, headers 16 pt, headers 18 pt, headers 24 pt
6–7 dictionaries, time tables, telephone directories, notes 8 newspapers9 magazines10 books11–12 schoolbooks, books for children, books in larger format14 books for children, headings16 main headings
Relative Typographical Unit
em = body sizeen = 1/2 em
is used to express• size of spaces between words • width of types
.
Spacing letter spacing
• specified by the definition of types
• computer typesetting – easy to change
• tracking – uniform addition or subtraction of space to/from all characters
AV MN
TRÁVAAV MN
TRÁVA word spacing• left-aligned, centered, right-align text – constant space 1/3 em• justified text – variable space (1/4 em – 1/2 em) • nonbreaking space ban of line break
J.°A.°Komenský 37°Kč z°lesa 100°000
J.°A.°Komenský 37°Kč z°lesa 100°000
• kerning – adjustment of space between individual letter pairs
Paragraph unit of text first line – indent (1–2 em) same indent in the whole text bullets, numbering – special text negative indent of the first line – hanging no first-line-indent – space before paragraph last line – not too short, not as long as the whole line first line cannot stay by itself at the bottom of a page
(orphan) last line cannot stay by itself at the top of a page
(widow)
right-alignedflush rightragged left
(fully) justified
centered
Leading
leading – the space between lines of the text • affects the appearance and readability of the text• suggested value – 20%
line spacing (word processors)
Alignment
left-alignedflush left
ragged right
Rulespunctuationpunctuation
. , : ; ? !. , : ; ? ! no space before, one space after
I came, I saw, I conquered.I came, I saw, I conquered.
“ Konec , zvonec ! “ řekl .“ Konec , zvonec ! “ řekl .
Barvínek menší (Vinca minor)Barvínek menší (Vinca minor)
ellipsisellipsis symbol
quotation marksquotation marks
„ “ „ “ no spaces inside, spaces outsideUse true marks in every language!!
“ ”
bracketsbrackets
( ) [ ]( ) [ ] no spaces inside, spaces outside
What is the meaning of “the open door”?What is the meaning of “the open door”?
“How did she do it?” he asked.“How did she do it?” he asked.
„Jak to udělala?“ zeptal se.„Jak to udělala?“ zeptal se.
apostropheapostrophe
’ no spacesthe boy’s motherthe boy’s mother
I didn’t hear.I didn’t hear.
- hyphen (1/3 em) without spaces
— dash (1 em) (used to separate parts of sentence)• with spaces in Czech• without in American English
RulesFrýdek-MístekFrýdek-Místek
air-conditionair-condition
bude-libude-li
Brno-městoBrno-město
společensko-politickýspolečensko-politickýfast-movingfast-moving
ex-wifeex-wife
dash (1/2 em) (used to separate parts of sentence)
• with spaces in Czech, in English He is He is – how shall I say it? how shall I say it?.He is He is – how shall I say it? how shall I say it?.
He is—how shall I say it?He is—how shall I say it?.He is—how shall I say it?He is—how shall I say it?.
Zapracoval — a výsledek se dostavil.Zapracoval — a výsledek se dostavil.
Zapracoval – a výsledek se dostavil.Zapracoval – a výsledek se dostavil.
česko-anglickýčesko-anglický
easy-goingeasy-going
dash (1/2 em) (used to express a range or as the equivalent of to or versus)
• without spaces
the years 1963–1967the years 1963–1967pages 23–28pages 23–28
the New York–Paris flightthe New York–Paris flight
the Lincoln–Douglas Debatesthe Lincoln–Douglas Debates
sixty-fivesixty-five
2 inches, 5 minutes2 inches, 5 minutes
Rules – Using Numbers Write out numbers through nine (or that require no more than one word).
There are twenty-six students in my wife’s third-grade class.There are twenty-six students in my wife’s third-grade class.
Byly dvě hodiny v noci a kohout třikrát zakokrhal.Byly dvě hodiny v noci a kohout třikrát zakokrhal.
Using numerals:
with unit of measure, time etc. in technical text a sentence cannot start with a figure
two playerseleven players11 players
two playerseleven players11 players
Rules – Using Numbers
12,451 12 45112,451 12 451
decimals
large numbers
12.451 12,45112.451 12,451
dates:
in Britain:
30 March 199530 March 1995
30th March (,) 199530th March (,) 1995
March 3, 1995March 3, 1995
30.3.199530.3.1995
30-3-199530-3-1995
in Czech:
in America:
30/3/199530/3/1995
3/30/19953/30/1995
30. 3. 199530. 3. 199530. března 199530. března 1995
Rules
Emphasizing words use italics use boldface only for terms avoid using underlined text
Usizing typefaces use serif typefaces for body text use sans serif typefaces for forms, tables don’t use more than four fonts in any one publication
Layout of the Page basic layout page map visual center of a page is higher than the geometrical one
right page is more expressive margins: top, bottom,
left, right or mirror: inside, outside footer – information, such as: chapter, date, page
number, listed below the main text area of a page
header – information, such as: title, chapter name, date, or page number, listed above the main text area of a page
page numbering – header, footer, outside margin
right page has always an odd number
Jobbing printed matters
occasional personal or firm printed mattersvisiting-card, letter paper and envelopes, wedding-carddiplomas, cards of invitation, greetings-card, programs, catalogs, advertising brochures
sizes needn´t to be standardized fonts can be decorative principles: information ability
readability aesthetic standard
Fonts Font a complete set of characters in a typeface
a file containing the description of the shape of letters
Some fonts are installed together with programs, or we can buy them separately.
Fonts can have different sets of characters (national alphabets, special sets of characters – e.g. Symbol)
bitmap fonts
• each character is stored as an array of pixels
• are not easily scalable
• for each size, face and resolution an extra description
• used e.g. as a system font for screen (menu)
vector (outline) fonts
• each character is encoded by a higher-level description in terms of lines and areas
• can be scaled to any size and otherwise transformed easy
• another information in the file: hinting (instructions for representing by raster output devices), kerning pairs
• wide-spread:
– True Type fonts (Microsoft+Apple, belong to OS)
– Adobe Type 1 (PostScript) fonts (Adobe Systems)