My buddy Benedikt Lehnert has recently compiled a compact little typography guide shining light on some common mistakes and misunderstandings when it comes to working with type. The guide is now also available as a handy little printed booklet! Grab one here.
This guy is better at sandboxing than you.
Photo by Justin Kemp, via BP
On Offscreen’s new Typography
Issue No7 saw a refresh of the magazine’s typography. While the overwhelming majority of the feedback was positive, a few of you have enquired about the reasons behind the change, clearly stating that they’re missing Calluna as the primary typeface. There was certainly nothing ‘wrong’ with my original choice of Calluna as a text family and Cyclone (later Tungsten) for headlines. Hopefully my contemplations below will explain some of the decisions that went into making the change.
In October last year I announced some updates to the editorial direction of the magazine which provided me with an opportunity to introduce visual changes as well. I’ve learned that it’s quite difficult to stick to (and still be happy with) the creative direction I decided on when I set out on this journey. The first issue of Offscreen was indeed an experiment, and although I have made smaller improvements with each issue since, I was starting to feel hampered by a visual style that didn’t really seem to evolve with my experience in publishing. In short, I wanted to try something new.
Since launching my inaugural issue, I’ve been inspired by so many great new indie mags, like Outpost, Magazine B, Hello Mr, to name a few. The typography in those magazines really struck a chord with me over the last year or so and when I compared it to Offscreen, my work started to feel a little clunky.
The decision to start from scratch felt liberating. All options were on the table. After going through many of my favourite magazines for inspiration, I came to the conclusion that introducing a sans-serif, secondary typeface would break up the repetitive feel throughout the features and add a more ‘contemporary’ touch.
I would use this secondary typeface for smaller features, sidebars, colophon, pull-quotes — basically anything but more extensive narrative parts. When digging through publications with a particularly contemporary design approach, I realised that the use of Helvetica or Futura has become a quasi-standard in modern publishing — one I got quickly tired of. Both of those typefaces offer unique ‘unbiased’ features that make them compatible with pretty much any serif type. It’s great to have such a muli-talent at your disposal, but I was after something more distinctive — something with a bit more character. Another criteria to keep in mind was how wide the font was running in the magazine. With Offscreen’s small format, space is a rare commodity, so the wider text runs in narrow columns, the more it is hyphenated which negatively affects its legibility.
For longer stories and interviews I was trying to find a more versatile serif type that could also be used for headlines and subtitles. I still love Calluna for its huge character set, beautiful ligatures and the variety of weights, but unfortunately it lacks a headline family. It’s just not made for blowing up to 60pts where its playful, tilted serifs cause a weird lack of stability. In addition, my hope was to improve legibility of the body text by either increasing the font-size slightly or by using a typeface with a bigger x-height.
With the above in mind I went on a hunt for new typefaces. Over the past months and years I’ve collected quite a few links and screenshots of foundries and typefaces that stood out to me. After a couple of weeks of exploring and comparing, I narrowed my choice down to the following options:
Graphik by Commercial Type
FF Kievit by FontFont
FF Mark by FontFont
National by Klim
Adelle Sans by TypeTogether
Lyon by Commercial Type
Publico by Commercial Type
Domaine by Klim
Tiempos by Klim
As with my original choice of typefaces, one selection criteria was the availability of webfonts (or a hosted solution like Typekit) to bring a similar brand experience to the screen. I’m happy to say that most of the typefaces I had my eyes on provided web-ready versions — most of them by means of self-hosting.
Adelle Sans by TypeTogether — There is something very friendly and approachable about this sans-serif typeface. It conveys modernity in an unpretentious way and without the stigma of hipsterdom we’ve managed to attach to Helvetica. It also runs quite narrowly if needed and works well in small sizes which makes it perfect for compact publications such as Offscreen. Not to mention that it comes in all the weights you could wish for and has one of the most elegant italic styles I’ve seen in a sans-serif typeface. Lastly, I should mention that Veronika from TypeTogether was extremely helpful and responsive with providing trial licenses and answers to my silly questions.
Tiempos Text & Tiempos Headline by Klim — It only takes one quick look at Kris Sowersby’s website to be in awe of his skills. I’ve always loved Kris’ work. Ever since I first laid eyes on his typefaces, I was looking for an excuse to make use of them. Tiempos satisfies pretty much all of my requirements: versatile, bigger x-height, a separate headline family… and gosh it’s beautiful! Kris was helpful and accommodating in my requests, though I would have appreciated the availability of a trial license (see below). Another little gripe was the lack of tiers in the pricing structure for his webfonts. It would be fairer to price webfonts according to (estimated) visitor numbers rather than request a lump sum from all clients — small or big. Alternatively, he could use a service like Fontdeck to provide a usage-based pricing model that makes his work more accessible to sites with a smaller audience. (The cost played into my decision not to combine Tiempos with Kris’ National — another great sans-serif typeface and a natural combo for Tiempos.)
In my opinion, Adelle Sans and the Tiempos families compliment each other very nicely. The ‘edgy’, more serious newspaper feel of Tiempos is offset by the rounder, more playful Adelle Sans. Headlines set in Tiempos Headline Black strike just the right balance between decorative and practical relevance. When setting the type in Indesign, a lot of thought went into matching sizes and weights to achieve a clear hierarchy (hence Adelle Sans is set in Light for text and Semibold for emphasis and subtitles.)
As with anything, I’ll continue to tweak, improve and adjust the typography in the magazine. So far I’ve been really happy with my decision, and if sales and feedback are anything to go by, most of you are too. Now let’s see how long my own appreciation for the choices I’ve made will last. ;)
A few words on trial licenses: As you can imagine, type foundries are very reluctant to simply give out the source files of years of hard work for anyone to play with. Most of the foundries I approached were happy to issue a trial license after confirming my details. However, some (including Klim) do not offer trials, which makes testing a typeface (even just one weight/style) a very costly experiment. I can understand the hesitation here, of course, but not being able to test-drive a new car is a big turn-off. One foundry (which for the life of me I can’t recall right now) offered a direct download of one weight of its typeface with a few characters inside the font file replaced by happy smiley faces. This was a ‘good enough’ solution for me to get an initial feel for the typeface. More foundries should try this approach, IMHO.
This beautiful portrait and interview with Joachim Sauter, a successful German media artist, designer and Professor at the Universität der Künste Berlin, makes me miss Berlin really badly. Luckily, I’ll be visiting in the first 2 weeks of June! :)
Photos by FvF, one of my all-time favourite websites.