TYPOGRAPHY (a teeny tiny introduction)

Slides:



Advertisements
Similar presentations
Typography Typography exists to honor content. — Robert Bringhurst,
Advertisements

More Information on Graphic Design & Color: A few pointers for your websites & other e- publications Dr. Jennifer Bowie.
Typography (The study of font).
Typography Usability & Readability
Document Design: Basics and Typography Technical Communication, DAHMEN.
Design Principles 3.02 Understand business publications.
1.01A – What typefaces should be used for various displays?????
14-Aug-15 Design Principles. Design principles In The Non-Designer’s Design Book: Design and Typographic Principles for the Visual Novice, Robin Williams.
Typography and Space for Web Design Important Issues From Web Style Guide.
WEB DESIGN TIPS FOR DESIGNING A WEB PAGE. PURPOSE OF WEBSITE To inform To persuade To market/sell To entertain To advocate KNOW YOUR PURPOSE!
Unit 4 – Multimedia Element: Text
DHS Graphic Design Typography. Type Alignment There are 5 types of type alignments: – Center – Left aligned – Right aligned – Justified – Or wrapped around.
Design Principles for PowerPoint
Print Medium. • Advantages & Limitations • Typography • Readability • Layout.
Desktop Publishing Your Guide to Concepts and Terminology.
Introduction to Type in Graphic Design AEE 210 Jim Lucas Modified by Luke Reese.
Digital Interactive Media
APA Formatting and Style Guide Purdue OWL staff Brought to you in cooperation with the Purdue Online Writing Lab.
Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's1 Document and Web design has five goals: to make a good impression on readers.
Desktop Publishing.  Desktop publishing is creating documents on a computer that are usually viewed as printed materials. They can also be viewed as.
the rhetorical situation  audience  purpose  context design principles  arrangement  emphasis  contrast  repetition  alignment  proximity (some)
$1 Million $500,000 $250,000 $125,000 $64,000 $32,000 $16,000 $8,000 $4,000 $2,000 $1,000 $500 $300 $200 $100 Welcome.
Document Design ENG 371 Lukowski. Things to Consider Think about your audience and their expectations – How will they read and use your document? – What.
Basic Design SBM 338 Lanny Wilke. Four Basic Design Principles Proximity Alignment Balance Unity.
Introduction to Visual Rhetoric: The Basics Romberger.
Don’t have to be a designer to know when something just ain’t right…
Designing Reader- Focused Documents C H A P T E R 10.
Introduction to Visual Rhetoric. Visual Rhetoric Definition Is the “how to” of visual literacy Visual rhetoric applies the rhetorical situation to decision.
Unit 1: Graphics are all around us Design Graphic.
Rules of Typography Comm 300. Alignment Remember the rule “If you can align, do.” Try to align everything with something. Equally space text away from.
Typography The Science of Text. Fonts Style of type How many fonts in a document? Conservative--one font Typical--two fonts Use a third for emphasis.
March 2004Andrea Infantino©Copyright Jan 2006Adapted from A.Infantino©Copyright 2004 Visual Literacy A Critical Key to Effective Communication.
Chapter 8 Print Type © 2013 Cengage Learning. All Rights Reserved. May not be scanned, copied or duplicated, or posted to a publicly accessible website,
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.
Digital Interactive Media
Digital Interactive Media
Digital Interactive Media
Page Design and Elements
Digital Interactive Media
Understanding and Applying Typography in CSS
Typography Usability & Readability
Basic Design Principles and Hazards to Avoid
Chapter 8 Print Type © 2017 Cengage Learning®. May not be scanned, copied or duplicated, or posted to a publicly accessible website, in whole or in part.
Chapter 8 Print Type © 2013 Cengage Learning. All Rights Reserved. May not be scanned, copied or duplicated, or posted to a publicly accessible website,
INTRODUCTION TO TYPOGRAPHY DESIGN
Applying Typography in CSS
Chapter 9 Layout and Design
Understanding and Applying Typography in CSS
Basic Design Principles and Hazards to Avoid
Document Design is CRAP
Understanding Typography
Layout Terms Visual Hierarchy
The Art of Type 9/17/2018.
Chapter 8 Print Type © 2013 Cengage Learning. All Rights Reserved. May not be scanned, copied or duplicated, or posted to a publicly accessible website,
Contrast Repetition Alignment Proximity
INTRODUCTION TO TYPOGRAPHY DESIGN
INTRODUCTION TO TYPOGRAPHY DESIGN
Digital Interactive Media
Design Principles 8-Dec-18.
INTRODUCTION TO TYPOGRAPHY DESIGN
Typography Usability & Readability
Design Principles 5-Apr-19.
Don’t have to be a designer to know when something just ain’t right…
Typography.
INTRODUCTION TO TYPOGRAPHY DESIGN
Digital Media Notes Your Name.
Typography Usability & Readability
INTRODUCTION TO TYPOGRAPHY DESIGN
INTRODUCTION TO TYPOGRAPHY DESIGN
Presentation transcript:

