Thinking With Type Prizes

and the winners are…
Thanks to everyone who contributed to the discussion on Ellen Lupton’s Thinking With Type. I wish I could send everyone a copy, but I don’t have a spare (160x$30). The winners were chosen using the Random Integer Generator from random.org. The first time I ran it, I forgot to take my own comments out of the “hat”, and guess who won a copy? Yes, me. However, after a re-run, the lucky winners are:

Jeff Mueller (comment no. 718)
Ian Stewart (comment no. 705)

Their books are in the post. In future I hope to be giving away many more prizes. If any wealthy readers are reading this and would like to contribute type-related prizes, then by all means send me a mail. If you’re a font designer and you’d like to offer one of your faces as a prize, that would be great too.

Thinking With Type Book Review.

Thinking With Type

Book Review

If you own not a single typography-related book, then reserve a place on your bookshelf for Thinking With Type. Ellen Lupton’s Thinking With Type is to typography what Stephen Hawking’s A Brief History of Time is to physics.

Even those who already know something about typography will benefit from this title. It’s a great “propaganda” piece that you can loan to unbelieving friends and relatives, in an effort to convert them.

Thinking With Type

Thinking With Type is a well structured book that does not bombard the reader with type-speak. When new terms are introduced, they are defined and illustrated in a no-nonsense way.

The book comprises three main sections, namely Letter, Grid and Text. The first section of the book, Letter, briefly introduces type with a very short history, looks at type classification (Humanist, Modern, Transitional et. al.), designing typefaces and screen fonts.

Selecting type with wit and wisdom requires knowledge of how and why letterforms evolved. — from Thinking With Type

The second section, Text, deals with some of the finer details like kerning, spacing and alignment and includes some simple type exercises.
The third and final section, Grid, is concerned with the Golden Section and the importance of grids in controlling and presenting type.

There’s also a brief but excellent Appendix that deals with punctuation, editing and proofreading. Moreover, there’s a complimentary Thinking With Type web site that hosts some Tools For Teachers, Exercises and even a Dumb Quotes arcade-style game.

In conclusion, this title is an excellent compromise between the “design” books — that are really nothing more than coffee table adornments — and the weightier typography books like Bringhurst’s The Elements of Typographic Style.

If you don’t already own Thinking With Type, I suggest you buy it.

I have one copy two copies of this book to give away as a prize. I’ll put all the commentators in a hat (your names, not literally “you”), and pick one out. I’ll then ship it off to you.
Winners will be announced in the next published article, on or around October 14.

Do you own it? Have you read it? What do you think?

Coming up next is a gorgeous new font (I love it) and some more Type Terminology. We have some great articles planned for this month, including one about how to get started designing type, and…well, you’ll see. If you’re not already subscribed then you can subscribe to I Love Typography now. A huge thank you to everyone who has thus far subscribed, read and commented. You are all stars, and you are all part of the Type Revolution. Forward Comrades!

See also iLT’s Interview with Ellen Lupton, and
Ellen Lupton, the movie.

Arial versus Helvetica

Every typeface, like every one of us, has its distinguishing features. You might be forgiven for thinking that some fonts are clones, or identical twins. However, closer inspection reveals subtle differences and nuances that simply escape casual perusal. Something that can really help to heighten our sensitivity to those differences is getting out our magnifying glasses and really taking a closer look. If you’ve forgotten to bring your magnifying glass, then don’t fear for the Fontometer is here (we’ll get to that in a moment).

Today we’re going to de-robe two popular typefaces, namely Arial and Helvetica — faces that are often confused, and often the subjects of mistaken identity. But first let me re-introduce you to these two popular faces:

Helvetica

Designed in 1957 by Max Miedinger, Helvetica’s design is based on that of Akzidenz Grotesk (1896), and classified as a Grotesque or Transitional san serif face. Originally it was called Neue Haas Grotesque; in 1960 it was revised and renamed Helvetica (Latin for Switzerland “Swiss”).

Arial

Designed in 1982 by Robin Nicholas and Patricia Saunders for Monotype (not Microsoft), it’s classified as Neo Grotesque, was originally called Sonoran San Serif, and was designed for IBM’s bitmap font laser printers. It was first supplied with Windows 3.1 (1992) and was one of the core fonts in all subsequent versions of Windows until Vista, when to all intents and purposes, it was replaced with Calibri.

