Typograpy. Type Type - Categories Serif Fonts  Oldstyle  Transitional  Modern  Slab Serif Sans Serif Fonts Script Decorative Monospaced.

Slides:



Advertisements
Similar presentations
The Key Element in Desktop Publishing Design
Advertisements

Part 3 Introduction to CSS. CSS Text Text Styles h1 {color: green} // rgb(0,255,0), #00ff00 h2{letter-spacing: 0.5cm} // 2px h3 {text-align: right} //
Typography: The basic building block of any printed page.
SM2222: Information Design and Visualization Session 3: Typography 23 September 2005.
1 Professional Communications Working with Type Copyright © Texas Education Agency, All rights reserved. Images and other multimedia content used.
WORKING with TYPOGRAPHY The art of skillfully arranging and presenting type to gain attention.
The art or process of printing with type Typography.
Exploring Web Design Chapter 3 Web Typography. The goal of any web page is to communicate.
Typography the art of using (text) fonts and font styles to produce professional looking publications the art of using (text) fonts and font styles to.
CSS – CASCADING STYLE SHEETS Making your XHTML webpage look good.
Typography Usability & Readability
Typography. It’s not just the words, but the shape, size of headline and letters can attract readers. Typography important enough to warrant own journaljournal.
TYPOGRAPHY BASICS Technical Foundations II. Typography Basics  Baseline Apple.
The 16 Typography Vocab Words Most Likely to be Wrong For Document Design By Dr. Jennifer L. Bowie.
content/uploads/2010/03/Death_by_Typography_by_GCORE1.jpg.
Thinking with Type A Critical Guide for Designers, Writers, Editors, & Students ELLEN LUPTON v.
+ Text & Font Styles Unit 3 Lesson Different Font Categories Sans Serif – block style fonts Example - Rockwell Easy to read and good to use when.
Typofaces give voice to words Typefaces give voice to words.
Formatting Text (Plus More Selectors) Learning Web Design: Chapter 12.
 Font is also commonly called type or text › They all mean the same thing You can say font face or type face but they mean the same thing.
Categories TYPE of Text is the most essential ingredient in design communication. With type you communicate in two distinct ways. The first message your.
JRN 302: Introduction to Graphics and Visual Communication - Typography Tuesday, 7/7/15.
Typography Conveys mood Communicates attitude. The Letters X-height –the height of the main body of a lower case letter (literally, the x) x j Cap height.
10. Typography The basic terminology & concepts of working with type
Fall Unit 2. Development Module 8: Typography & Design.
Introduction to Interactive Media 06: Text: Static Interactive Media Component.
Typography 2.01 Investigate typefaces and fonts..
Words are communication. What do they say? The meaning should come before the look of the type is considered. The primary task of graphic design is to.
TYPOGRAPHY.
Art 368 WEB Design 1 Spring 2002 Type Two basic families:  Serif and Sans Serif Parts of all type Ascenders, descenders, baseline, etc. Leading= linespacing/paragraph.
Introduction to Type in Graphic Design AEE 210 Jim Lucas Modified by Luke Reese.
Typography Terms. o.php?viewkey=d26eb03e91d5741a4a 3b.
All of the following terms describe parts of a font that give the eye visual clues to decoding the letters while reading. Many of these terms stem from.
Introduction to Typography Type is everywhere It is a fundamental means of communication Origins as a mechanical process Now very much a critical part.
Typography All types of t y pe Typography Defined The design, arrangement, style and appearance of type matter constitute typography.
Typography The Art of designing with words and letters.
The art of using text to produce professional looking publications.
COM 366 Web Production & Design
INTRODUCTION TO HTML5 Styling Text. Change the Font Size  You can use the font-size property to change the font size for a document’s text.  Instead.
INTRODUCTION TO TYPOGRAPHY WHAT IS TYPOGRAPHY? Typography: The study of all elements of type including the shape, size and spacing of the characters.
Typography (Fonts). Type type = any set of printed characters font = a set of printable or displayable characters with a specific style and size typeface.
Basics of Web Design Chapter 6 More CSS Basics Key Concepts.
Typographic History & Classification
Copyright © Texas Education Agency, All rights reserved. Images and other multimedia content used with permission. 1 Graphic Design & Illustration.
Cascading Style Sheets Objective: Create an external style sheet, embedded style sheet, and an inline style to change the look and feel of a web site.
TYPOGRAPHY What is Typography?
Graphic Design  Graphic Design is a form of visual communication.  Communicate a message  Using typography and graphic elements.
Graphic Communications Chapter 4.  Distinctive designs of visual symbols that are used to compose a printed page.  Ie: Magneto, Times New Roman, Baskerville,
Typography Classifying Typefaces. Typeface Classification - Serif, Sans and Script Type can be classified into 3 broad categories: SERIF, SANS SERIF and.
Type Categories. Type Terms Stress: if you drew a line between the two thinnest parts of a letter S No stress Diagonal stress.
Headings and Text What makes headings stand out?.
The art of using text to produce professional looking publications.
Typography. the design and use of typefaces as a means of visual communication how to select, size, arrange, and use typefaces.
C a t e g o r i e s of T y p e. Oldstyle Diagonal Stress Serifs on lowercase letters are slanted Moderate thick/thin transition in the stroke Examples.
What are we interested in? 1. Understand Design 0 2. Digital Image design 3 3. Time-based media Webpage design 2 1.
Typography A Key Element in Design A. Definition of Typography Typography is the appearance and arrangement of the characters that make up text on a page.
Words are communication. What do they say? The meaning should come before the look of the type is considered. Choose typographic styles and sizes that.
FontSFontSFontSFontS aka Typography. Font Parts Lets break fonts down by their parts!
Blended HTML and CSS Fundamentals 3 rd EDITION Tutorial 3 Introducing Cascading Style Sheets.
Introduction to typography
Typography An introduction on how to use typefaces
Typography Typography is the art and technique of creating and composing type in order to convey a message. Words are communication. What do they say?
Vocabulary & Guidelines
google. ca/imgres. imgurl= braincrumbtrail
Basic Desktop Terminology
Understanding Typography
Typography The Art of designing with words and letters.
Desktop Publishing Terminology
A Few Simple Type Rules Graphics Design Tech 1.
Professional Communications
Presentation transcript:

