a mushtaq

  • Subscribe to our RSS feed.
  • Twitter
  • StumbleUpon
  • Reddit
  • Facebook
  • Digg
Showing posts with label Typography. Show all posts
Showing posts with label Typography. Show all posts

Saturday, 10 November 2012

History of Typography: Part Five

Posted on 07:06 by cena
Part Five of the History of Type series at http://ilovetypography.com/2008/06/20/a-brief-history-of-type-part-5/

Very helpful, educational and easy to understand. Really shown the progression of type

//




A Brief History of Type—Part 5

SLAB SERIF / EGYPTIAN
WELCOME TO THE EARLY 1800s and the birth of the Slab Serif, otherwise known as Egyptian, Square Serif, Mechanical or Mécanes. What’s with the name Egyptian? Upon Napoleon’s return from a three year Egyptian expedition and publication in 1809 of Description de l’Égypt, Egypt was all the rage, and it appears that type founders simply used a term that was on everyone’s lips, a term that was in vogue. The nomenclature has absolutely nothing to do with Egyptian Hieroglyph Slab Serifs—because there’s no such thing.
egyptian or slab-serif

Like the industrial revolution, the Slab Serif was born in Britain, and was no doubt inspired by a new wave of advertising, and those beefy letter forms that could be found on just about every billboard, pamphlet, and poster of the day. Until this time, type was designed to serve one purpose—it was designed for long stretches of texts, for books. But with mechanisation, and major innovations in printing technology (e.g. the Steam Press, 1814), advertisers in particular were looking for a type that stood out from crowd; a type that shouted, look at me! Thus was born the the display face—type for use at large sizes, for short bursts of copy.
…there is sometimes a lack of understanding of the fundamental difference between types designed for display and types meant for text. The difference can be expressed as a maxim: text types when enlarged can be used for headings; display types, if reduced, cannot be used for text setting.—Walter Tracy**
Those posters were a riot of big type, often a half-dozen different styles on a single page. If the Didones are a lissom Audrey Hepburn, then the Slab Serifs are those guys one sees all too often on construction sites around the globe—trousers half-way down their posteriors. What I’m getting at is that the early Slab Serifs weren’t discreet. They were designed to be noticed.
The Slab Serif or Egyptian is also home to further subsets of typeface styles, like the Fat Faces which are fundamentally Didones (or Moderns) on steroids. Take a Modern style typeface, give its thicker strokes even more weight, triangulate some of those serifs, and you have a Fat Face. You might be familiar with types like Poster Bodoni. Bodoni is of course a Modern style type but, carrying all that extra weight, it’s a Fat Face. The Fat Face, then, is basically an Obese Didone.
fat face
If, as some commentators remarked, the Didones were parodies ofBaskerville’s types, then the Fat Face types are parodies of parodies. The first Fat Face was designed by Robert Thorne (c. 1800), who was also responsible for coining the term Egyptian to describe what is generally known today as the Slab Serif.*
fat face (photo by Michi)
By the mid-1800s, another sub-set of the Slab Serif class of types began to emerge—the Clarendons. They were an attempt to reign in some of the extravagences of the Fat Face display types, making them fit for use as text faces. Contrast was reduced, the serifs thinned somewhat and up with the x-height for legibility at those smaller sizes.
clarendon
Strictly speaking an ‘authentic’ slab serif has unbracketed serifs (an abruptserif that meets the stem at a 90° angle), though there are numerous examples that come with bracketed serifs. Then, of course, come the Geometric Slab Serifs that look like the early Sans Serif types with the serifs broken off.
The Geometric is a twentieth-century riposte to the Antique. Informed by the same kind of rationalist thinking that inspired the great sans serifs of the Bauhaus, Geometrics abandon traditional forms in favor of mathematical strategies.—Jonathan Hoefler

The Slab Serif Today

There are thousands of slab serif types available today; some are simply digitised oldies; others are sans serifs and geometric sans serifs with slab serifs stuck on; others still, rise above the crowd and bring something fresh to this style of type.
archer, the elegant slab serif
Archer from H&FJ is perhaps one of the best slab serifs for setting extended text. It comes in numerous weights, has an excellent italic accompaniment, and just looks damn good. And, of course, the heavier weights and caps work beautifully for display.
One of my other favourite slab serifs is Erik Spiekermann’s Officina Serif, a very robust, very legible type that just doesn’t break—you could print it on toilet paper, and it would still look good (no, I haven’t tried). If you don’t have Officina Sans and Officina Serif in your type library (or you have a stolen version), then I strongly recommend you purchase a license—it’s a simple type that will never let you down.

Typewriter Types

Just about every typewriter face is a Slab Serif. There are hundreds to choose from, from Courier to ITC American Typewriter immortalised in Milton Glaser’s I ‘Heart’ New York logo.
i love ny logo ITC american typewriter
The heavy-weight, no-nonsense serifs of the typewriter types are well-suited to this particular form of printing, and perform well on even the poorest quality paper.
We’ve taken just a very brief look at the Slab Serif. Upon completion of this series, a more comprehensive version will be included in the free PDF.
So what do you think of the slab serif? Do you have your personal favourites? In part six of A Brief History of Type we move on to the Sans Serifs, so stay tuned.
 

Footnotes:
* To confuse things, the Slab Serif types were initially called Antique; confusing—now—because, Sans Serifs are also referred to as Antique. See pages 80-81 of Walter Tracy’s Letters of Credit—a view of type design.
**Ibid., page 27
Read More
Posted in OUGD504, Typography | No comments

History of Typography: A Brief History

Posted on 07:03 by cena
Part 4 of the History of Type series at http://ilovetypography.com/2008/05/30/a-brief-history-of-type-part-4/

//


A Brief History of Type

PART FOUR: MODERN (DIDONE)
IN THE PREVIOUS INSTALLMENT of this series, we took a closer look at Transitional style typefaces, so-called because they mark a transition from the former Old Style types—epitomized by Baskerville—and the subject of today’s brief history, the Moderns, also known as Didone (the terms Modern and Didone are used synonymously throughout this article).
Baskerville’s types, compared with their Old Style (or Garalde) predecessors, are marked by high contrast between thick and thin strokes, so much so that one commentator declared Baskerville was “blinding the nation.” The Moderns or Didones take this contrast to further extremes (just about as far as one can take them).
The first Modern typeface is attributed to Frenchman Firmin Didot (son of François-Ambroise Didot), and first graced the printed page in 1784. His types were soon followed by the archetypal Didone from Bodoni. The Italian type designer, punchcutter and printer Giambattista Bodoni (what a great name! [1740-1813]) drew his influence from the Romains du Roi (with its flat, unbracketed serifs) and the types of John Baskerville (high contrast), for whom he showed great admiration.
Bodoni Manuale Tipografico