I’ve read in several places that Arial is closer in appearance to Univers than Helvetica. I don’t think so. In How to Spot Arial, the type designer Mark Simonson looks at the similarities between Arial and Grotesque 215 (one of Arial’s true ancestors); and when you consider the details — for example, the flat versus angled finials (e.g. “t”) — then Arial does appear to be more closely related to Grotesque 215; however, the one thing that does stand out is the greater variation in stroke width of Grotesque 215. Arial and Helvetica share a more consistent, even stroke width. I guess it depends on whether one is looking at the form or the appearance. What do you think?

I can hear angels singing a heavenly chorus (I was tempted to include a sound track here) as I introduce to you the all new, shining, hopefully very useful Fontometer (sorry, but I couldn’t think of a better name) to compare the glyphs from Arial and Helvetica. In the grey corner (left), we have Arial; in the red corner, Helvetica. Simply drag the Arial glyph over the Helvetica version to compare (if the excitement of this is too much for you or your suffer from a heart condition, then take a short break between glyphs). The Fontometer only seems to work properly in FireFox (future versions will work for everyone):

A number of the glyphs are almost identical, and even an expert would have difficulty telling them apart. However, there are a few that stand out as being quite different; namely “a”, “G”, “Q”, “R”, and “1”. Did you spot any other differences?

Distinguishing Arial and Helvetica

In fact if you wish to quickly differentiate any font from from another, it’s usually best to start off looking at letters like “J”, “Q” and “g”.

What it’s wrong to do is criticize Arial as a clone or rip-off of Helvetica. If Arial is a rip-off of Helvetica, then Helvetica is a rip-off of Akzidenz Grotesk; or we could simply say that they are both rip-offs of earlier Grotesque faces. The whole rip-off debate is a rather pointless one, I feel. Every face should be considered on its own merit. (We don’t criticize a daughter for looking like her mother). And, if you want to criticize Arial (it certainly has its faults), then do so, not because everyone else does, but do so with your own critical eye.

Monotype Grotesque

Akzidenz Grotesk BQ

Further reading:
The Face of Uniformity. Against Helvetica.Nick Shinn;
Akzidenz Grotesk (re release dates) on Typophile. (not for the feint-hearted).
How to Spot Arial — Mark Simonson;
Monotype’s Other “Arials” — Mark Simonson;
The Scourge of Arial — Mark Simonson (excellent article);
Alternatives to Helvetica — FontShop FontFeed.

If you don’t have some of the fonts mentioned in this article, then I will create some PDF sample sheets at large point sizes, so that you can have hours of fun comparing them. By the way, if the Fontometer crashes your browser, breaks up your marriage or has your kids asking, “daddy, daddy, why don’t you play with me more?”, I cannot be held responsible.

So, what do you think of Arial and Helvetica now?

Veer fonts

Typography Videos

Here are some typography-related videos.

This video is a beautiful brief introduction to typography. Typography is what language looks like - Ellen Lupton. A good typographer is someone who communicates a point of view with skill and imagination and makes the type taste good—Jeffrey Keedy

YouTube Preview Image

Veteran graphic design, typography and letterpress teacher from the London College of Printing, David Dabner talks about typography, giving an insight into the principles of design, creative letterpress and why computers—in his opinion—make students sloppy.

YouTube Preview Image

An interesting use of type. The typewriter font mimics those used in old police reports. Individual letter forms are animated to illustrate characteristics of, in this instance, a serial killer.

YouTube Preview Image

Helvetica The Documentary (clip) Wim Crouwel:

One minute and 53 seconds with Wim Crouwel. “Neutralism was a word that we loved”.

YouTube Preview Image

Helvetica The Documentary (clip) Erik Spiekermann.

“I just like looking at type…they are my friends.”

YouTube Preview Image

Pulp Fiction

What ain’t no country I ever heard of….”

YouTube Preview Image

Devil’s Advocate

“Inside information”

YouTube Preview Image

Typography in Motion

“Conscious”

YouTube Preview Image

Typography Brazil

YouTube Preview Image

Designing Multi Lingual OpenType Fonts

YouTube Preview Image

TV Interview: Typeface Design

YouTube Preview Image

Typoholism. An Addict’s Tale

typoholism
noun.
A disorder characterized by the excessive consumption of and dependence on type, leading to physical and psychological harm and impaired social and vocational functioning. Also called typographical abuse, font dependence.

You awake in a cold sweat, your hands trembling, your body stiff, eyes bloodshot; you need your fix. In every town, in every city there’s one; you may pass her in the street and not even notice; it may be your neighbour, your son, your husband, your wife, your dog (don’t be silly [ed.]).

Yesterday, I interviewed a recovering addict. Robert from California wishes to remain anonymous, so we’ll call him Brian from Birmingham.

iLT:

So, tell us how your addiction started?

Brian:

