Typography - continueK1066BI – Graphical DesignTeppo RäisänenTeppo.raisanen@oamk.fi

Typography

Typography

•From Greek words ▫τύπος (typos) = form ▫γραφή (graphy) = writing

•It is the art and technique of arranging type, type design, and modifying type glyphs▫Representing spoken language in written

form

Typography

•The earliest surviving European letterforms are Greek letters carved in stone▫800 BC

•The Roman Empire adopted the letters from Greek▫700 BC

•The Romans developed them into what is know as a roman type▫Also known as Latin letter

Typography

•Duenos inscription

•600 BC•A B C D E F Z H I

K L M N O P Q R ST V X

Typography

Typography

•The Roman type started as capitals▫Inscriptions on buildings and monuments

were written with CAPITAL LETTERS•Today this is known as uppercase•Lowercase letters evolved from

handwritten text▫200-300 BC

Typography

Typography

•Typical to Roman type is the use of serifs

TEPPO

Typography

•In computer era the use of sans-serifs has increased▫Sans = without, sans-sefir = without serifs▫They are typically easier to read from

computer screen

Typography

•Letters were carved to stone with a hammer and a chisel▫We can practice this with Paint

Typography

•In computer era the use of sans-serifs has increased▫They are typically easier to read from

computer screen

TEPPO

Typography•Sans-serif types are new invention (200 years)

TEPPO•The use of serifs is much older (2000 years)

TEPPO

Typography

•Terms▫UPPERCASE / lowercase▫SMALL CAPITALS▫Serif / Sans-serif▫Italic (oblique)▫Bold

Typography

•Uppercase and numbers▫Numbers have uppercase and lowercase,

too▫If we use uppercase letters we should use

uppercase numbers NOT LIKE THIS 1938

▫Many times computer fonts do not have both uppercase and lowercase numbers

Typography

•Other terms

Typography

•Point▫Smallest unit of measure ▫Abbreviated as pt▫In desktop publishing 1 point is 1/72 of an

inch▫1 point = 0.3527 mm

•Pica = 12 points•Word, InDesign etc measure font sizes in

points

Typography

•The size is measure from descent to ascent▫Usually designers leave little bit room

above ascender and below descender

Typography

•The size is measure from descent to ascent▫Usually designers leave little bit room

above ascender and below descender

Fon

tsize

Typographic contrast

•Good typography is both art and communication

•Besides different types, we can also use contrast▫One of the main techniques

•In typography we can change▫Size▫Shape▫Weight▫Color

Size contrast

•Size change should be more than 10%•Usually we should not use too big size

difference▫20% is usually enough, e.g. Heading could

be 12 points, body of text 10 points

Size contrast

•20% constrast:

I saw a big cat

Size contrast

•Of course sometimes you want to over emphasize:

I saw a big cat

Shape contrast

•For shape contrast use two very different types▫Italic and normal text▫Uppercase and lowercase▫Strong sans-serif and light/italic serif

Shape contrast

•GraphicalDesign

•PANoulu

•TheGuardian

Weight contrast

•We can also change the font’s weight

•oneworld

•BELLSOUTH

Weight contrast

•We can also change the font’s weight

•oneworld

•BELLSOUTH

•You should not use this too much•Usually italic is better than bold

Color contrast

•Finally, you can change the colors to create contrast

•We will speak of the use of colors more in later lectures

Ecotone

Contrast

•Always use contrast with care

•It is very EASY to use it too much

Typography

•Operating systems usually come with pre-installed fonts▫All the normal fonts are usually there▫If we want some special fonts we have to

install them