Bodoni will forever be associated with the hordes of digital interpretations from just about every type foundry on earth—the FontBook devotes some 14 pages to flavors of Bodoni; some are faithful digital renderings, others well-crafted interpretations; while others still are nothing but parodies, suitable only for poster headlines or the typographic scrap-heap. However, Bodoni was a prolific type designer, completing hundreds of typefaces; the Museo Bodoniano in Parma, houses more than 25,000 of his punches! Bodoni’s Manuale Tipografico¹ (1818) contains 142 roman typefaces and their corresponding italics—and that’s just volume one. The second volume includes numerous ornaments, Arabic, Greek, Russian, and Tibetan types, to name but a few.

Characteristics

1. High and abrupt contrast between thick and thin strokes;
2. Abrupt (unbracketed) hairline (thin) serifs
3. Vertical axis
4. Horizontal stress
5. Small aperture
didot / modern traits
In fact, if you grab a Baskerville, take away the brakets that join serifs to stems, thicken up the vertical strokes, you’ll be left with something that resembles a Didone (though don’t expect it to be pretty).
baskerville and bodoni
If you’ve read the preceding three installments, then you will have noticed a move away from the Humanist or handwritten letterforms. The romans of the Modern types owe very little, if anything to the earlier calligraphic forms; they are too precise, too sharp, too clean. Whereas the Old Style types are Neoclassical, the Didones are Romantic. Though both forms share a common vertical (rationalist) axis, the Moderns have even greater contrast.

What are they good for?

There’s something rather clinical about the Moderns, especially in the roman capitals. Their vertical axis coupled with strong horizontal stress furnishes them with the stiffness of toy soldiers on parade. They are elegant, and like all things elegant, look unhurried, calm, and in control. They’re generally not suited to setting extended text, as the verticality of the letter forms interferes with the text’s horizontal rhythm. The letters don’t lead our eyes across the page, but rather up and down. Unsurprisingly, Bringhurst brings some clarity to the subject when he writes,
Romantic letters can be extraordinarily beautiful, but they lack the flowing and steady rhythm of the Renaissance forms. It is that rhythm which invites the reader to enter the text and read. The statuesque forms of Romantic letters invite the reader to stand outside and look at the letters instead.²
The Moderns need lots of space (white space and inter-line space), so give them extra leading and  generous margins; and if you pair a Modern with another face, then make sure it’s not a fussy one, or your page will look like a circus poster designed by a visually impaired dog. If you know the beautiful, yet austere architecture of Tadao Ando, then mixing a Didot with, say a Blackletter is akin to draping one of Ando’s monoliths in a giant lace doily.
Erik Spiekermann, in Stop Stealing Sheep, recommends ITC Bodoni as “much better at small sizes than all the others.”³

Modern-day Moderns

Open just about any fashion magazine, and you’ll spot a Didone. If it’s a premium brand (read “very expensive”), then it may well be brought to you on the back of Bodoni or Didot. Not being a subscriber to any fashion titles (you’d understand if you saw my wardrobe), I took a trip to my local café and snapped about 100 examples of Modern types. Here are just a few:
modern-day moderns
And of the many modern interpretations, these are three of my favourites. The beautifully crafted Didot from Jonathan Hoefler,
H&FJ\'s beautiful Didot
Ambroise from Jean François Porchez (also used to set today’s masthead),
ambroise from Jean Francois Porchez
and Moderno FB,
moderno fb
Here are four Didone m’s compared:
didone comparison
And here are some other notable Moderns: ITC Fenice (I’m not a fan of this one), ITC Zapf Book, Adobe New Caledonia (actually pretty good for extended text), ITC Bodoni*, and Günter Gerhard Lange’s  Berthold Walbaum (a little wider set than your average Didone).
Well, I’ve only just scratched the surface, but I hope that this has given you a taste of the Moderns. In part five, the serif pendulum swings to the opposite extreme when we consider Slab Serifs.
Footnotes:
1 You can see the entire book online at Rare Book Room.
2 The Elements of Typographic Style, page 130.
3 Stop Stealing Sheep & Find Out How Type Works, page 83.
* See The Typographic Revolution—Porchez Typofonderie.
Read More
Posted in OUGD504, Typography | No comments

History of Typography: Transitional

Posted on 07:01 by cena
Part three of the History of Type series, very interesting and easy to understand. I've often found researching type through books and the internet can be overwhelming, there's SO much to it.

//

History of typography: Transitional

PART 3: SIÈCLE DES LUMIÈRES
Welcome to part three of our Type Terms series. In part one we travelled all the way back to the 15th century to take a closer look at the Humanist or Venetian style types with their distinctive lowercase ‘e’ (remember that sloping crossbar?). In part two we considered the Old Style or Garalde types and also discovered how this era gave birth to the first italic type in 1501.
Today we’ve moved along the time-line to the cusp of the 18th century, the start of a period in history that we now refer to as the The Enlightenment, a time that was to sow the seeds of revolution in France, North America and beyond. But today we stand in the cobbled streets of 17th century France; Louis XIV is on the throne and Jacques Jaugeon is working on what is now considered to be the first Transitional (or Neoclassical) style typeface, theRomain du Roi or King’s Roman, commissioned by Louis XIV for theImprimerie Royale in 1692.
Roman du Roi

