Your browser is not supported.

This website is optimized to work in modern browsers like Safari 3+, Firefox 4+, Chrome 10+ and IE9+. If you are using a different browser, you may experience visual glitches or other problems.

Posts tagged with typography

Y'learn something new every day

You’ve probably noticed my infatuation with typography of late—an infatuation that I hope will develop into a deep and lasting relationship—and realized I’m in the midst of new-infatuation giddiness. You know, where everything new you learn fascinates you, and you seek out the object of your affections on the slightest excuse, and just being around it makes you happy. <dreamy sigh/>

Anyway. So what I’m trying to say is I get all excited when I learn something new about it, especially when it has to do with history. I learned today about the venerable history of Korean typefounding and the origins of Korea’s Hangul alphabet. Did you know that Koreans were using movable type more than 200 years before Gutenberg came on the scene?

And speaking of type history, make sure to read this history of type series from ilovetypography. Fascinating stuff!

Oh, and the cool typographical link of the day is to this neato Flickr collection of typewriter ribbon tins. Here’s my favorite. (via)

Linky goodness

Lots of good stuff at SimpleBits in the last week; just keep scrolling. Some things of note:

  • The WebKit development team recently redesigned the web inspector with a ton of useful improvements. Do not miss this!
  • Ork Posters – Typographic city neigborhood posters. Both Chicago and San Francisco are available. Super terrific!
  • Scroll is a new magazine on web design—available in both print and electronic format—brought to you by Web Directions. I haven’t had a chance to dig deep into this yet, but I am expecting great things.
  • The folks at SimpleBits have put together a custom Amazon store wherein they recommend books, music, etc. that they use to design. What a great resource!

Finally, A List Apart turns 10 this year; read Jeffrey Zeldman’s retrospective.

Continuing my late obsession

with typography, check out this cool contest (some images NSFW) being sponsored by Type:

We would like you to design a tart card either for a typeface or a letter of the alphabet. If you are unfamiliar with these things, tart cards are the means by which London prostitutes advertise their services. Step in to any Central London call box and you can contemplate up to eighty cards inviting you to be tied, teased, spanked or massaged either in luxury apartments, fully-equipped chambers or the privacy of your own hotel room. So pervasive are these things, and so curious is their typography, images and copy writing they are now regarded as bona fide items of accidental art and have something of a cult following. Once on the periphery of design, the cards have influenced the work of many mainstream artists including Royal Academician Tom Philips and Sex Pistols designers, Ray and Nils Stevenson. Perhaps they can inspire you too? Maybe Sabon would invite you to caress its counters, or Palatino would advertise its ‘Mega Serifs’. Bodoni boasts some magnificent finials, Baskerville’s swash can really inflict some pain, and Century Schoolbook would undoubtedly keep you in after class. Perhaps you see something seductive in the curves of the ‘S’ or the ‘A’ exhibits dominatrix tendancies. However you see the alphabet there is a type-tart in every letter.

Dominatrix tendencies, ha! Pretty neat. (via)

On the flimsiest of pretexts—

an advance birthday present to myself—I gave in and bought Archer, and then on that flimsy pretext redesigned this site’s template to use it. You’ll notice Archer being used in the heading graphic, and, if you have it installed, the headings and date badges.

I also took the opportunity to reduce the size of the excessively large header graphic and severely pared down the rest of the design to remove static and generally clean up the layout.

Font lust

Until recently, my typographical horizons were pretty narrow—I was a strictly sans-serif kind of girl, with a sneaking fondness for Garamond—but they’ve been expanding.

Some of the speakers at An Event Apart 2008 used two Hoefler & Frere-Jones fonts that I want oh so much, and wish didn’t cost the earth: Gotham and Archer. Gotham you might not be surprised by, as it is a beautifully clean sans-serif based on the NYC subway signage, and which, neat factoid, is being used in the Obama 2008 campaign branding.

Archer, however, reveals my recent fascination for that elegant hybrid: the slab serif. The slab serif brings you the best of both worlds: the cleanliness of the sans-serif, the elegance and historical sense of the serif.

Sadly, as all great fonts do, these are not trivially priced. On a disconsolate search for more affordable alternatives, I found some nice fonts, though some are hardly less expensive: Register Serif, URW Egyptienne, the whimsical Farao, Vista Slab, and finally the gorgeous Museo, which (yay!) has some free versions. Also don’t miss Rockwell, which is arguably the quintessential slab serif.

Netflix update:

Helvetica4 stars

This documentary is not, as I originally thought, about the Helvetica typeface, or at least not entirely; it’s more about the evolution of typography and visual design in the last half-century, centered around the huge role Helvetica had to play in both, as the standard bearer, at different times, of both revolution and conformity.

Fascinating (even to those who aren’t design wonks like I am) and beautifully put together, this is a must-see for anyone who has ever wondered what design is all about.

Stop me if you've heard this one before…

So I mentioned some time ago that I had kicked off this massive redesign effort to make all my various websites cleaner and more user-friendly. As of this morning, I am mostly done with that effort:

I’ve rewritten my personal website to be XHTML 1.0 Strict compliant and use CSS positioning for page layout. Same thing for my blog templates.

In an effort to make my code cleaner and easier to maintain, I did some stylesheet reorganizing, and commented the hell out of my HTML code (particularly by marking closing tags with the ID or class of their opening tags, where applicable).

Finally and most importantly, though, I paid attention to three things. Readability, readability, and readability. This is pretty important in and of itself, but especially for my websites, since most of my content tends to be written and rather long-winded. To that end, I paid particular care to font choices. It basically came down to two choices: Verdana for sans-serif fonts, and Georgia for serif fonts. Both are supremely readable and very comfortable to read for long periods of time. Both are, moreover, recommended as good on-screen font choices. Trebuchet, FYI, is another good sans-serif one.

Speaking of fonts, I’d like to note here that font size is another important factor. I rarely use fonts smaller than 9pt, and will usually use 10pt for maximum readability. I admit that in the past I’ve liked to use smaller fonts for aesthetic reasons, but the amount of time I spend reading online content (and, I cringe to say, my ever-increasing age) has skewed my opinion in favor of what’s easiest to read.

Another important factor in content readability is, IMO, page width. You never want to keep lengthy written content too wide. It makes it too easy for your eyes to wander away and lose your place in the text. You’ll notice that most (well, well-designed ones, anyway) newspaper sites and blogs keep the content width down to around 500 pixels. You’ll notice that in all my blog designs, the maximum page width never exceeds 800px, and the actual content width stays somewhere between 400 and 500px.

Speaking of dimension, let’s not forget line height. Extending line height by as little as 20-25% can make a huge readability difference in long pieces of text. Keeping line height to the standard 1 em can make text look too cramped and make it very difficult to read. To that end, I’ve made sure that all my blog templates, like Blogger’s default templates, use a content line height of 1.1-1.25em.

I guess if any of you readers are web design professionals, you know most of this from various books you’ve read, or just from experience. I’m more of a hobbyist, and I’m sort of putting this together as I go along. So even if you think it goes without saying, I’d like to take the time to mention it. UI design on the web is still, even with ever-increasing attention paid to improving the user experience, on the whole appallingly bad. So here’s me doing my little bit to make the (online) world a better place.

This is pretty cool,

even if it doesn’t much benefit Mac users:

Beginning in 2006, Microsoft says it will ship with its operating system and other software products six brand new typefaces created especially for extended on-screen reading.

This is especially timely for me, since as you know I’ve recently been redesigning/restructuring my various websites for cleanliness and user-friendliness; I have spent much of the past few days worrying about font choices and ease of reading for users, since most of my content is written and long.