Typograpy

Type

Type - Categories Serif Fonts  Oldstyle  Transitional  Modern  Slab Serif Sans Serif Fonts Script Decorative Monospaced

Type - Categories Serif Fonts  Oldstyle: Times, Garamond  smooth transitions between thick and thin strokes  rounded (bracketed) serifs, slanted serifs  diagonal stress  Transitional: Baskerville  transition between oldstyle & modern  Squared off serifs  Modern: Bodoni, Didot  obvious transition between thick and thin strokes  angular (unbracketed serifs)  vertical stress  Slab Serif: Memphis, Rockwell  Slight transitions between thick and thin strokes  Serifs are thick, fat, horizontal  vertical stress

Type - Categories Sans Serif Fonts: Arial, Helvetica, Futura, Franklin Gothic  Without serifs  Usually monoweight: no thick to thin transitions  Large x-height Script Decorative - experimental, graphic

Type - Categories Monospaced - uniform spacing (fixed-width) Proportionately spaced fonts – font rules determine the width of the characters and space around each character (kerning-pairs)

Type - Size  Points (1/72 inch)  Pica (1 pica = 12 points) – often used to measure width  10, 12, 14, 16, 18, 24, 32, 36  X-height: height of lowercase letters excluding ascenders and descenders Web (CSS)  Absolute units (points, picas, millimeters, centimeters, inches)  Relative units (em, ex, pixel, %)

Terminology - spacing Horizontal Spacing  Kerning  Horizontal space between individual letters  Tracking  Horizontal space between all characters (across word, line, column)  Web (CSS properties)  letter-spacing  word-spacing

Terminology - spacing Vertical Spacing  Leading  Vertical Spacing between lines of text  Web (CSS properties)  Line-height

Terminology - leading

Type Legibility  The ease with which type can be understood under normal reading conditions  Clarity and recognition of letterforms, weight and proportion, all caps vs. lowercase, x-height, serif vs. sans serif Readability  The quality of attracting and holding a reader’s interest, the comfort of the read  Type size, letterspacing, word spacing, linespacing, line length

Type

Sources An Introduction to Type  Thinking with Type 