The Romain du Roi marked a significant departure from the former Old Styletypes and was much less influenced by handwritten letterforms. Remember, this is the Age of the Enlightenment, marked by resistance to tradition, whether that be art, literature, philosophy, religion, whatever; so it’s no surprise that this same era should give birth to radically different types.
The Romain du Roi is often referred to as Grandjean’s type, but the designs were produced by a committee* set up by the French Academy of Science. One of the committee members, Jacques Jaugeon — at that time better known as a maker of educational board games — in consultation with other members, produced the designs constructed on a 48×48 grid (2,304 squares). The designs — also known as the Paris Scientific Type — were engraved on copper by Louis Simmoneau, and then handed to the punchcutter Grandjean (not to be confused with the earlier Granjon of course), who began cutting the type in 1698. Interestingly, Jaugeon also designed a complimentary sloping roman (often referred to today as an oblique) as an alternative to a true italic**. However, Grandjean himself was to produce the italic from his own designs.
The principal graphic novelty in the ‘Romain du Roi’ is the serif. Its horizontal and unbracketed structure symbolizes a complete break with the humanist calligraphic tradition. Also, the main strokes are thicker and the sub-strokes thinner…. — Letter Forms, page 23, Stanley Morison
The first book to use these types wasn’t published until a decade later in 1702. In fact the full set of 82 fonts wasn’t completed until half a century later in 1745.

Baskerville of the Types

The Englishman John Baskervile is a fascinating character, and reading about him is like reading the biography of two men in one. Space doesn’t permit to list all of his achievements; suffice to say that he always strove to improve upon existing methods and materials, whether that be in his recipes for new inks, or his finer quality glossy papers.
[Baskerville] was not an inventor but a perfector….He concentrated on spacing. He achieved amplitude not merely by handsome measurement but by letting in the light.—Type, the Secret History of Letters, Simon Loxley, page 54 (quoting from English Printed Books)
“Baskerville has less calligraphic flow than most earlier typefaces”***, and this can be said of just about all the Transitional Style types. Whereas the earlier Humanist and Old Style types owed much to the handwritten letter form, the pen’s influence has all but disappeared in the Transitional types. The following is a detail from one of Baskerville’s type specimens:
Baskerville specimen
During Baskerville’s lifetime his types had little influence in his home country. However, In 1758 Baskerville met Benjamin Franklin who returned to the US with some of Baskervilles’s type, popularising it through its adoption as one of the standard typefaces employed in federal government publishing. Franklin was a huge fan of Baskerville’s work, and in a letter to Baskerville (1760) he enthusiastically defends Baskerville’s types, recounting a discussion he had with an English gentleman who claimed that Baskerville’s ‘ultra-thin’ serifs and narrow strokes would blind its readers.
Franklin mischievously tore off the top of a Caslon specimen (to remove any mention of Caslon, of course), and showed it to the gentleman, claiming that it was the work of Baskerville. The gentleman examined the specimen, and thinking that it was indeed a Baskerville specimen, started to point out the worst features of ‘Baskeville’s’ type.
Another notable character from this period in type history is Pierre Simon Fournier who developed the ‘point’ system (Fournier Scale), and also designed and cut his own type. William Caslon is yet another notable figure, though his types were based on the Dutch Old Style; however, some modern interpretations of Caslon’s types would sit more comfortably in Transitional.
Whereas Caslon’s letters are thoroughly Baroque, Baskerville’s are thoroughly Neoclassical.—A Short History of the Printed Word.

Characteristics

1 Vertical or almost vertical stress in the bowls of lowercase letters. (See alsoA Short History of the Printed Word, Chappell & Bringhurst, pages 160-161):
stress
If you read parts one and two, you may well have noticed a trend here: with the stress, like the minute-hand moving from the humanist axis to rationalist axis at 12 o’clock. (Tip: if you’re trying to approximate the angle of stress, pick the lowercase ‘o’ and draw a line through the two thinnest sections [the actual stress is the fattest parts of the stroke]).
2 greater contrast between thick and thin (sub-) strokes:
stroke width contrast comparison
3 Head serifs generally more horizontal:
head serifs
It’s worth noting that the above characteristics are guides only. Modern-day revivals of these types vary in their ‘authenticity’.

Examples

Baskerville (many flavours), Bookman (Linotype), Cheltenham (ITC), Clearface (ITC), Fournier, Joanna, Slimbach (ITC)
And in a brief Back to the Future moment, here’s Baskerville in the 21st century, seen here in the retailer Habitat’s logo (set in Fry’s Baskerville):
habitat logo

Exercise

Spot the odd ones out. Three of the following are not generally considered to be Transitional style types. Which ones are imposters?
(a) ITC Zapf International | (b) Sabon | (c) Times Europa | (d) Melior
(e) Bodoni | (f) Caledonia | (g) Old Style 7 (Linotype)
Remember, the screen is one place to compare type, but not the best place. Why not take an Old Style type like Bembo and a Transitional like Baskerville and print some of the letters as large as you can—one per single A4 sheet of paper. Also print out some sample body text in each typeface, say, at 9 or 10 point, to determine differences in the colour of the type (the relative darkness or lightness of the type when viewed en masse).
There is so much more to be said about this period in type history, but if you have to scroll any further, your mouse wheel will probably seize. The expanded version of this and all the other articles in this Type Terms/Type History series will be available for download as a PDF (approximately 60 pages).
In part four we’re going to look at the Modern types.


Read More
Posted in OUGD504, Typography | No comments

History of Typography: Old Style

Posted on 06:58 by cena
Part two of the History of Typography series at http://ilovetypography.com/2007/11/21/type-terminology-old-style/


//


History of typography: Old StyleGRIFFO TO CASLON

In the first part of this series, we looked at Humanist typefaces; we considered them in their historical context, and took a closer look at some of their distinguishing features and modern-day revivals. Today we’re moving along the time line and will spend a little time familiarising ourselves with some wonderful Old Style typefaces.
Humanist types, we discovered, have strong roots in calligraphy. Old style types, although they owe much to the same roots, show a marked departure from simply mimicking the handwriting of earlier Italian scholars and scribes. It’s from this period, that we can really see type getting into gear. It’s certainly one of the most exciting periods in type history.
old style characteristics

Old Style traits

The Old Style (or Garalde) types start to demonstrate a greater refinement—to a large extent augmented by the steadily improving skills of punchcutters. As a consequence the Old Style types are characterised by greater contrast between thick and thin strokes, and are generally speaking, sharper in appearance, more refined. You can see this, perhaps most notably in the serifs: in Old Style types the serifs on the ascenders are more wedge shaped (figure1.1).
Another major change can be seen in the stress of the letterforms (figure 1.2) to a more perpendicular (upright) position. You may remember our old friend, the lowercase e of the Humanist (Venetian) types, with its distinctive oblique (sloping) crossbar; with Old Style types we witness the quite sudden adoption of a horizontal crossbar (figure 1.3). I spent quite a time trying to discover why the lowercase e should change so dramatically. After searching high and low, and opening just about every type book I own, I decided to post the question on Typophile. Space doesn’t permit to recount the entire tale here, but for those interested in such details, then head on over to theTypophile e crossbar thread. (Thanks to Nick Shinn, David et. al. for their valuable input).

