Alphabet. elemental visual signs 26 characters frozen sounds

Similar documents
Adjust the point size

VOICE OF TYPE LECTURE 1

anatomy cap height x-height baseline descender ligature finial terminal ascender spine small capital uppercase counter cross bar lowercase

Typefaces are character sets based on distinct design characteristics.

TYPE ANATOMY jtittle

TYPOGRAPHY. ascender arm (as on the capital T) descender bar (as on the capital H) counter ear (as on the lower case g and r)

MODULE CM 2004 / STAGE 2 / SEMESTER 2 / SESSION Module title Design Principles and Context

Font classification review

jasonjuwono twentyfifteen TYPEDIA _ Typography Encyclopedia

understanding typography

Font Basics. Descender. Serif. With strokes on the extremities of the letters. T Script. Sans-Serif. No strokes on the end of the letters

BASIC ABOUT TYPE TYPO GRAPHY

LESSON 7 Introduction to Typography

Putting type on a page without incorporating typographic principles is merely word processing. Terry Rydberg, Author Exploring InDesign 3

a e yp fi Letterform Anatomy Ascender Shoulder Tittle Bowl Crossbar Stem or Main Stroke Terminal Leg Ascent Line Cap Line Mean Line Baseline

Pre-Venetian or Ancient Humanist or Venetian Transitional Didone Slab Serifs

Graphic Design. shawacademy LESSON 5. summarynotes INTRODUCTION TO TYPOGRAPHY. For further questions visit us online at:

LOGO & BRAND STANDARDS GUIDE

Project 2 reminders: Hand in your typed book summary/response at end of class today. Make sure to include your name and section.

> what is a font? Times New Roman [10 pts] Times New Roman [12 pts] Times New Roman [14 pts] Times New Roman [18 pts] Times New Roman [24 pts]

STYLE AND USAGE GUIDELINES

Typographic. Alphabet. Book. Interactive PDF of typographic rules & terms YOU NEED TO KNOW. Home. Table of Contents

The Evolution of Type. Movable Type: Johannes Gutenberg Early 15th Century

User-Centered Website Development: A Human- Computer Interaction Approach

Modifying Type: effects of a letter change COLDS

INTRODUCING THE Transition family

This file includes FILLABLE FORM FIELDS. Enter your answers and then save the form as a PDF with your name to submit. Ex: 4CChrisJohnson.pdf.

HEL HEL HEL HEL VETIC HEL VETIC HEL HEL VETICA HEL HEL ETICA ETIC VETIC HEL VETIC HEL HEL C VETICA ETI- HEL HEL VETI HEL VETICA VETIC HEL HEL VETICA

section four typography contents introduction...44 helvetica neue...45 bodoni...46 examples of type usage...47 body text examples...

Typography guidelines

5. Text CHAPTER HIGHLIGHTS 10/12/2016 CHAPTER. Text tradition. Codes for computer text. t. Font technologies. Multimedia text.

SUCCESSFUL TYPE? Interface Aesthetics

The building block of a CSS stylesheet. A rule consists of a selector and a declaration block (one or more declarations).

Goudy Old Style & Garamond. A Type Comparison Book by Brittany Hansard

serif: the short strokes that finish off the major strokes of the letterform. bracket: a curving joint between the serif and the stroke

OUR TYPOGRAPHY APPROVED UNIVERS FONTS. Univers 65 Bold Univers 65 Bold Oblique Univers 75 Black Univers 75 Black Oblique

BRAND. For Internal Use Only Not For Use With The Public. For help and guidance on our brand standards, contact

Style guide.

Introduction A global icon needs an iconic logo. Fashion has evolved since 1969, when Gap opened its first store. Our logo has changed with the

JABRA CORPORATION GRAPHIC STANDARDS MANUAL

TYPOGRAPHY. The art of type

Font, Typeface, Typeface Family. Selected Typographical Variables

Web Site Design and Development Lecture 6

Typography One typeface classification

QUICK GUIDE. Graphics Standards & Guidelines University of Nebraska at Kearney

Elements of typographic design

THINGS YOU NEED TO KNOW

Corporate Identity Guidelines