As a kid, my mother gave me those plastic letters, you know the ones with magnets that you put on the refrigerator. It all started innocently enough, just making up words like cat and dog, then one day I rearranged the letters, and there it was, staring at me, goading me really, “font”; it was my typographic epiphany, you could say.

iLT:

How did your habit grow?

Brian:

I used to meet the FontShop guy in the alley on fourth and Main, behind Benny’s Burgers; I gave him the dough and he handed over a floppy disc. Of course, things are different now. I can feed my addiction online.

Of course, Brian is not alone, and it appears that Typoholism is on the increase. If you’re concerned about family or friends or, for that matter, yourself, then here are some of the symptoms to look out for:

01 While your neighbour’s kids are playing Fatman 3 — Return of the Cybertronic Mutant Warrior from Hades, your children play this:

Wii Love Typography

02 Early-stage symptom: you stop actually reading type, and ask yourself, “What typeface is that?”;

03 You think The Hounds of the Baskerville is a book about fonts;

04 You seriously consider naming your children after typefaces (Georgia, Lucida, etc); that’s bad enough. However, if you actually do name your children after typefaces, then your condition is most likely terminal;

05 You email me asking if the I Love Typography T-shirt is available set in another typeface;

06 You have type-themed dreams. I once dreamt that I had a “g” tattooed on my arm (it was Optima, I think);

07 You buy things because the type on the packaging is nice. I’m guilty of this one: I recently bought a ham and egg sandwich (I hate this filling), simply because the packaging was set in Clarendon, and in a rather nice green, to boot;

08 Your neighbour’s child’s homework looks like the sample on the left. Your child’s homework is on the right:

Homework

09 You play typography-themed I Spy with your children. I Spy with my little eye, a typeface beginning with…

10 You use your typographic knowledge in chat-up lines (more on that in a future article).

Of course, the best way to get to grips with your addiction is to share your experiences (in the comments below). And, subscribing to iLT will ensure that you don’t miss out on future therapy.

Coming up next is the bout you’ve all been waiting for: In the blue corner, Helvetica; in the red corner, Arial. Let the carnage begin. Oh, and there will be a fun little tool for comparing fonts, and discovering what makes them unique.

15 Excellent examples of Web typography

In part one, 15 Excellent Examples of Web Typography, I showcased 15 web sites that make excellent use of type. To avoid this article being inordinately long, I’m going to focus on the first site in the list, namely A List Apart. To take all 15 examples to pieces would be rather pointless, because most of what’s good about them is shared.

A List Apart

The job of web typography is not to simply mimic that of print. First, the web is a different medium with different strengths and weaknesses. Attempting to faithfully reproduce print typography is a rather pointless exercise. The printed page is rigid; we have no control over the size of the type and of the page; on-line the user has more power, more influence; she can resize the page (browser window), and even alter the default font size; add to the mix, different browsers with different rendering capabilities, differing resolutions and screen sizes, and we soon realise that the web page and the printed page make different demands.

However, despite these differences, the elements of good typography are shared across these two mediums. In a future article we’ll look at this topic in more detail; today however, we have something different on our hands, so, without further ado let’s take this list apart. Don your overalls, put on those latex gloves, and with that rather awful (List Apart) pun behind us, let me reintroduce you to A List Apart.

sd-alistapart.jpg

Continue reading this article

I Love Typography is Moving

to a new server
Today, I had planned to post the second part of 15 Excellent Examples of Web Typography. The first part, was such a success that it crashed my dedicated server. A combination of the Digg and Zeldman effect, took down the site within a few hours of posting the article. Apologies to those who had difficulty accessing the site.

iLT on Digg

This is how my server was made to look during the Digg-Zeldman effect.

The Digg-Zeldman Effect

To prevent this kind of thing happening again, I Love Typography is moving to a new server — one that will withstand just about anything you can throw at it, and the kitchen sink. The move is well-planned, but you never know what might go wrong (with me involved). In theory, the downtime should be around five minutes. I will also take the opportunity to upgrade to WordPress 2.3. However, I’m taking no chances, so I will post the second part on Thursday. If everything goes smoothly, you can congratulate me; if everything goes terribly wrong, you can blame Brian.

So, I thought I’d take this opportunity to seek your feedback. I’d like to know what you like or dislike about the site; should the articles be longer or shorter? Is the text a comfortable reading size? Do you have suggestions for articles? How about posting frequency? Is two posts a week enough, or perhaps a single post each week, that’s more in-depth, with the odd newsy or fontsy (new word!) article in between.

Here are some of the things I have planned for future iLT articles:

01 A closer look at an individual typeface or font; it’s distinguishing features, a little about its history and its designer, where it can be used well; other typeface it goes well with.