The First Italic Type

And, as we’re on the topic of dramatic changes, during this period we see the very first italic type in 1501. They were first created, not as an accompaniment to the roman, but as a standalone typeface designed for small format or pocket books, where space demanded a more condensed type. The first italic type, then, was conceived as a text face.
Griffo’s contribution to roman type include an improved balance between capitals and lowercase, achieved by cutting the capitals slightly shorter than ascending letters such as b and d, and by slightly reducing the stroke weight of the capitals.
—A Short History of the Printed Word, Chappell and Bringhurst, page 92
The Old Style types can be further divided into four categories as in the figure below, and span the roman types from Francesco Griffo to William Caslon I. Unlike the relatively short-lived Humanist faces, the Old Style faces held sway for more than two centuries; a number of them are still popular text faces today.
old style chart
Typeface names in red; notable figures below.

Old Style faces

And here are some more Old Style faces: Berling, Calisto, Goudy Old Style,Granjon, Janson, Palatino, Perpetua, Plantin, Sabon and Weiss, to name but a few.
humanist-vs-old-style.png
So have you enjoyed our brief introduction to the Old Style types? For those of you who would like to test your knowledge, which of these is generally classified as Old Style:
Times New Roman, Baskerville, Concorde, ITC Cheltenham
And, for the type-masochists among you (I fear you are in the majority), here is some Old Style homework:
1. Where does the term Garalde originate?
2. Who commissioned Claude Garamond to cut the grecs du roi?
3. Most modern-day italics are not based on the first Aldine italic (1501) cut by Griffo. What are they modelled on?
4. What is the meaning of the term “Humanist axis”?
5. Owing to a bit of a mix-up, the Janson typeface is named after Nicholas Janson. Who should it be named after?
If you know the answers, then comment away; if you don’t have a clue, then no need to worry. I thought that by posing these questions, everyone could get involved, and that way we can all learn something.
In part three, we’ll take a look at Transitional typefaces. I hope that you’re enjoying the series, thus far. If you have any comments or suggestions, then get typing in the comments section below.
I’ll be in the UK for the next couple of weeks, so won’t be posting so often. However, upon my return we’ll be back to normal. There’s a whole lot more type lovin’ to come, so stay tuned.
footnote divider
Read Part Three: Transitional Style
Read More
Posted in OUGD504, Typography | No comments

History of Typography: Humanist

Posted on 06:55 by cena
http://ilovetypography.com/2007/11/06/type-terminology-humanist-2/

Really interesting and educational source of information on the history of type. I thought it's definitely worth documenting and keeping close for reference on this blog for the type workshop's we're doing at the moment.

Part one...

//


History of typography: Humanist

Every subject, from dentistry to dog handling has its own vocabulary — terms that are peculiar (unique) to it. Typography is no exception. Learning the lingua franca (lingo) of type will make typography that much more accessible; and that will, in turn, lead to greater understanding, and hopefully a greater appreciation for all things “type”.
Today we’re going to take a look at just one of those terms, namely “Humanist”. You may have come across this term before (or you may even be thinking, what the hell’s that?). The term Humanist is part of the nomenclature that describes type classification. During the 1800s a system of classifying type was derived, and although numerous other systems and subsets of this system exist, this basically is it:
Humanist | Old Style | Transitional | Modern
Slab Serif (Egyptian) | Sans Serif
By the end of this six-part series, you will be quite au fait with all of these terms; and just imagine the joy you will experience when you proudly exclaim to the delight of your spouse, girlfriend, boyfriend, neighbor, guy at the corner shop,
Look at that Humanist inspired type! Note how the bar of the lowercase “e”….
So, without further ado, let’s begin our journey — a journey that will take us from the incunabula to the present day.
[Incunabula] can refer to the earliest stages in the development of anything, but it has come to stand particularly for those books printed in Europe before 1500. — A Short History of the Printed Word
The model for the first movable types was Blackletter (also know as Block,Gothic, Fraktur or Old English), a heavy, dark, at times almost illegible — to modern eyes — script that was common during the Middle Ages. Thankfully, types based on blackletter were soon superseded by something a little easier to read, (drum roll…)—enter Humanist.
gutenberg-bible-detail-page1.jpg
The Humanist types (sometimes referred to as Venetian) appeared during the 1460s and 1470s, and were modelled not on the dark gothic scripts liketextura, but on the lighter, more open forms of the Italian humanist writers. The Humanist types were at the same time the first roman types.
jenson.jpg

Characteristics

So what makes Humanist, Humanist? What distinguishes it from other styles? What are its main characteristics?
1 Sloping cross-bar on the lowercase “e”;
2 Relatively small x-height;
Humanist characteristics
3 Low contrast between “thick” and “thin” strokes (basically that means that there is little variation in the stroke width);
4 Dark colour (not a reference to colour in the traditional sense, but the overall lightness or darkness of the page). To get a better impression of a page’s colour look at it through half-closed eyes.

Examples

And here are some examples of Humanist faces:
Jenson, Kennerley, Centaur, Stempel Schneidler, Verona, Lutetia, Jersey, Lynton.
centaur1.gif
Although the influence of Humanist types is far reaching, they aren’t often seen these days. Despite a brief revival during the early twentieth century, their relatively dark color and small x-heights have fallen out of favor. However, they do deserve our attention — our admiration even — because they are, in a sense, the great grand parents of today’s types.
Grab your passports and pack your toothbrushes because in part two we’re off to Venice to take a closer look at “Old Style” type. For those of you interested in testing your knowledge, can you tell which of the following are not generally considered to be Humanist types:
Erasmus, Times New Roman, Caslon, Cloister, Guardi, ITC Garamond

Read More
Posted in OUGD504, Typography | No comments

Thursday, 25 October 2012

Thinking With Type

Posted on 11:55 by cena
Source: http://www.thinkingwithtype.com/contents/letter/

Some information for myself, to educate me on type, an area I really want to investigate this year and also for Graham's type sessions. The sourced article was very educational and I plan on reading over this regularly till it's engraved in my brain.