Chapter 12: FORMATTING TEXT

Keyboarding Basics - Teacher Notes

GRAPHIC STANDARDS MANUAL

HURME GEOMETRIC SANS

ASerif. AfbcyE TYPE AND LETTERS

GRAPHIC IDENTITY DESIGN GUIDELINES

Adobe Photoshop CS Design Professional PLACING TYPE IN AN IMAGE

Chapter 8: Rococo Graphic Design 18 th century

Lost & FOUNDRY ABCDEFGHIJKLMNOPQR STUVWXYZ #$ % _ '".,:;!? &(){}[]/\* ABCDEF GHIJKLMNOPQRSTUV

Brand Guidelines. version

Review Question 1. Which tag is used to create a link to another page? 1. <p> 2. <li> 3. <a> 4. <em>

TYPO GRA PHY THE ANATOMY OF TYPE A BRIEF HISTORY OF TYPOGRAPHY WHAT IS YOUR TYPE ACTUALLY SAYING? OPEN FONT DISCUSSION

TYPE BASICS Cartographic Design & Principles Winter 2016

Unit 4. Multimedia Element: Text. Introduction to Multimedia Semester 2

Writing and Document Design Lecture 6 Typography

Center for Genome Engineering

Primary Logo. Corporate logo - primary. The centered logo is only to be used when the length of the common logo is problematic for an application.

Appendix D CSS Properties and Values

DIGITAL PRINT DESIGN (568 )

Chapter 7 Typography, Style Sheets, and Color. Mrs. Johnson

ACSC 231 Internet Technologies

Reading 2.2 Cascading Style Sheets

O M. O M logo specs. O M O M O M O M

IT82: Mul timedia. Practical Graphics Issues 20th Feb Overview. Anti-aliasing. Fonts. What is it How to do it? History Anatomy of a Font

Character Formatting. Formatting the Text in Text Frames

Corporate Identity Guidelines

WCSD Graphic Standards and Logo Use Guide

Typography One typeface classification

Graphics Standards Manual

WATER (No kerning) WATER (Automatic Kerning) WATER (Manual Kerning).

BBN ANG 183 Typography Text colour: vertical and horizontal spacing

Typesetting Tips. Put your best type forward.

LOGO USE GUIDELINES BRAND GUIDELINES PUBLISHED ON FEBRUARY 17,

Franklin Gothic. Seniors: Use larger text that is clear and legible. (Souvenir, Times, Garamond, Helvetica)

8/19/2018. Web Development & Design Foundations with HTML5. Learning Objectives (1 of 2) Learning Objectives (2 of 2)

FLEET LOGO USAGE AND STANDARDS INNOVA BRANDING STANDARDS 2015 GUIDE

art 118: intro to communication design // FALL 2011

Brand Standard Guidelines

Brand Identity Guide

LoremTM. Identity Guidelines (Date)

GO Transit type treatments report

WEB TYPOGRAPHY FOR WEB DEVELOPERS. Matej Latin Lead UX/UI Designer at Autotrader.co.uk

Script for Interview about LATEX and Friends

Basic Elements > Typeface. Contents

pokemon starters and the Classification of Type By: Sarah Cornell

OTTER TAIL COUNTY - MINNESOTA LOGO USAGE POLICY

BRAND GUIDELINES January 2017 leanconstruction.org

CHAPTER 2 Information processing (Units 3 and 4)

Identity Standards The College of New Jersey Exterior Signage and Wayfinding Master Plan

Brand Standards 2014

Adding CSS to your HTML

Trust runs deep. Brand Communications Guidelines. Version 12.1,

Transcription:

Alphabet elemental visual signs 26 characters frozen sounds

Evolution Handwriting > minimum number of strokes Engraving > lowercase > minimum number of curved lines > capitals

Letterforms Appearance of the individual letter: Form White space around: Counterform

Typography II Logotype Forms

Typography II Logotype Forms

Typography II Logotype Forms Combination Letterforms: Deconstruction and reconstruction creates new and potentially meaningful solutions. Shape of exterior form very important.

Typography II Logotype Forms