02 A series of articles on how to make fonts. How to get started, free software for font creation, with a guest post from a type designer;

03 Book reviews;

04 More type terminology articles like Who Shot the Serif?, The Return of the Serif, and Decline and Fall of the Ligature.

05 More typographic humour and cartoons;

06 Video Podcasts. I would love to do this, but what do you think? I’d really appreciate feedback on this one — especially if you have any ideas for specific podcast topics.

07 And lots of other incredibly interesting stuff, that I’ve yet to think of.

ilt readers are great
Thanks to everyone who shared and Dugg 15 Excellent Examples of Web Typography, and a big thank you to all you subscribers and commentators. You are all stars.

See you Thursday for 15 Excellent Examples of Web Typography — Under the Bonnet. Wish me luck and keep everything crossed for the server move!

And, if you want to ensure you don’t miss out on future articles, you can with a mere click, subscribe completely free of charge to I Love Typography.

johno
iLT

Baskerville, John

Type Founder & Printer (1706-1775)

Type founder, printer, stone cutter and lacquer ware professional. In 1750 he set up a printing business, but it took him until 1757 to produce his first book. However, during those seven years he was an impressive innovator, not only in the construction of the printing press but even in the inks and papers he prepared.

John BaskervilleAmong Baskerville’s most noted works are Milton’s Paradise Lost and Paradise Regained, Book of Common Prayer, and his Bible of 1763 — generally considered to be his finest achievement. As Cambridge University owned the patent to that Bible version and the Prayer Books, they stipulated that Baskerville should actually take his printing presses to Cambridge to print them.

It wasn’t until the 1920s that Baskerville finally won the attention he had always merited. The American classical typographer Bruce Rogers (designer of the Centaur typeface, among others) was in large part behind the modern revival of Baskerville’s typefaces. Now, dozens of type foundries have their own versions and derivatives.

Benjamen Franklin (who already had a successful printing business) was an admirer of Baskerville (they met in Birmingham in 1758), and returned to the US with Baskervilles’s work, popularising it through its adoption as one of the standard typefaces employed in federal government publishing.

Baskerville Typeface:

It is classified as transitional. As a matter of fact, with its generous proportions, the Baskerville appears not very different from its predecessors. But the difference between fine and bold strokes is more marked, the lower-case serifs are almost horizontal and the emphasis on the stroke widths is almost vertical. — Source

baskerville-sample1.gif

Sample: Baskerville Old Face

g glyph baskerville old face

g glyph from Baskerville Old Face

 

baskerville-print-sample.jpgbaskerville-bible.jpg

Samples of Baskerville’s early work (click for larger image).

Links

Baskerville font family on MyFonts.

Bibliography

Offline:

Pardoe, F E, John Baskerville of Birmingham: Letter-Founder and Printer (London, 1975)

Online:

Birmingham’s tribute to John Baskerville

veer-ilt-logo.png

15 excellent examples of Web typography

I have spent the last month searching, stumbling, noting, bookmarking and analysing in a quest to find 15 Excellent examples of Web Typography. I’ve chosen them because they make excellent use of type. Some of the examples mimic the typography of print, while others actually leverage web technology, smart CSS and delicious HTML to make their pages not only aesthetically pleasing, but legible, user-friendly and easily navigable.

In a few days, I will be taking an in-depth look at all these sites, delving into their grids, sifting through their CSS and dissecting their HTML, to discover what makes them tick — and what makes them excellent examples of typography for the Web.

Prepare yourself a drink, sip, sit back, scroll, click and — above all else — enjoy.

01: A List Apart for people who make websites

sd-alistapart.jpg

02: Shaun Inmanprofessional designer and developer

sd-shauninman.jpg

03: FontShopas its name suggests

sd-fontshop.jpg

04: Jesús Rodríguez Velasco blog of UC Berkeley professor

sd-rodriguez.jpg

05: BearSkinRug Shop professional illustrator, Kevin Cornell

sd-bearskinrug.jpg

06: Design View Andy Rutledge, design strategist

sd-andy-rutledge.jpg

07: Rikcat IndustriesRik Catlow, design director

sd-rikcat-industries.jpg

08: Quipsologiesnews and creative morsels

sd-quipsologies.jpg

09: Design Snipsweb design showcase

sd-design-snips.jpg

10: Red Interactive Agency web marketing and development

sd-red-interactive-agency.jpg

11: The Big Noob developed by and for…noobs

sd-the-big-noob.jpg

12: Design Can Change climate change

sd-climate.jpg

13: Process Type Foundry they make type

sd-process-type-foundry.jpg