Some notes:

OVERHANG - Curved letters often hang a little bit lower than the baseline, as do commas and semi-colons. If they sat on the baseline like other letterforms, rounded letters would look smaller than their flat-footed counterparts

Most typeface aren't divided exactly in half like how kids handwriting books used to teach you to write. The x-height usually occupies a little bit more than half of the cap-height. In a field of text, such a sentense the most density occurs between the baseline and the x-height.

CAP HEIGHT - length from baseline to top of capital letter

ASCENDER HEIGHT - Some elements such as ascenders sometimes progress a little bit beyond the cap height.




HELVETICA 9/8 = Helvetica 9pt with 8pt line spacing.


1 point = 0.35 millimeters

1 point = 1/72 inches.

72 point = 1 inch

1 pica = 12 point

Picas are often used to measure column widths.


A Typeface is measured from the top of the capital-letter (cap-height) to the bottom of the descender (descender height) 


When setting type, in metal type. The pt size is the size of the metal slug NOT the size of the actual letterform itself. - this is why sometimes fonts look very different in size even though they're the same point size.


SET-WIDTH : The body of the letter plus a sliver of space next to it to protect it from the letters around it like a buffer.

So for example when you have condensed typefaces. They have narrower set-widths.



x-heights affect the visual effect of a typeface and can make it seem larger than it is, often more delicate and 'decorative' fonts have a smaller x-height than assertive and bold fonts such as Helvetica.


TYPE CLASSIFICATION: HUMANIST/TRANSITIONAL/MODERN - GEOMETRIC

Serif:

Humanist - emulating classic calligraphy, such as Claude Garamond typefaces of the 15th and 16th century

Transitional - Roots in the 18th century. Usually have slightly sharper serifs and more of a vertical axis. The apex of the A's is often sharp, instead of having a little lip like the Humanist typefaces. e.g. Baskerville

Modern - Roots in the 18th and 19th century. Radically abstract from Humanist and traditional forms. Have straight unbracketed serifs. With thicker strokes than previous classifications and more difference between thick and thin strokes. e.g. Bodoni


Egyptian/Slab Serif - More decorative fonts introduced in the 19th century. More bold and have heavy slab-like serifs. They also have less thick/thin strokes with the strokes pretty much even throughout. e.g. Clarendon/Rockwell


Sans-Serif typefaces became common in the 20th century.

Sans Serif:

Humanist: Still referencing the roots in humanist typefaces such as Garamond. For example Gill Sans designed in 1928 has humanistic characteristics. Calligraphic variations in line weight.

Transitional: Helvetica designed by Max Miedinger in 1957 is an example of a transitional typeface and is similar in some ways to the transitional serif fonts of the 18th century such as Baskerville. High x-height and use of the teardrop a.



HANGING QUOTATION MARKS - These are quotation marks which hand off the copy, and enter into the margin so it doesn't carve out chunks of white space from the edge of your paragraph.

To make a hanging quotation mark, insert a word space before the quotation mark. Pressing the option key, use the left arrow key to back the quotation mark into the margin. You can also use the Optical Margin Alignment or Indent To Here tools.




PUNCTUATION:
Use TAB to indent, not space. HTML doesn't even understand a double space.

EN SPACES - A space a bit more pronounced than a word space. Good for separating a sub-heading from the text that follows.

EM DASHES - A dash which is one EM wide. So it's as wide as the pt size of the typeface you're using.

HATCH MARKS - Prime and Hatch marks are often used for feet and inches. Be careful not to use apostrophes or quotation marks in these instances or single quotation marks.




The first step in designing a typeface is to define a basic concept. Will the letters be serif or sans serif? Will they be modular or organic? Will you construct them geometrically or base them on handwriting? Will you use them for display or for text? Will you work with historic source material or invent the characters more or less from scratch? The next step is to create drawings.


Begin by drawing core letters such as o, u, h and n. Allowing you to build the core visual style and come to terms with the curves and general rules and logic to the typeface.



FONT FORMATS

Purchasing fonts from type foundries such as : Adoba and FontShop.



POSTSCRIPT TYPE 1 - was developed for computers in the 1980s. Type 1 fonts come with two files, a screen font file and a print font file, install both to use properly.

TRUETYPE: Created by Apple and Microsoft for use with their OS. Single file font instead of two like with Type 1.

OPENTYPE: Developed by Adobe, works on multiple formats. Each file supports up to 65,000 characters. in Truetype and Type 1, small caps, ligatures and other special characters must be contained in separate font files but this isn't a problem with Opentype. You can get some "PRO" Opentype fonts which have even more stuff in them.




TYPEFACE OR FONT? 
Typeface is the design of the font. Font is the delivery mechanism. In setting type, the font is the metal is the cast metal printing types. In digital, font is the software which allows you to install and output the font.








/////







Letter

Anatomy

Anatomy: How Letters Sit on a Line

Size

height 
Attempts to standardize the measurement of type began in the eighteenth century. The point system is the standard used today. One point equals 1/72 inch or .35 millimeters. Twelve points equal one pica, the unit commonly used to measure column widths. Typography can also be measured in inches, millimeters, or pixels. Most software applications let the designer choose a preferred unit of measure; picas and points are standard defaults.

Nerd Alert: Abbreviating Picas and Points
8 picas = 8p
8 points = p8, 8 pts
8 picas, 4 points = 8p4
8-point Helvetica with 9 points of line spacing = 8/9 Helvetica
width
A letter also has a horizontal measure, called 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 proportions and visual impression of the typeface. Some typefaces have a narrow set width, and some have a wide one. You can change the set width of a typeface by fiddling with its horizontal or vertical scale.This distorts the line weight of the letters,however, forcing heavy elements to become thin, and thin elements to become thick. Instead of torturing a letterform, choose a typeface that has the proportions you are looking for, such as condensed, compressed, wide, or extended.

Size Crime: Vertical or Horizontal Scaling

Size: The Power of X-Heights

Size: Variations on a Typeface

All the typefaces shown below were inspired by the sixteenth-century printing types of Claude Garamond, yet each one reflects its own era. The lean forms of Garamond 3 appeared during the Great Depression, while the inflated x-height of ITC Garamond became an icon of the flamboyant 1970s.
download hi-res pdf: Portrait of Four Garamonds