Letter Height The point system, used to measure the height of a letter as well as the space between lines (leading), is the standard measurement for type. One point equals 1/72 inch or.35 millimeters. Twelve points equal one pica, the unit commonly used to measure column widths.

Height Typography also can be measured in inches, millimeters, or pixels. (A point is roughly equivalent to a pixel.) Most software applications let the designer choose a preferred unit of measure; picas and points are a standard default.

Width The horizontal dimension of a letter is its set width. The set width is the body of the letter plus a sliver of space that protects it from other letters. The width of a letter is intrinsic to the proportion of the typeface. Some typefaces have a narrow set width, and some have a wide one.

Width You can change the set width of a letter by fiddling with its horizontal or vertical scale. This distorts the proportion of the typeface, forcing heavy elements to become thin, and thin elements to become thick. Instead of torturing a letterform, choose a typeface with the proportions you need, such as condensed, compressed, or extended. Type families such as Helvetica, Univers, and Interstate include a variety of widths.

Anatomy of Typography

The cap height is the distance from the top of the capital letter to its bottom. Some vertical elements (ascenders) may extend slightly above the cap height.

The x-height is the height of the main body of the lowercase letter (or the height of a lowercase x ), excluding its ascenders and descenders. The bigger the x-height is in relation to the cap height, the bigger the letters will look.

X-height When two typefaces are set in the same point size, one often looks bigger than the other. Bigger x-heights, introduced in the twentieth century, make a typeface appear larger. Differences in line weight and character width also affect the letters' apparent scale. Mrs Eaves, designed by Zuzana Licko in 1996, rejects the modern appetite for supersized x-heights. The font is inspired by the eighteenth-century designs of John Baskerville.

The baseline Letters sit on baseline It is the most stable axis along a line of text. The curves at the bottom of letters such as a or c hang slightly below the baseline. Commas and semicolons also cross the baseline. If a typeface were not positioned this way, it would appear to teeter precariously, lacking a sense of physical grounding.

Two blocks of text are often aligned on a shared baseline. Example 14/18 Scala and 7/9 Scala (= 14pt letter size on 18 pt leading / line spacing)

When creating letters consider their optical relationships pointed & curved extend beyond baseline and capline OV 2-storied: center bar raised higher than math. center, top narrower: E horizontal strokes thinner H

tight junctions opened M NK width and angles adjusted to look right Q smaller than H, curved strokes thinner

Typeface x Font Typeface: The distinctive, design of an alphabet (and accompanying numbers and punctuation). All point sizes of that typeface. Font: All the letters, numbers and punctuation of a single size of a single typeface (12-point Helvetica)

Font Set of characters of the same size and style containing all the letters, numbers and marks needed for typesetting For example, the complete set of all the characters for 9-point Bulmer is called a font the 10-point Bulmer would be another separate font, but part of parts of the same font family Whereas 9-point Bulmer boldface would be another font in a different font family of the same typeface. One individual font character might be referred to as a piece of font or a piece of type.

Font consists of UPPERCASE/CAPITALS lowercase Small caps Lining Figures: 1234567890 Old-style Figures 1234567890 Fractions 1/2 Ligatures fl fi Punctuation,.?!;: {}[] Symbols @#$%^&*

Visual features of typefaces Serifs Weight Width (expanded, condensed) Posture (Italic, oblique, script) Thick/thin contrast x-height x-height Ascenders & descenders length Stress (axis)

Proportions of the letterforms in different typefaces stroke to height ratio contrast in stroke weight expanded x condensed style x-height & proportion

Serif x Sans Serif A traditional roman book face typically has a small family-- a "nuclear" group consisting of roman, italic, small caps, and possibly bold and semibold (each with an italic variant). Sans-serif families often come in many more weights and sizes, such as thin, light, black, compressed, and condensed.

In the 1990s, many type designers created families that include both serif and sans-serif versions. Small capitals and non-lining numerals (a courtesy traditionally reserved for serif fonts) are included in the sans-serif versions of Thesis, Scala, Quadraat, and many other big contemporary families.

: Anatomy

: Anatomy Typefaces Manufactured images designed for infinite repetition Hand x machine Organic x geometric