Font & Typeface Principles of Information Technology Making good design choices in formatting options for font when developing visually appealing publications The word font and the word typeface are interchangeable Copyright © Texas Education Agency, 2011. All rights reserved.

OBJECTIVES Identify categories of font styles Describe characteristics of font styles Identify publishing guidelines when choosing font styles Identify font formatting techniques for printed and electronic publications Copyright © Texas Education Agency, 2011. All rights reserved.

FONT CATEGORIES Serif San serif Script Decorative Copyright © Texas Education Agency, 2011. All rights reserved.

SERIF Definition: In this font category, there are short decorative tips at the end of the stroke for each letter. The font used for the title of this slide is a serif font – notice the tips at the end of the strokes for the letters. Copyright © Texas Education Agency, 2011. All rights reserved.

SANS SERIF Definition: In this font category, there is an absence of short decorative tips at the end of the stroke for each letter. The font used for the title of this slide is a sans serif font – notice the absence of tips at the end of the strokes for the letters. Copyright © Texas Education Agency, 2011. All rights reserved.

SCRIPT Definition: In this font category, the letters appear to be handwritten. The font used for the title of this slide is a script font – notice how the letters appear to have been handwritten. Avoid using script lettering for long paragraphs of information. Although it looks hand written, it becomes tiresome when reading long passages of handwritten text. Copyright © Texas Education Agency, 2011. All rights reserved.

ORNAMENTAL Definition: In this font category, the letters have a unique style that sets it apart, having an artistic design element incorporated into the lettering. The font used for the title of this slide is an ornamental font – notice how the letters have a unique style that obviously sets them apart from the three other categories of font. Copyright © Texas Education Agency, 2011. All rights reserved.

u u u S SERIF EXAMPLES S Slab Serif Playbill Modern Bodoni Style of Font Name of Font Tip Design Slab Serif Playbill Straight Constant thickness Thick slab Modern Bodoni Thin slab Oldstyle Garamond Slanted Thick to thin stroke Straight stroke Transitional Baskerville Latin Book Antiqua Curved stroke S S u u Variations can occur in the tips – but they are all still serif font. While serif font is a good choice for printed publications – some say it is easier to read in paragraph format due to the serifs on the bottom of the letters creating an unseen connection but giving the reader a visual line to follow when reading. However, because of the variations in the tips, you should never choose two different font styles within this category for the same page of your publication. It gives the reader a sense of choppiness and prevents good reading flow. u Copyright © Texas Education Agency, 2011. All rights reserved.

Arial Tahoma Gil Sans Century Gothic SANS SERIF EXAMPLES Variations can occur in the thickness of the stroke for the letters, but there are no tips at the end of the strokes. Some viewers believe that Sans Serif font is easier to view electronically than serif, however, if information is printed from the site, it still needs to be easily read in printed format. Copyright © Texas Education Agency, 2011. All rights reserved.

Amienne Bradley Hand Freestyle Script Comic Sans SCRIPT EXAMPLES Variations can occur in the strokes for the letters, but the letters themselves have the appearance of having been handwritten. Copyright © Texas Education Agency, 2011. All rights reserved.

Chiller Earwig Factory Jokerman Planet Benson ORNAMENTAL EXAMPLES Ornamental fonts are also called “decorative” fonts due to their unique decorativeness. They are used sparingly and for the sake of decoration. You should never choose a decorative font to type a paragraph of information. Use them only for main headings or an attention getter. Planet Benson Copyright © Texas Education Agency, 2011. All rights reserved.

Formatting Font Making good design choices Copyright © Texas Education Agency, 2011. All rights reserved.

FORMATTING CHOICES Font style of Font style of Font style of 1 3 title on page significantly different than other font on page Font style of title on page significantly different than other font on page 1 3 Font style of title on page significantly different than other font on page Font style of title on page significantly different than other font on page Ask the students to determine which item 1-4 is more visually appealing to them – and tell why. When the font style is not significantly different than the font style used at other places in the document – it appears to be conflicting rather than contrasting. None of these represent good font style selection. While #2 and #4 have a title font within the same category as the body font – it still appears to conflict and destroy any effort to unify the document. Rule of thumb: Do not choose two differing font styles from the SAME category, it conflicts rather than contrasts. 2 4 Copyright © Texas Education Agency, 2011. All rights reserved.

FORMATTING CHOICES Font style of Font style of 1 3 Font style of title on page exactly the same as other font on page Font style of title on page exactly the same as other font on page 1 3 Font style of title on page different category as the other font on page Font style of title on page different category as the other font on page Box #1 and #3 show Sans Serif and Serif examples of using the same font style choice for Title and text. Box #2 and #4 show examples of using opposing font style choices for Title and text. Ask the students to offer their opinions of which is the most appealing. Ask them to explain why they feel this way. 4 2 Copyright © Texas Education Agency, 2011. All rights reserved.

Font style of Title Font style of Title FORMATTING CHOICES Is decorative and while it is pretty and could be used for the names on a formal announcement or invitation, it should never be used for full paragraphs of text as in this example. Font style of Title Is script and while it is different and could be used for an attention getter, it should never be used for full paragraphs of text as in this example. 1 2 Box #1: The font style of this text is called Parchment. It is ornamental – used for its decorative value. However, when used to display a full paragraph of text, the reader finds it difficult to read. Box #2: The font style of this text is called Rage Italic. It is a script font – used also for its emphasis or decorative value. As with the ornamentals, when used to display a full paragraph of text, the reader finds it difficult to read. Copyright © Texas Education Agency, 2011. All rights reserved.

FORMATTING CHOICES FONT STYLE OF Font Style Of title on page exactly the same as other font on page we only changed the title to appear in all capital letters title on page exactly the same as other font on page we only changed the title text color and background shading Font Style Of 1 2 To create contrast without changing the font style choice, try using all caps for a heading, but you should never use that for a full paragraph of text. Or you could change the shading of an object as seen in box #2. Copyright © Texas Education Agency, 2011. All rights reserved.

REVIEW The four categories of font Serif- letters having short decorative tips at the end of each stroke. Sans Serif- letters that do NOT have short decorative tips at the end of each stroke. Script- letters that appear to be handwritten. Ornamental- letters that incorporate a common artistic design element Copyright © Texas Education Agency, 2011. All rights reserved.

REVIEW Examples of the four categories of font Serif- Times New Roman - R Sans Serif- Arial - R Script- Freestyle Script - R Ornamental- Chiller - R Copyright © Texas Education Agency, 2011. All rights reserved.

REVIEW Use the following sparingly Script and Ornamental All capital letters Switching categories of font within the same document Use Serif for written documents Use Sans Serif for electronic documents Copyright © Texas Education Agency, 2011. All rights reserved.

ACTIVITY #2 Look back at the document you created in Activity #1. Notice the font styles used on each web page. Create a textbox next to each screen snapshot. The textbox should show: 1) The number of different font styles on each page 2) The categories of different font styles on each page Copyright © Texas Education Agency, 2011. All rights reserved.

EXAMPLE REPETITION Number of font styles used: 1 This webpage shows repetition in the color theme. It has black, white and various shades of gray in the background as well as within the various objects – even in the clothes that the models are wearing. Repetition is also demonstrated by the use of the same font style for all text objects. The icons in front of the list of links all repeat the same size and shape. The software ads in the lower right repeat the same size, shape, colors, and arrangement of text/objects within each group. EXAMPLE Number of font styles used: 1 All text is in a sans serif font. Webpage screenshot of www.adobe.com This part is the only thing added for this activity. Copyright © Texas Education Agency, 2011. All rights reserved.