Optical Sizes

A type family with optical sizes has different styles for different sizes of output.The graphic designer selects a style based on context. Optical sizes designed for headlines or display tend to have delicate, lyrical forms, while styles created for text and captions are built with heavier strokes.

Optical Sizes: Adobe Garamond Premiere Pro

download hi-res pdf: Optical Sizes

Scale

Scale is the size of design elements in comparison to other elements in a layout as well as to the physical context of the work. Scale is relative. 12-pt type displayed on a 32-inch monitor can look very small, while 12-pt type printed on a book page can look flabby and overweight. Designers create hierarchy and contrast by playing with the scale of letterforms. Changes in scale help create visual contrast, movement, and depth as well as express hierarchies of importance. Scale is physical. People intuitively judge the size of objects in relation to their own bodies and environments.
the xix amendment Typographic installation at Grand Central Station, New York City, 1995. Designer: Stephen Doyle. Sponsors: The New York State Division of Women, the Metropolitan Transportation Authority, Revlon, and Merrill Lynch. Large-scale text creates impact in this public installation.

Type Classification

A basic system for classifying typefaces was devised in the nineteenth century, when printers sought to identify a heritage for their own craft analogous to that of art history. Humanist letterforms are closely connected to calligraphy and the movement of the hand. Transitional and modern typefaces are more abstract and less organic. These three main groups correspond roughly to the Renaissance, Baroque, and Enlightenment periods in art and literature. Historians and critics of typography have since proposed more finely grained schemes that attempt to better capture the diversity of letterforms. Designers in the twentieth and twenty-first centuries have continued to create new typefaces based on historic characteristics.
download hi-res pdf: 
Type History Lecture

download hi-res pdf: 
Type History Lecture in Spanish
, contributed by Laura Meseguer

Type Families

In the sixteeenth century, printers began organizing roman and italic typefaces into matched families. The concept was formalized in the early twentieth century to include styles such as bold, semibold, and small caps.
download hi-res pdf: Type Families

Type Family in Use: Garamond 3

mcsweeney's Magazine cover, 2002. Design: Dave Eggers. This magazine cover uses the Garamond 3 typeface family in various sizes. Although the typeface is classical and conservative, the obsessive, slightly deranged layout is distinctly contemporary.

Superfamilies

A traditional roman book face typically has a small family–an intimate group consisting of roman, italic, small caps, and possibly bold and semibold (each with an italic variant) styles. Sans-serif families often come in many more weights and sizes, such as thin, light, black, compressed, and condensed. Asuperfamily consists of dozens of related fonts in multiple weights and/or widths, often with both sans-serif and serif versions. Small capitals and non-lining numerals (once found only in serif fonts) are included in the sans-serif versions of Thesis, Scala Pro, and many other contemporary superfamilies.
univers was designed by the Swiss typographer Adrian Frutiger in 1957. He designed twenty-one versions of Univers, in five weights and five widths. Whereas some type families grow over time, Univers was conceived as a total system from its inception.
TRILOGY, a superfamily designed by Jeremy Tankard in 2009, is inspired by three nineteenth-century type styles: sans serif, Egyptian, and fat face. The inclusion of the fat face style, with its wafer-thin serifs and ultrawide verticals, gives this family an unusual twist.

Portrait of a Superfamily: Thesis

Caps and Small Caps

A word set in ALL CAPS within running text can look big and bulky, and A LONG PASSAGE SET ENTIRELY IN CAPITALS CAN LOOK UTTERLY INSANE. Small capitals are designed to match the x-height of lowercase letters. Designers, enamored with the squarish proportions of true small caps, employ them not only within bodies of text but for subheads, bylines, invitations, and more. Rather than Mixing Small Caps with Capitals, many designers prefer to use all small caps, creating a clean line with no ascending elements. InDesign and other programs allow users to create FALSE SMALL CAPS at the press of a button; theseSCRAWNY LETTERS look out of place.
download hi-res pdf: Caps and Small Caps in Context

Capitals in Use

amusement magazine Design: Alice Litscher, 2009. This French culture magazine employs a startling mix of tightly leaded Didot capitals in roman and italic. Running text is set in Glypha.

Mixing Typefaces

Combining typefaces is like making a salad. Start with a small number of elements representing different colors, tastes, and textures. Strive for contrast rather than harmony, looking for emphatic differences rather than mushy transitions. Give each ingredient a role to play: sweet tomatoes, crunchy cucumbers, and the pungent shock of an occasional anchovy. When mixing typefaces on the same line, designers usually adjust the point size so that the x-heights align. When placing typefaces on separate lines, it often makes sense to create contrast in scale as well as style or weight. Try mixing big, light type with small, dark type for a criss-cross of contrasting flavors and textures.

Mixing Typefaces: Single-Family and Multi-Family

Mixing Typefaces: The Small Print

the word: new york magazine Design: Chris Dixon, 2010. This content-intensive page detail mixes four different type families from various points in history, ranging from the early advertising face Egyptian Bold Condensed to the functional contemporary sans Verlag. These diverse ingredients are mixed here at different scales to create typographic tension and contrast.

Numerals

Lining numerals take up uniform widths of space, enabling the numbers to line up when tabulated in columns. They were introduced around the turn of the twentieth century to meet the needs of modern business. Lining numerals are the same height as capital letters, so they sometimes look big and bulky when appearing in running text.
Non-lining numerals, also called text or old style numerals, have ascenders and descenders, like lowercase letters. Non-lining numerals returned to favor in the 1990s, valued for their idiosyncratic appearance and their traditional typographic attitude. Like letterforms, old style numerals are proportional; each one has its own set width.
download hi-res pdf: Lining and Non-Lining Numerals in Context

Numerals: Examples

monthly calendar, 1892 The charming numerals in this calendar don't line up into neat columns, because they have varied set widths. They would not be suitable for setting modern financial data.

Punctuation