TYPOGRAPHY (a teeny tiny introduction)

A variety of letterforms

professional typefaces include multiple weights

Terms

DO

clarity and readability. Edit your writing for clarity and readability. Be aware that text format, clarity and readability is different in a 1-page design layout than it is in an a school paper, article, or book. The imagery, layout and words work together to create meaning. DO: edit your text

Contrast (Variety) Repetition (Unity) Alignment Proximity DO: use the principles of contrast, repetition, alignment and proximity

BEFORE and AFTER applying the principles of contrast, repetition, alignment and proximity

Many designs use 3 typefaces to achieve contrast while maintaining unity. For example: a display typeface for the main title or heading, a san serif typeface for sub headings, and a serif typeface for body copy or longer text sections. DO: use up to 3 typefaces, but not more (yet)

DO: experiment pairing serif and sans serif typefaces

Hierarchy of the content Determine the Hierarchy of the content DO: use hierarchy

DO: use hierarchy

DO: use hierarchy

DO: use hierarchy

DO: design how space is used in your work. Arranging and organizing space is the strongest tool in design layout.

DO NOT DO

USE CAPITAL LETTERS TO CREATE CONTRAST IN HEADINGS OR OTHER SHORT PHRASES, BUT AVOID USING ALL CAPITAL LETTERS WHEN YOU HAVE A LOT TO SAY (PARAGRAPHS OR BODY COPY), BECAUSE WE TIRE OF READING THEM. THEY ARE HARDER FOR US TO READ — REALLY. DO NOT: use caps for more than a short phrase

Using the type tool to create an underlined word can often make the type difficult to read because it interferes with the letters and makes the text feel crowded. This is a problem because often underlined words are used for emphasis or they contain important information; we need to be able to read this information. DO NOT: use the underline tool

DO NOT: use script or other difficult to read type styles / typefaces for more than a short phrase

DO NOT: create a design layout that unintentionally resembles a research paper. Break up your text. Avoid 12pt Times Roman. Remember that image, layout, and words work together.

can be difficult to read as well. This is especially true Centered alignment can be difficult to read as well. This is especially true if there is a variety of line lengths. DO NOT: use centered alignment for long passages of text.

There is no perfect type size. Type that is too big for You will need to print your work to see how it will look. Type that is too big for the context looks strange, but type that is too small cannot be read. Consider all the eyes that need to read your message.

DO NOT: use stretched type DO NOT: use stretched type. It indicates a novice designer or a lazy designer.

DO NOT: use borders

Hyphe-nation and other strange breaks in lines of text like this. DO NOT: use hyphenation or line breaks that leave a single word isolated on its own line.

The Worst Hyphen- ation is in Titles

DO: use vertical orientation where the letters are rotated (ex: type on the left) DO NOT: use vertical orientation where the letters loose their proper relationships (ex: type on the right)

Handwriting A font is not handwriting; write it. DO NOT: use handwriting fonts. If you want handwriting, use handwriting.

Jessica Hische PSA

FLOW

Can you draw a simple path from the first element you want to “read” (image or text) to the next… to the next… to the next…

This is not a good layout because the eye has to go to each corner to gather information. There is not one clear line for the eye to follow.

using the tools