14: Finch interactive and graphic design agency

sd-finch.jpg

15: SR28 Simon Reynolds, web designer and illustrator

sd-sr-28.jpg

Don’t forget to check back here for the second part, “15 Excellent Examples of Web Typography — a closer look.” It’s going to be dirty work, so your overalls, and be prepared to get your hands dirty, as we take these sites to pieces, look at grids, layout, and some very neat CSS tricks to improve your web typography.

What do you think of these examples? Are there others that you feel deserve a mention?

To ensure you don’t miss out on Part II, join the other +2000 TypeNuts and subscribe to I Love Typography today.

Read the second part, 15 Excellent Examples of Web Typography — Under the Bonnet.

ILT Investigates: type torture

Warning: readers may find some of the images in this article disturbing.

It was 2am when the call came in over the radio. Italic rain lashed down against the wind shield, liquefying the neon sign’s reflection. Clarendon looks good in Neon, but perhaps…

The radio interrupted my thoughts, bearing a voice that had woven itself through distant thunder…

“We’ve got a BK over on Lucida Avenue, opposite the Emigre Foundry. This one’s ugly, real ugly….”

By the time I arrived at the crime scene, the rain had subsided. I’d been on the force 25 years, but nothing had quite prepared me for this:

kerning

A week later, after an anonymous tip off, we brought in a guy for questioning. David Terrence Paine had a string of previous convictions. He was one sick puppy; got his kicks out of this kind of thing.

Yes, “BK” or Bad Kerning can be found everywhere. But before we get into bad kerning, let’s remind ourselves of what kerning is.

Sometimes there appears to be some confusion over what kerning actually is; it’s sometimes confused with tracking. So this is what kerning is:

av-kerning1.gifKerning refers to the spacing between pairs of characters or glyphs.

So, for example “A v”: the upper-case “A” is bottom-heavy, while the lower-case “v” is top-heavy; kerning can be used to reduce the space between this letter combination to make it look better and to improve readability.

Kerning should not be confused with tracking which is about the letter-spacing between a series of characters in a line, paragraph, or block of text.

In tech-speak, Kerning is “pair-wise adjustment of horizontal glyph metrics.”

For those of you interested in the etymology of the word “kern”, there’s an interesting discussion over at Typophile on the subject — it starts out as a discussion about parallels between kerning and life; but if you scroll down, you’ll learn something of the origins of “kerning”.

In the screen shot below you can see some of the kerning pairs on the right (this screen shot is taken from FontLab Pro, one of the applications you can use to design type):

FontLab Pro Kerning Pairs

Note that for the “AY” pair — highlighted in blue — the value is much lower (-64) than, say, for the “Ac” pair; because basically the “A” is bottom-heavy, while the “Y” is top-heavy, so they need to be brought closer together.

Well, we could talk all week about kerning, but we’ll save it for another day (“the excitement is killing me”, I hear you say). In fact you never have to look far for examples of poor letter spacing. This is from today’s National Newspaper:

poor kerning

Can you spot it?

In a future article we will revisit this topic, and look at the difference between metric and optical kerning; and, why it’s sometimes necessary to get our hands dirty and manually adjust kerning. We’ll also look at kerning for the Web (is it possible?), and alternatives to kerning pairs.

In the meantime, can you think of letter combinations that might require extra space (a positive kerning value)?

And finally, a TypeNuts cartoon, only I’ve omitted the captions. Perhaps you can come up with something better than mine:

typenuts typographical cartoon

Ensure you don’t miss out on the next article by subscribing to I Love Typography.


Page 31 of 33« first27282930313233
July Fonts June Fonts May Fonts April Fonts March Fonts February Fonts January Fonts January Fonts November Fonts October Fonts September Fonts August Fonts July Fonts June Fonts May Fonts April Fonts March Fonts February Fonts January Fonts december Fonts October Fonts September Fonts August Fonts July Fonts June Fonts May Fonts April Fonts March Fonts February Fonts January Fonts December Fonts November Fonts October Fonts September Fonts August Fonts July Fonts May Fonts April Fonts March 2011 Fonts February 2011 Fonts January 2011 Fonts December 2010 Fonts November 2010 Fonts October 2010 Fonts September 2010 Fonts August Fonts July Fonts June Fonts May Fonts April Fonts March Fonts February 2010 featured fonts December Fonts November Fonts October Fonts September Fonts August Fonts July Fonts June Fonts May Fonts April Fonts March Fonts February Fonts January Fonts December Fonts November Fonts October Fonts September Fonts August Fonts July Fonts June Fonts May Fonts April Fonts March Fonts February Fonts January Fonts December Fonts November Fonts