How We Speak

Part 1: The Significance of Amplitude Typeface

Matthew Carter

Typographer

Verdana & Georgia

Type designed for the screen

Bell Centinneal

Inktraps as a solution to dot gain

Hoefler & Frere-Jones

Typographers

Gotham

A modern typeface for the ages

Christian Schwartz

Typographer

How We Speak

Part 2: How We Use Typography

Typeface Foundaries, Digital Type Manufactures, and Licensing Companies

  • Adobe Foundary
  • Monotype
  • FontFont
  • My Fonts

Free & Default Fonts

  • Lacks font style options
  • Possibly will be seen in many other places
  • Lacks craftsmanship

Professional Typefaces

  • Multiple font style options
  • Will not be seen everywhere
  • Additional license needed for commercial use
  • Better Quality

FONT SPECIMEN

A B C D E F G H I J K L M N O P Q R S T U V W X Y Z a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0 & @ . , ? ! ’ “ ” ( )

28px

Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, “useful precedent” and the progressive tendencies of an able mind. For, let a man be as able…

22px

Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, “useful precedent” and the progressive tendencies of an able mind. For, let a man be as able & original as he may, he can’t afford to discard…

16px

Is not the best kind of originality that which comes after a sound apprenticeship? That which shall prove to be the blending of a firm conception of, “useful precedent” and the progressive tendencies of an able mind. For, let a man be as able & original as he may, he can’t afford to discard knowledge of what has gone before or what is now going…

Fundamentals

Keerning


tracking tracking tracking tracking tracking tracking

tracking tracking tracking tracking tracking tracking

tracking tracking tracking tracking tracking tracking


leading leading leading leading leading leading leading

leading leading leading leading leading leading leading

leading leading leading leading leading leading leading


Line Height, Line Length, and Font Size

22/1.1

Many additional variables can be taken into account when setting typography. Remember that readers scan and focus on groups of words. Carefully set typographic ratios can enhance the reading experience.

22/1.3

Variables such as choice of typeface, font color and even subject matter can have an impact on legibility. They key is to decrease fatigue of the eye as it tracks across the page. Sources say that anywhere between 45 to 75 characters (including whitespace) is an ideal line-length.

22/1.5

One of the most important things to do when setting type is to experiment and adopt a deliberate process that supports the desired visual heiarchy and creates a vertical rhythm. Remember that optical characteriestics must take presidence over scientific formulas.

How We Speak

Part 3: Web Typography
Web Type distributers:

Markup Example

This is a portion of the code that styles the text for this presentation:


/*
This CSS resource incorporates links to font software which is 
the valuable copyrighted property of WebType LLC, The Font Bureau 
and/or their suppliers. You may not 
attempt to copy, install, redistribute, convert, modify or reverse 
engineer this font software. Please contact WebType with any 
questions: http://www.webtype.com 
*/@font-face {
	font-family: "Amplitude-Light";
	src: url("fonts/ee553ccf-2d0c-4e23-9d9d-1067a902018a-2.eot");
	src: url("fonts/ee553ccf-2d0c-4e23-9d9d-1067a902018a-2.eot?") format("embedded-opentype"),
	     url("fonts/ee553ccf-2d0c-4e23-9d9d-1067a902018a-3.woff") format("woff"),
	     url("fonts/ee553ccf-2d0c-4e23-9d9d-1067a902018a-1.ttf") format("truetype"),
	     url("fonts/ee553ccf-2d0c-4e23-9d9d-1067a902018a-4.svg#web") format("svg");
	font-style: normal;
	font-weight: normal;
}

@font-face {
	font-family: "Amplitude-Regular";
	src: url("fonts/79539be8-a6e9-4346-8317-ff332fb93cae-2.eot");
	src: url("fonts/79539be8-a6e9-4346-8317-ff332fb93cae-2.eot?") format("embedded-opentype"),
	     url("fonts/79539be8-a6e9-4346-8317-ff332fb93cae-3.woff") format("woff"),
	     url("fonts/79539be8-a6e9-4346-8317-ff332fb93cae-1.ttf") format("truetype"),
	     url("fonts/79539be8-a6e9-4346-8317-ff332fb93cae-4.svg#web") format("svg");
	font-style: normal;
	font-weight: normal;
}

@font-face {
	font-family: "Amplitude-Medium";
	src: url("fonts/e6bca966-0ecc-4907-9e5d-3dabaa457d0d-2.eot");
	src: url("fonts/e6bca966-0ecc-4907-9e5d-3dabaa457d0d-2.eot?") format("embedded-opentype"),
	     url("fonts/e6bca966-0ecc-4907-9e5d-3dabaa457d0d-3.woff") format("woff"),
	     url("fonts/e6bca966-0ecc-4907-9e5d-3dabaa457d0d-1.ttf") format("truetype"),
	     url("fonts/e6bca966-0ecc-4907-9e5d-3dabaa457d0d-4.svg#web") format("svg");
	font-style: normal;
	font-weight: bold;
}

@font-face{
	font-family:CelesteWeb;
	src:	url("fonts/c.eot");
	src:	url("fonts/c.eot?") format("embedded-opentype"),
			url("fonts/c.woff") format("woff"),
			url("fonts/c.ttf") format("truetype"),
			url("fonts/c.svg#web") format("svg");
	font-style:normal;
	font-weight:400
}
                    	

How We Speak

QUESTIONS

Credits

Resources