Typographic Syntax

Typographic Syntax
Typographic Syntax is the connecting of typographical
signs to form words and sentences on the page. It is the
process of arranging elements into a cohesive whole. The
elements of (typographical) design include: letter, word,
line, column/margin and grid.
The letter
exists in
various weights, sizes
and shapes. It typically
functions as part of a
word. Individual letters
are frequently combined
into new configurations.
They can act as “signs.”
Letters are visually dynamic
because of the interaction
with white space.
“The material of typography is
the black, and it is the designer’s
task with the help of this black to
capture space, to create harmonious
whites inside the letters as well as
between them.” ADRIAN FRUTIGER
(white space, negative space)
exists within individual
words as in letters. Words
create subtle typographical
connections and rhythms.
These can be achieved by
optically adjusting forms
and spaces and using
consistent counterforms.
This sign (created from 2 dissimilar
letters - A and g) is well-drawn and
considers the interaction between
form-to-counterform (black & white,
n e g a t i v e - p o s i t i v e space).
DESIGNER: GAIL COLLINS
Contrast and repetition create lateral
movement within a word, and the
overall arrangement relates to the
word’s meaning.
DESIGNEER: SERGIO DE JESUS
The word
The repetition of the letter “T” and
the “white space” is balanced and
expressive. A figure/ground reversal
is used in the repetition as well as
contrasting values, shapes and sizes.
DESIGNER: WILLI KUNZ
Celeste Bergin
has the
potential to express an idea,
object or event. They are
independent of the things
they represent. Design
can cause words to signify
and reveal their meaning.
A relationship between
form (black space, positive
space) and counterform
1
The line consists of words
joined to form verbal sentences
and typographical lines.
Configuration and placement
of lines of type are important
structural considerations. A
line of type consists of a single
point size and a single weight
extended horizontally over a
specifc line width. It can be
arranged symmetrically or
asymmetrically. There must
be an established relationship
between individual lines
of type and white space.
Typeface selection, alignments
and spacing should show
connections that are
apparent and distinct.
Columns and margins are balanced
through the use of contrasting type
sizes, typeweights and rules. Each of
the vertical columns separates specific
categories of information to make
them easier to find.
DESIGNER: CARL WOHLT
Type and rules combine to bring
a sense of unity to the page. Rules
(lines) can separate one line of type
from another. Rules can separate
one group of typographic lines from
another. Attention is given to the
recurrence of similar space intervals
and to individual line breaks (the
rhythmic pattern of line endings).
DESIGNER: CHERYL VAN ARNAM
The column and margin interact with their
surrounding spaces. Pages posess form and counterform
relationships too. Three variables relating to columns
govern these relationships: proportion of column height
to width, texture (tactile appearance of type), and tone
(the lightness and darkness of type). Text columns can be
either “horizontal” or “vertical.” Manipulation of these
variables allows the information to be grouped according
to its role in a given layout.It guides the eye methodically
through the space of the page. Vitality and contrast can
be achieved by the placement of an adjoining photo, a
caption or title. Contrasts in column size, shape, texture
and tone are used to distinguish between different kinds
of information and to provide visually luminescent pages.
Margins can frame and contain supportive elements such
as running heads and captions.
Celeste Bergin
The 2-columns are equal in depth.
Vitality and contrast are achieved by
the placement of the photo, caption
and the bar rule. The widths of the
columns are contrasted against the
caption width. Contrasts in column
size, shape, texture and tone are used
to distinguish between different kinds
of information.
2
The typographic
space has an underlying
spatial order. The underlying
spatial order in typographic
design is established by
alignments and form-tocounterform relationships.
Spatial balance and
arrangement of typographic
elements are achieved
through opitcal adjustment.
Optical adjustment is
the visual alignment of
typographic elements; it is
not mathematical. Elements
are balanced against each
other by contrasting visual
properties.
To communicate clearly the designer must stimulate and involve the viewer.
Horizontal and vertical alignments of elements bring order to a dynamic,
asymmetrical design.Texture and tone create a vibrant luminosity. DESIGNER:
WOLFGANG WEINGART
The visual heirarchy is a visual arrangement of elements from the most prominent
to the least prominent in the area of typographical space. Considerations are given to the
relative importance of each element, the
nature of the reader, the environment
where it will be read and the need to create
an unified arrangement of forms. Elements
with similar characteristics have equality in
the visual heirarchy. Elements that have
contrast characteristics enable them to
take dominant and subordinate positions
in the composition. Contrasts include size,
weight, position, color, and spatial interval.
Location within space plays an important
role in establishing an heirarchy.
Celeste Bergin
Visual hierarchy can be achieved through careful contrast
of the elements: size, weight, intervals, position, and color
or value.
3
Zones of information are separated
from one another spatially but the
grid unifies them through visual
alignments. DESIGNER: KEITH JONES
The typographic grid is an adaptation of a structure
that consists of rectangular modules created by a network of
horizontal and vertical lines. Typographic grids exist in a nearly
infinite number of configurations. A grid is the framework
for placing type and images. Grids allow for the distribution
of typographic elements into an intelligible order. Headlines,
text, captions, images, and other parts of the message are
integrated within the grid.It possesses unique characteristics.
Columns and the space between them accommodate text
settings. Spatial zones are a means of organizing the various
parts of information. Margins provide boundaries and
defines the “active” space. They provide a sense of spatial
stability. Margins should be at least as wide as the space between columns. Narrow margins
create tension as typographic
elements interact dynamically
with the edges of the page.
text columns
Wide margins provide a sense
column interval
of calm. The relationships
between these characteristics
spatial zone
and the number of grid
modules are influenced by
the nature of the content,
legibility considerations and
the desired visual effect.
grid modules
Celeste Bergin
margins
The typographic grid is an underlying
structure with features suited to the
physical properties of typographic
elements.
4
Typographic Syntax/History of Typography
Software: Pagemaker 6.5
Skills:
Preparing graphics and photos for placement in publication.
Placing photos, graphics, and text in publication.
Practice using grids as a design method.
Using balance in the page layout composition.
Demonstrating knowledge of text formatting and font style.
Acquire knowledge on the history of typography.
Demonstrate understanding of typographic syntax.
Directions:
For this project write a one page report on any historical aspect of typography. It
can go all the way back to ancient cave paintings, through the Phoenicians, Greeks,
Romans, Middle Ages, Gutenberg, Renaissance, Industrial Revolution, the Bauhous,
the New York Movement and up to today’s computer revolution. Be sure to write
about type and typography!
Specifications:
Text:
1. Font size for body copy can be only 10pt. (13-16pt. leading)or 12pt. (15-18pt. leading).
Captions should be 8pt. to 10pt.
2. Do not use Times New Roman or “hard-to-read” fonts (gothic, script...).
3. Consider the heirarchy of the message (include a heading, subheading and captions as well as body copy).
4. Pay attention to spelling, sentence structure, and punctuation.
5. Indent paragraphs only 3 spaces or, if not indenting leave a double space between paragraphs.
6. U s e
t r a c k i n g !
7. WRITE IN YOUR OWN WORDS!
Document Set-up:
8. Paper size is legal size, 8.5”x14” or 8.5”x11.” It can be in a portrait or landscape orientation.
9. Use picas as measuring system.
10. Margins on the two sides and top can be between 3-6 picas.
11. The bottom margin can be between 6-9 (use 6 for 3 pica margins).
Design:
12. Create a grid on the master page (use a 8, 10, or 12 grid).
13. Use a form of balance to create a page layout design using the grid.
14. Apply principles of typographical syntax.
15. Consider previous projects ideas as well as the design style the report is on.
16. Color or black and white.
Celeste Bergin
5
Images:
A minimum of two (2) placed images:
17. the width of a column of text
18. wrapped with text
19. One image must be a photograph.
20. Save images in the tiff format at 150-300dpi.
21. Do not include complete copy of graphics when placing; click no.
Resources:
22-23. Use at least 2 resources and include a bibliography of what you used. Here are some
suggestions:
A History of Graphic Design by Philip B. Meggs
The Story of Writing by Donald Jackson
A History of Wrting by albertine Gaur
Creative Lettering Today by Michael Harvey
Books found in the library.
Encyclopedias
the internet
Assessment:
Each numbered specification will be assigned a number of points.
This part of the project is worth 100 points.
24. Print out two copies, one for me and one to mat.
Matting is worth an additional 20 points.
25. Leave a 1.5 inch border around design.
26. Mat is 11.5” x 17.”
27. Make clean cuts!
28. Surface is glue free.
Digital File is worth an additional 30 points.
29. Save your history of typography report on your “h” drive when finished printing. I will check
your file for several of the specications: tracking, font size, leading, master page grid, image size/
format, etc.)
Total points for project is 150pts.
Date Due: ____________
(One day grace and then 10pts. per teal day deducted from grade.)
*Please Note: If report is not in your own words you will have to rewrite it.
Celeste Bergin
6