Typography on the ‘net
As I’ve delved further into the world of CSS, I’ve been constantly amazed with what people are doing typographically via that medium. Honestly, I have thought for a long time that with the advent of the internet, the rules and best-practices of typography would be ignored to a greater and greater extent. En-dashes and em-dashes would have very little distinction; small-caps would lose their place in the world; hyphenation would either be abandoned or used with abandon.
Every now and then I come across a page that shows great care and respect for typography and I wonder whether the person who created the page is an island unto themselves. Are they fighting a losing battle with the internet at large? Do they still create pages that uphold typographic ideals, even though it takes a great deal more effort? Should I write them a thank-you note?
I’m coming to realize, however, that the forces of good typography are more widespread than I originally believed. There are video tutorials that can teach folks about letterspacing and leading (”line-height”– we had to compromise on the terminology, it seems). Sites like A List Apart show exactly what’s possible if a developer has an eye toward design and type best-practices. We see through designers like Jason Santa Maria that creativity is unbounded, even in the realm of system-friendly fonts. But the site that really brought all of this home for me is Webtypography.net– a site sprung from the classic book, “The Elements of Typographic Style.”
The site is wholly devoted to giving typographic advice to designers/developers/coders while simultaneously furnishing them with the code used to achieve the desired effect. It’s a godsend for someone like me who is still learning and hacking together what I think is right in order to attain a look that I know is right. Tough stuff, this web stuff. The website is arranged like a beautifully-composed book and that only serves to strengthen my good opinion regarding its content. Check it out if you have any inclination toward improving your typographic style, and code.
Retro Type
I’ve been having a hell of a time finding fonts lately. In particular, I’ve been searching for the perfect font to give off a retro, old-style packaging/signage/poster-type look. It is at home all cut up and broken, it looks good messily silkscreened, but it can also stand up to posing on the headlines and buttons of a clean web interface.
What did I come up with?
Neutraface, for now (from House Industries). I’m pretty much in love with the smallcaps A’s dropped crossbar. For some reason it makes me think of looking at an old sign with a pinup girl on it. For my current purposes, it’s giving me a great combination of playfulness and strength. Here’s hoping that it will wow the client as well.
Business School Applications
I’ve been preparing to apply to business schools (entering Fall ‘10) for some time now, and I’ve been wondering whether b-schools respect design as much as MFA programs. It’s not the most fair comparison but it’s also not as strange as one might think.
Originally I was (let’s make no bones about this) … annoyed. Really? You want me to submit my essays in 12pt, double-spaced format? How 8th grade. I’m willing to bet they’d like me to use Times New Roman, too. But with the advent of the interwebs, all application materials are allowed (in fact, recommended) to be submitted online. Catastrophe: avoided.
This got me to thinking about how b-schools communicate. It’s an informational debacle, trying to get out all these can’t-miss points about the maximum word count of your essay, the method by which you may submit additional information, and the people who are eligible to recommend you (enthusiastically!). If a body of high-strung and potentially high-paying prospectives doesn’t understand the instructions put forth, there’s a whole lot of headache in store for the admissions department.
Currently I’m in the process of orchestrating my recommendations to five schools. In looking at five recommendation request forms, I’m noticing that they are… staid. Conservative. And with not enough leading. However, there is one bright spot in the otherwise dull and mundane ocean of forms: UC Berkeley has taken some well-deserved time to treat their forms with respect and care. I noticed a bold mix of Gill Sans, Franklin Gothic, and Trade Gothic all being used to convey a strong message: “Here’s how you do this. Here is what’s important.” Simple, but highly effective when well-executed.
So here I sit, getting distracted by the rivers in Stanford’s note to the recommender. Couldn’t they have used a sans-serif? Would it kill them to let out the leading just a bit? Why, oh why did they horizontally squeeze all the type in the assessment grid? I’ve thought about ignoring these distractions, but instead I think that keeping these things in mind may help in the long run. After all, the applications are about showing what you’re made of. If I’m made of a nervous, design-related twitch, I want the admissions committee to know about it.
Non-Roman Type
I’m pretty sure there’s a moment in every graphic designer’s life when they first realize what typography is. When they first recognize that letters can look different from typeface to typeface– not just in the “I’m going to format my term paper in Minion this time” way, but in the “this O isn’t the same thickness all the way around…” way. I still remember a time when I assumed that all fonts with ‘those little tail thingies’ were the same. It took a long time before I began to inspect letterforms carefully, before I realized that the Art of typography was something to be reckoned with. It took a long time before I realized that I really enjoyed it (once I took the time to understand what it was all about).
Lucky me, I had two of those “a-ha!” moments in my life. One was when I found out about typography; the other was when I realized that typography applies to all alphabets, not just the Roman alphabet. It was then that I asked my father whether he knew of any interesting Bengali typefaces, Bengali being one of the most commonly-spoken languages in India. Again I somewhat assumed that Bengali was typed in a standard font that catered more to getting the point across than to getting a feeling across. Wrong again. As it turns out, a Bengali-language newspaper has as many fonts on the front page as an English-language one. It made complete sense after the fact.
It’s incredible to see a language that you can’t understand– not only can’t understand, but seems simply like a bunch of brush strokes!– in bold, in italics, with emphasis. It’s like looking at a picture upside down: you can see that it’s supposed to be something but it’s too abstract to figure out, and instead you see it for its parts.
I still can’t read Bengali but I can admire it for its curling, complex forms. And finally I’ve stumbled upon Bengali typography which isn’t meant to be functional first, but instead beautiful. See more of these specimens at Brown Town.
A world unto itself
Back when I was working at the evil empire (you’re raising service charges again?), my main form of expressing myself creatively was by hand-lettering flyers. It didn’t happen often but when I had a chance, I’d go to town. The best part was that the bands that gave me license to explore were the 60’s-style, free love, swirly-type people. Fortunately the creative gatekeeper was a fan of all of this, too.
I knew that hand-drawn type was a world unto itself and that I’d only scratched the surface. Reminding me of this are people like Jessica Hische, who delivers viewers back to a time of retro typography and visuals. The example up top is one where when I first saw it, I didn’t want to navigate away. It’s the kind of color you just don’t want to let go of– warm, inviting, gorgeous. If ever I’d wanted to explore a true living in typography, hers is the sort of work I would look to for an understanding of what’s possible.
Hand-drawn letterforms
In school, I (and all of my peers) spent an entire semester hand-sketching and hand-gouaching letterforms. There were concepts embedded in the work we did in that class that will stick with me for a lifetime. It’s a classic case of, “you have to know the rules to break the rules”– if you don’t know how to create something perfect, you’ll be hard-pressed to understand how to make it beautifully imperfect.
Hand-drawn letters are pretty rare nowadays. I love looking at new typefaces and seeing the ways in which people ‘break’ otherwise classic fonts. But the real treat is in seeing the process by which it was done. I don’t miss the tedium of that meticulous work, but it does make for a gorgeous product. Check out more of Lee25’s work at his DeviantArt site.
Country Code Map
An aesthetically pleasing visual representation of the country codes of the world, via byte level. It’d be worth buying just to have the cheat-sheet at the bottom, in my opinion. It would make it easier to track which countries those pesky appeals for hundred-thousand-dollar wire transfers come from.
Custom Type
Typography is awesome. That’s really the only thought that comes to mind when I look at this post on Letter Cult showing off the best custom type from the first half of 2009.
Whenever I begin a new project, I try like mad to incorporate new typefaces, things that are unexpected or haven’t been used to death before. I have my fallbacks (here’s lookin’ at you Helvetica Neue!) and my easy-on-the-eyes standbys, but it’s always a struggle finding that perfect fit. Sometimes I feel limited by even the thousands of fonts at my disposal, at the same time wondering whether it’s all been done before.
The folks at Letter Cult have done a superb job pulling together these custom type designs. Looking at these images makes me think that it hasn’t all been done, and the best may still be yet to come.
Twisted Intellect
Upon trying to learn a load of CSS & PHP in a short amount of time (whilst never abandoning my good design sensibilities) I’ve happened upon a number of sites that have highlighted the happy marriage of the two. Twisted Intellect is an example of just that: a combination of beautiful design & type and sleek, clean CSS. I haven’t explored beyond the front page, but that in itself is reason enough to visit.