A well-designed comma carries the essence of the typeface down to its delicious details. Helvetica's comma is a chunky square mounted to a jaunty curve, while Bodoni's is a voluptuous, thin-stemmed orb. Designers and editors need to learn various typographic conventions in addition to mastering the grammatical rules of punctuation. A pandemic error is the use of straight prime or hatch marks (often called dumb quotes) in place of apostrophes and quotation marks (also known as curly quotes, typographer's quotes, or smart quotes). Double and single quotation marks are represented with four distinct characters, each accessed with a different keystroke combination. Know thy keystrokes! It usually falls to the designer to purge the client's manuscript of spurious punctuation.

Punctuation Crimes

type crimes: new york city tour City streets have become a dangerous place. Millions of dollars a year are spent producing commercial signs that are fraught with typographic misdoings. While some of these signs are cheaply made over-the-counter products, others were designed for prominent businesses and institutions. There is no excuse for such gross negligence.
gettin’ it right Apostrophes and quotation marks are sometimes called curly quotes. Here, you can enjoy them in a meat-free environment.
gettin’ it wrong The correct use of hatch marks is to indicate inches and feet. Alas, this pizza is the hapless victim of a misplaced keystroke. In InDesign or Illustrator, use the Glyphs palette to find hatch marks when you need them.

Punctuation for Typographers

Writers or clients often supply manuscripts that employ incorrect dashes or faulty word spacing. Consult a definitive work such as The Chicago Manual of Stylefor a complete guide to punctuation. The following rules are especially pertinent for designers.
word spaces are created by the space bar. Use just one space between sentences or after a comma, colon, or semicolon. One of the first steps in typesetting a manuscript is to purge it of all double spaces. Thus the space bar should not be used to create indents or otherwise position text on a line. Use tabs instead. html refuses to recognize double spaces altogether.
en spaces are wider than word spaces. An en space can be used to render a more emphatic distance between elements on a line: for example, to separate a subhead from the text that immediately follows, or to separate elements gathered along a single line in a letterhead.
em dashes express strong grammatical breaks. An em dash is one em wide-the width of the point size of the typeface. In manuscripts, dashes are often represented with a double hyphen (--); these must be replaced.
en dashes serve primarily to connect numbers (1-10). An en is half the width of an em. Manuscripts rarely employ en dashes, so the designer needs to supply them.
hyphens connect linked words and phrases, and they break words at the ends of lines. Typesetting programs break words automatically. Disable auto hyphenation when working with ragged or centered text; use discretionary hyphens instead, and only when unavoidable.
discretionary hyphens, which are inserted manually to break lines, only appear in the document if they are needed. (If a text is reflowed in subsequent editing, a discretionary hyphen will disappear.) Wayward hyphens often occur in the mid-dle of a line when the typesetter has inserted a "hard" hyphen instead of a discretionary one.
quotation marks have distinct "open" and "closed" forms, unlike hatch marks, which are straight up and down. A single close quote also serves as an apostrophe ("It's Bob's font."). Prime or hatch marks should only be used to indicate inches and feet (5'2''). Used incorrectly, hatches are known as "dumb quotes." Although computer operating systems and typesetting programs often include automatic "smart quote" features, e-mailed, word-processed, and/or client-supplied text can be riddled with dumb quotes. Auto smart quote programs often render apostrophes upside down (‘tis instead of 'tis), so designers must be vigilant and learn the necessary keystrokes.
ellipses consist of three periods, which can be rendered with no spaces between them, or with open tracking (letterspacing), or with word spaces. An ellipsis indicates an omitted section in a quoted text or...a temporal break. Most typefaces include an ellipsis character, which presents closely spaced points.

Typeface Design

Fontlab and other applications allow designers to create functional fonts that work seamlessly with standard software programs such as InDesign and Photoshop. The first step in designing a typeface is to define a basic concept. Will the letters be serif or sans serif? Will they be modular or organic? Will you construct them geometrically or base them on handwriting? Will you use them for display or for text? Will you work with historic source material or invent the characters more or less from scratch? The next step is to create drawings. Some designers start with pencil before working digitally, while others build their letterforms directly with fontdesign software.
Begin by drawing a few core letters, such as o, u, h, and n, building curves, lines, and shapes that will reappear throughout the font. All the letters in a typeface are distinct from each other, yet they share many attributes, such as x-height, line weight, stress, and a common vocabulary of forms and proportions. You can control the spacing of the typeface by adding blank areas next to each character as well as creating kerning pairs that determine the distance between particular characters. Producing a complete typeface is an enormous task. However, for people with a knack for drawing letterforms, the process is hugely rewarding.

Typeface Drawing: Castaways

castaways Drawing and finished type, 2001. Art and type direction: Andy Cruz. Typeface design: Ken Barber/House Industries. Font engineering: Rich Roat. House Industries is a digital type foundry that creates original typefaces inspired by popular culture and design history. Designer Ken Barber makes pencil drawings by hand and then digitizes the outlines. Castaways is from a series of typefaces based on commercial signs from Las Vegas. The shapes of the letters recall the handpainted strokes made by traditional sign painters and lettering artists.

Typeface Proof: Mercury

mercury bold Page proof and screen shot, 2003. Design: Jonathan Hoefler/Hoefler & Frere-Jones. Mercury is a typeface designed for modern newspapers, whose production demands fast, high-volume printing on cheap paper. The typeface's bullet-proof letterforms feature chunky serifs and sturdy upright strokes. The notes marked on the proof below comment on everything from the width or weight of a letter to the size and shape of a serif. Many such proofs are made during the design process. In a digital typeface, each letterform consists of a series of curves and lines controlled by points. In a large type family, different weights and widths can be made automatically by interpolating between extremes such as light and heavy or narrow and wide. The designer then adjusts each variant to ensure legibility and visual consistency.

Project: Letterforms

Create a prototype for a bitmap typeface by designing letters on a grid of squares or a grid of dots. Substitute the curves and diagonals of traditional letterforms with gridded and rectilinear elements. Avoid making detailed “staircases,” which are just curves and diagonals in disguise. This exercise looks back to the 1910s and 1920s, when avant-garde designers made experimental typefaces out of simple geometric parts. The project also speaks to the structure of digital technologies, from cash register receipts and LED signs to on-screen font display, showing that a typeface is a system of elements.
Examples of student work from Maryland Institute College of Art

Font Formats

Where do fonts come from, and why are there so many different formats? Some come loaded with your computer's operating system, while others are bundled with software packages. A few of these widely distributed typefaces are of the highest quality, such as Adobe Garamond Pro and Hoefler Text, while others (including Comic Sans, Apple Chancery, and Papyrus) are reviled by design snobs everywhere. If you want to expand your vocabulary beyond this familiar fare, you will need to purchase fonts from digital type foundries. These range from large establishments like Adobe and FontShop, which license thousands of different typefaces, to independent producers that distribute just a few, such as Underware in the Netherlands or Jeremy Tankard Typography in the U.K. You can also learn to make your own fonts as well as find fonts that are distributed for free online. The different font formats reflect technical innovations and business arrangements developed over time. Older font formats are still generally usable on modern operating systems.
PostScript/Type 1 was developed for desktop computer systems in the 1980s by Adobe. Type I fonts are output using the PostScript programming language, created for generating high-resolution images on paper or film. A Type 1 font consists of two files: a screen font and a printer font. You must install both files in order to fully use these fonts.
TrueType is a later font format, created by Apple and Microsoft for use with their operating systems. TrueType fonts are easier to install than Type 1 fonts because they consist of a single font file rather than two.
Opentype, a format developed by Adobe, works on multiple platforms. Each file supports up to 65,000 characters, allowing multiple styles and character variations to be contained in a single font file. In a TrueType or Type 1 font, small capitals, alternate ligatures, and other special characters must be contained in separate font files (sometimes labelled "Expert"); in an OpenType font they are part of the main font. These expanded character sets can also include accented letters and other special glyphs needed for typesetting a variety of languages. OpenType fonts with expanded character sets are commonly labeled “Pro.” OpenType fonts also automatically adjust the position of hyphens, brackets, and parentheses for letters set in all-capitals.

Some Commonly Abused Terms

typeface or font?
A typeface is the design of the letterforms; a font is the delivery mechanism. In metal type, the design is embodied in the punches from which molds are made. A font consists of the cast metal printing types. In digital systems, the typeface is the visual design, while the font is the software that allows you to install, access, and output the design. A single typeface might be available in several font formats. In part because the design of digital typefaces and the production of fonts are so fluidly linked today, most people use the terms interchangeably. Type nerds insist, however, on using them precisely.
character or glyph?
Type designers distinguish characters from glyphs in order to comply with Unicode, an international system for identifying all of the world's recognized writing systems. Only a symbol with a unique function is considered a character and is thus assigned a code point in Unicode. A single character, such as a lowercase a, can be embodied by several different glyphs (a, a, a). Each glyph is a specific expression of a given character.
Roman or roman?
The Roman Empire is a proper noun and thus is capitalized, but we identify roman letterforms, like italic ones, in lowercase. The name of the Latin alphabet is capitalized.


Read More
Posted in OUGD504, Typography | No comments
Older Posts Home
Subscribe to: Posts (Atom)

Popular Posts

  • TED: Creating Your Logo
    Source:  http://www.ted.com/pages/creating_your_tedx_logo Cool to see what typefaces, spot colours etc organisations use for their logos. //...
  • Graphic Design is Good For Your Health
    Following on from my dissertation and some of the conclusions and aims I applied towards my physical resolution - this article has been real...
  • Morihei Ushiba - The Art of Peace
    I've ordered The Art Of Peace by Morihei Ushiba , it's a philosophy book on Bushido and Martial Arts philisophy by a legendary Aiki...
  • Woodblock printing - Notes/Process/Formats
    My notes: Used to print books before movable type Moku hanga technique differs in that it uses water-based inks Water-based inks provide gre...
  • Foil Blocking & Spot Varnish examples
    I've been looking for examples of different print techniques to see examples of how, for example in this case, foil blocking and spot va...
  • Process : Embossing
    As part of my research into basic definitions of different finishing processes I'm now looking into embossing, how it's done and the...
  • Jessica Svendsen : 100 Days : Müller-Brockmann
    Jessica Svendsen is now a designer at Pentagram, under the tutelage of Michael Beirut. Michael Beirut runs the 100 days workshop where you b...
  • Bushido Quotes
    Here are really interesting Bushido quotes which reflect "The Way Of The Warrior" in martial arts and particularly Samurai culture...
  • Tokyo World Design Conference _ 1960
    Tokyo World Design  Conference                 1960                            As I'm now still keeping a close eye on the development o...
  • List of Illustrations - Practical (Wimbledon) & Pre-Practical Body of Work
    List of Illustrations – Primary Practical (Wimbledon ) Emirates247 {2012) ‘Novak Djokovic Australian Open 2012’ [Image Online] Available at:...

Categories

  • 100 Things
  • Alphabet Soup
  • Collect/Categorise/Communicate
  • Colour Theory
  • Communication Is A Virus
  • Context of practice
  • Cop3
  • Crit Techniques
  • Design For Print
  • Design for Web
  • END OF MODULE EVALUATION
  • Essay notes
  • How To Be A Best Man
  • How To Buy A Diamond Engagement Ring
  • illustrator
  • It's Your Choice
  • Lecture notes
  • Level 05 Essay
  • Level 05 Publication
  • Love/Hate
  • My Red Book
  • OUGD01
  • OUGD401
  • OUGD402
  • OUGD403
  • OUGD404
  • OUGD405
  • OUGD406
  • OUGD501
  • OUGD502
  • OUGD503
  • OUGD504
  • OUGD505
  • OUGD601
  • Personal
  • Photoshop brief
  • Proverb
  • Psychoanalysis
  • Publication
  • Room For Sale Poster
  • Stamp it
  • Study Task 1
  • Study Task 2
  • Study Task 3
  • Study Task 5
  • Task
  • Task 1
  • The Poster Brief
  • THREE
  • Typo-Gateaux
  • Typography
  • What Is A Line

Blog Archive

  • ▼  2014 (21)
    • ▼  March (1)
      • Graphic Design is Good For Your Health
    • ►  January (20)
  • ►  2013 (105)
    • ►  December (8)
    • ►  November (7)
    • ►  October (6)
    • ►  September (30)
    • ►  July (1)
    • ►  June (1)
    • ►  May (13)
    • ►  April (10)
    • ►  March (5)
    • ►  February (20)
    • ►  January (4)
  • ►  2012 (228)
    • ►  December (18)
    • ►  November (41)
    • ►  October (23)
    • ►  September (1)
    • ►  May (38)
    • ►  April (18)
    • ►  March (45)
    • ►  February (23)
    • ►  January (21)
  • ►  2011 (83)
    • ►  December (18)
    • ►  November (37)
    • ►  October (19)
    • ►  September (9)
Powered by Blogger.

About Me

cena
View my complete profile