The document defines key terms related to fonts, typefaces, and text design such as serif, sans serif, leading, kerning and tracking. It provides guidelines for using text in multimedia and print projects, including choosing fonts, font sizes, colors and spacing to make text easy to read and proportionate to its importance. The document recommends limiting the number of fonts used, using symbols and icons to convey meaning, and animating text sparingly to engage viewers.

1. +
Text
By: JADE V. VILLAREAL

2. +
History of Text

3. +
Fonts and Faces

Typeface—a family of graphic characters that usually includes
many type sizes and styles

Font—a collection of characters of a single size and style
belonging to a particular typeface family

Styles—includes italic, bold and regular

Attributes—includes underlining and outlining of characters

Point—way of expressing type sizes (0.0138 inch)

Font size—distance from the top of the capital letters to the
bottom of the descenders in letters such as g and y

4. +
The measurement of Type

5. +

X-height—height of the lowercase letter x

Leading—(ledding) space below the descender (and
sometimes above) to provide appropriate line spacing

Character metrics—general measurements applied to
individual characters

Kerning—adjusts the width of the space between two
characters in a line of text

Tracking—creates an even spacing between multiple
characters in a line of text, widening it out, or tightening it up

6. +
Styles

7. +
Styles

8. +
Cases

Uppercase—capital letters

Lowercase—small letters

Case-sensitive—the text’s upper- and lowercase letters must
match exactly to be recognized

Intercap—placing an uppercase letter in the middle of a word
(used in programming)
TIP: Use all caps sparingly!

9. +
Serif vs Sans Serif

Serif—the little decoration at the end of a letter stroke


used for body text because the serifs are said to help guide the
reader’s eye along the line of text
Sans Serif—without serif

used for headlines and bold statements

10. +
Using Text in Multimedia

For titles and headlines—what a site is all about

For menus—where to go

For navigation—how to get there

Content—what you see when you get there

11. +
Designing with Text

On interactive projects or web sites



Text will help users navigate through relevant information in the site
Too little text on a screen requires annoying page turns and
unnecessary mouse clicks and waits; too much text can make the
screen seem overcrowded and unpleasant
Presentations

use bulleted points in large fonts and few words with lots of white
space

12. +
Choosing Text Fonts

For small type, use the most legible font available. Decorative
fonts that cannot be read are useless.

13. +
Choosing Text Fonts

Use as few different faces as possible in the same work, but
vary the weight and size of your typeface using italic and bold
styles where they look good

Ransom-note typography—using too many fonts on the same
page

14. +
Choosing Text Fonts

In text blocks, adjust the leading for the most pleasing line
spacing. Lines too tightly packed are difficult to read.

Vary the size of a font in proportion to the importance of the
message you are delivering

In large-size headlines, adjust the spacing between letters
(kerning) so that the spacing feels right.

To make your type stand out or be more legible, explore the
effects of different colors and of placing the text on various
backgrounds.

15. +
Choosing Text Fonts

Use anti-aliased text where you want a gentle and blended look
for titles and headlines.


Anti-aliasing—blends the colors along the edges of the letters
(called dithering) to create a soft transition between the letter and
its background
Try drop caps and initial caps to accent your words.

16. +
Choosing Text Fonts

If you are using centered type in a text block, keep the number
of lines and their width to a minimum.

For attention-grabbing results with single words or short
phrases, try graphically altering and distorting your text and
delivering the result as an image.

Experiment with drop shadows.

Surround headlines with plenty of white space

White space—designer’s term for roomy blank areas

17. +
Choosing Text Fonts

Pick the fonts that seem right to you for getting your message
across, then double-check your choice against other opinions.

Use meaningful words or phrases for links and menu items

Text links on web pages can accent your message: they
normally stand out by color and underlining, be consistent

Bold or emphasize text to highlight ideas or concepts, but do
not make text look like a link or a button when it is not.

On a web page, put vital text elements and menus in the top
320 pixels

18. +
Designing with Text

Installed fonts

Animating text—helps retain a viewer’s attention


Do not overdo the special effects or they will become boring!
Symbols—concentrated text in the form of stand-alone graphic
constructs



Convey meaningful messages
Examples: trash, hourglass
Icons—symbolic representations of objects and processes
common to the graphical user interfaces of many computer
operating systems

19. +

20. +
With multimedia, you have the power to blend
both text and icons (as well as colors,
sounds, images, and motion video) to
enhance the overall impact and value of your
message.