Hello again and welcome to episode six of the Design Festival podcast. This week I got in contact with a friend and colleague, Jon Tan of Analog.coop, Mapalong, and the font hosting and licensing service, Fontdeck fame. Jon is a highly recognized designer and typographer, and as we caught up we discuss all things typography and web typography.
Apologies for the brief garbled speech briefly right towards the very end — Skype was being naughty.
Download this Episode
You can download this episode as a standalone MP3 file:
- DesignFestival Podcast #6: Typography with Jon Tan (MP3, 1:06:03, 60 MB)
- Typography… a shared passion
- Current state of typography on the web (excluding webfonts) — “Typography is not just picking a ‘cool’ font”, CSS2.1, CSS3, and doing lots with the basics
- Webfonts & the tech side of things
- Extending beyond the desktop: mobile, and testing mobile typography for the BBC
- A hosting & licensing service: Fontdeck (the what, how, who)
- Awesome stuff in the pipe: Mapalong & Brooklyn Beta
- Recommendation of the week
- Jon: The New Typography by Jan Tschichold, The Elements of Typographic Style by Robert Bringhurst, and Detail in Typography by Jost Hochuli (all highly endorsed, and worth sniffing…).
Jon Tan: Ah, let me just check it’s on the door before we do that and just telling the guys shut the **** up ’cause otherwise they’ll come bouncing in going “wassuuuup” and I’ll just be like “shut the **** up”… ah, crap — ruin the podcast.
[German Bold Italic remix as intro music]
Simon Pascal Klein: Aaand enough of that. It was only ever the remixes of that track that were awesome anyway. Anyway… welcome to episode six of the DesignFestival.com podcast. We’re back to audio-only this week, so it’s myself Pascal, one of your co-hosts and I’m joined this week by an awesome guest: Jon Tan of jontangerine.com — hey Jon.
Pascal: Hey. [chuckle]. So, I suppose with you on the show — and I hope everyone already knows who you are — I’ll give you a brief second to go into that if you’d like to?
Pascal: Otherwise I think anyone who doesn’t know who you are deserves a slap.
Jon: That’s far too kind. I’m sure there’s lots of people who don’t know who I am, and I’m happy to explain if you really want me to.
Pascal: Go for it.
Jon: I’m a designer; a web designer primarily. I co-founded Fontdeck, which is the web font service that is run out of here in the UK. I work with a bunch of guys in a cooperative called Analog Coop — we’re kind of an international co-op: we have folks in the States, in San Francisco and New York, and some of us here in Bristol where I’m talking from now, in the UK. We’re currently working on a couple of things you may have heard of: we’re working on Brooklyn Beta, which is our second year this year. It’s a conference in Brooklyn in New York… it’s the friendliest web conference in the world — deliberately. Maybe not the best organised or the most slick or shiny but definitely the most fun in my opinion. It’s [being held] in a place called The Invisible Dog, which is an arts space, very much in a neighborhood arts space inside of Brooklyn in New York. So working on that and I also work primarily on a web-app called Mapalong, which is annotated maps. So that’s me, balls-in-the-air if you like… lots of them, at one time.
Pascal: So you said you’re in Bristol, you mentioned just briefly earlier in chatting behind the scenes that there’s been a bit of unrest at your end.
Jon: Uh, yea, somewhat. There’s been a— the papers have had the headline “Battle of Bristol” over the last week or so; it started a week ago last Thursday. My studio here in Bristol is in a place called Stokes Croft and Stokes Croft is a very independent kind of alternative area. Depending on your political persuasions you could either call it a load of crusties and hippies, or you could call it a vibrant cultural quarter with lots of artists and musicians and folks like me I guess.
Pascal: I like the latter.
Jon: Me too, I much prefer that one to be honest. So we’re a very independent kind of little area here in Bristol and there’s lots of graffiti everywhere and public art and then a big chain store here in the UK, Tesco decided to open a shop and people have been campaigning against it, and so a week ago last Thursday the police received a tip-off—coincidentally a week after the shop opened this big chain store—that a across the road in a squat that there was someone with a petrol bomb, so they decided to come down with 160 riot police, and dogs, and horses, and coincidentally they decided to come down on the hottest night of the year so far, right before a bank holiday weekend when everyone was in the street outside in the cafes and the bars, and basically set up an armed camp in the middle of the most alternative area of Bristol. So… at some point unfortunately I guess some idiots in the crowd decided they didn’t like these armed police being here with their riot shields and their batons and they dissolved into a riot. So, my poor little neighborhood area here has been subject to three riots over the last over the last week or so. Yea pretty insane.
Pascal: Sounds like a phenomenal waste of tax-payer money.
Jon: Monumental, to be honest most of it was peaceful protesting, except the police at one point had 300 riot officers down here, in the street. So you can imagine what that does to a lot of local people — makes them kind of mad especially when they’re being pushed around and no-one is telling them what’s going on, and then you’ve got some idiots who decide to throw a couple of bottles at the police, and it dissolves into a huge street battle at about three in the morning, with fires in the middle of the road, and missiles being thrown — the police very aggressive one one side and a load of sort of unhappy youth on the other side, and yea, you know police helicopters overhead; it’s all been sort of very dramatic. And then the best bit was then they decided to raid the squat and the arrest people on the day of the Royal wedding. So while the eyes of the world were on Westminster Abbey—for whatever it’s worth—Bristol was in the middle of police occupation, right outside my studio! But, luckily everything has calmed down now — it’s all pretty chilled.
Pascal: So you didn’t get much work done during that time?
Jon: To be honest I came down to see it to make sure everything was OK, to see a friend’s shop — there’s an art gallery just underneath here and a cafe, to see if those guys were OK and check on the studio; but no, I didn’t get a whole lot of work done. It didn’t seem like the best idea to run the police gauntlet, to get to the studio, especially because the stories I’ve heard of is of the police banging their batons on their shields going “GO AWAY!, GO AWAY!” to anybody to even attempted to come near the situation, whether they lived here or worked here or whatever. So yea, no: didn’t get a lot of work done, but y’know it’s good, it’s OK; it’s all part of life’s rich and variable tapestry let’s say.
Pascal: The reason why I said earlier people should know you, and why I raised your work; you’re of course quite well known for your typography work, particularly I suppose you’re… uh, in my opinion absolutely gorgeous website jontangerine.com—
Pascal: …Ah, I suppose as a personal lover of good type and good typography myself, and I hope the listeners have guessed this already: we’re going be talking today a bit about typography. I suppose first-off the whole webfonts craze has taken off, but before we slip into that I wanted to have a chat about just pure typography: typography on the web, not necessarily relating to the fonts you can choose, or you know, whether or not you can extend beyond the “web-safe” fonts. Can I pass the question to you: how do you see the current state of things, particularly with CSS3 slowly being adopted — where do you think we’re at, webfonts aside for a moment?
Jon: Sure. I think we’re at a sort of seminal moment, really; I think this is definitely the year that webfonts are going to come of age, and typography on the web is generally going to come of age, and the reason I say that is because a lot of people have suggested — folks, very respected folks, like David Burlow that y’know, they call— David has called the web a “crude media”, and compared to print in a way, with a long history of a thousand years of people writing on parchment, and then printing on paper and all sorts of different stuff, that the world is young and relatively crude — we’re talking about an average of 96 DPI displays. It’s required a lot of very clever to spend a long time trying to work out how best very small characters and glyphs can display on this low resolution screen. But more than, more than the differences between rendering engines — and we could go into that if you like? — the fact that you’ve got people like John Daggett of Mozilla pushing through support in CSS for OpenType features, for sophisticated, very modern features in digital screen typography, much of which has been available to print typographers for a very long time, but have only very recently been brought to the web, so with Firefox right now, we can do some amazing things for the first time. So the way I see it it’s never been as good as it’s now — to quote which president it was in the fifties, we’ve never had it so good, and it’s only going to get better, so I’m incredibly positive about where we’re at right now in terms of typography on the web.
Pascal: I would certainly agree with you, and especially with Daggett’s awesome work, I look forward to having more OpenType features available. I know that not necessarily everyone will jump on it, but there will be a lot of people who might not even be aware of what OpenType Advanced features even are, but it just takes a couple of people to showcase some awesome work with it that then gets featured on a blog somewhere and then it suddenly gets a lot of exposure.
Jon: Yea, I mean my colleague Rich Rutter who co-founded Fontdeck with me — Rich gave an awesome talk at South-by-South West [SxSW] earlier this year where he went through the kind of support that Firefox has for these advanced typographic features, and that’s a really great place for people to start with if they wanted to search Rich Rutter SxSW they’d probably stumble across his presentation. But, I mean in all honestly Pascal quite apart from the new stuff we have, I think CSS was already designed prior to this, for setting type. The acknowledgement was already there; it’s not like we needed new stuff, we could already do really amazing things on the web, I think, even with what we already have. The web design industry for me is an amazing thing because we have defined web design as a profession ourselves and the more the things that meant is that there’s a very low bar to entry — and I don’t mean that in any way patronizing, because that’s how I got into it, years ago. What that’s meant is that there’s a lot of people on the web today who haven’t had formal training in any of the disciplines related to what web design is, so they haven’t for example— they’ve come from all sorts of different backgrounds — they’ve come from HCI, from user-centered design, from traditional usability, they might come from engineering background, a computer science background, a pure graphic design background, but it’s only a few people who maybe have gone and studied graphic design before they got into the web who had the grounding of typography, and even then lots of graphic design courses don’t go into typography in the way I would like to if I was studying. Very much graphic design courses seem to be predominately about advertising, predominately about software so they can produce advertising materials, and print materials—
Pascal: They still are these days.
Jon: Right, so they weren’t focused on the web or typography as a discipline in itself. The web has rediscovered, and with the help of typographers, and the help of these guys who have been working in this field for decades, and by rediscovering it— discovered also, hold on a second “wow, we can actually do this stuff”; we can implement these conventions and test them out with the existing tools we already have. So yes, Firefox; John Daggett’s work is amazing to push the science forward but even in what we already have, even before webfonts there was scope for lots of great typographic expression I think, and we shouldn’t forget that.
Pascal: Yep, no I certainly agree. As Jeff Croft once said, quite famously, “picking a cool font is not typography.”
Jon: [chuckle] Well, no absolutely.
Pascal: I find myself coming back to that all the damn time, especially in those whole era of webfonts, and how it’s all exploded, simply because y’know you can pick a webfont — you can even pay for it — and you might still have a shit website.
Jon: There you go. SxSW 2009 I was giving a talk and met Ian Coyle for the first time who I think is a great design thinker, and had a good discussion with Ian how you really don’t need that many typefaces in order to do good work — in fact he came out with famous measure; you needed only eight faces he thought in a lifetime to do good design work. Hence, that’s the history, the backstory behind the 8 Faces Magazine that Elliot Jay Stocks has done recently that I’ve been lucky enough to help out with a little bit. A key from that discussion I had in the green room at SxSW that you don’t hundreds of typefaces in order to do good work — in fact having just a few is probably a good thing, because it allows you get to know them. So although it can be seen as a limit, I think like all limits that they can be very healthy and good for design. Still to this day Georgia will always and continue to be one of my favourite typefaces, just because it’s part of the core fonts for the web doesn’t affect that; it’s still beautiful in what it does, and I know it so well now I know it won’t ever let me down.
Pascal: Yea, I absolutely respect that decision; Georgia will always remain a favourite of min. There’s been times recently where I thought about moving to something even from Fontdeck or Typekit for my own personal website and move away from Georgia but I feel like I’m cheating it so I’ve decided to stick with it for the moment.
On the note of webfonts, especially as a creator of a webfont hosting and licensing service yourself, could you give us a rundown of the — as you see it — the state of webfonts at the moment, because I know things have changed quite dramatically over the last year or so.
Jon: Yea, sure, I’ll try my best. When Rich Rutter and I first talked about the service that became Fontdeck it was January I think, I think January 2009, probably — might have been 2008; I can’t remember. Anyway, it was a long time ago and at that time there was no webfonts services and we observed that in order for webfonts to come into being based on Håkon Wium Lie’s amazing work that he’d already done and his seminal article on A List Apart, in order for that to happen there needs to be services. Now, coincidentally obviously a lot other people were having the same thoughts as you’ve observed since with all the webfont services that have come out. Where we are at the moment is there is this rush to market in a way; there is this rush to get services out there and get type on the web. Some typographers saw the opportunity with that and we straight at it; others have been slightly more reluctant — some foundries and designers. Where we are at the moment is that a lot of typefaces in the world were designed to designed to work in print and like we said before, because the web is a relatively low-fidelity media some typefaces are not appropriate for screen and would require significant work just in their design I think to actually make them more suitable for the screen. And also then, because of the approach that Microsoft to optimize fonts and font outlines, and typefaces for the screen that as incurred an overhead for foundries and type designers — they have to prepare their fonts in quite a detailed way in order to prepare them to work appropriately on Windows machines. So we’re in this situation where we have awesome, amazing, beautiful typefaces that we want to use on the web, and the foundries that can afford, have the time, and can invest in preparing their fonts for the web are doing so. So you’ve got the people doing amazing work like FontFont and like WebType to prepare their own typefaces for the screen and even people like Jeremy Tankard and FontSmith with Fontdeck putting a lot of time and effort into this, really betting that it’s going to pay off, and I think it’s a good bet. I think usage of webfonts is only going to increase, but there’s still lots of work to do, and my view is that the typography community would benefit from an open kind of collaborative effort on everyone’s part to come up with best practice in how to prepare fonts for the web. At the moment you have a lot of deeply ‘silo-ed’ knowledge with a few people and it would be amazing to me if that was shared because it allows then smaller foundries, smaller type designers to share their stuff in the same ways the big guys can, and if that happens, and if we’re able to lower the cost and overhead and investment on type designers’ and foundries’ parts to prepare outlines for the screen, font outlines for the screen then we’re going to get better and better quality — and that will happen eventually; I would like to see it just happen sooner. Very much from a Fontdeck when Rich and I started Fontdeck with the guys at OmniTI doing the technical stuff our vision for Fontdeck was for it to be a level playing field; very much a marketplace— that type designers and foundries control the typefaces, can change them at any time and improve them if they want to, and they also set the licensing price. It’s very much giving control back to the originator of these things, rather than us being a kind of reseller if you like, or a big store where we buy in stock and sell it on for profit — all we do at Fontdeck is try help people prepare fonts for the screen and then we give them a marketplace in which they can issue licenses that they set the price for themselves, hopefully giving designers the ability to have a degree of confidence that all of their faces are curated by the original designers and foundries that have those faces. Hopefully with the end result being you don’t need to be a huge foundry in order to place your fonts in front of designers who can appreciate them, and in fact actually that’s proven to be the case because Jeremy Tankard, for example, has incredible success with Fontdeck and he’s a one-man outfit — it’s just Jeremy Tankard’s typography company on its own. So that to me is a success; and I think where we are right is there’s the focus very much now is on quality—
Pascal: Yea, good work gets rewarded…
Jon: Yes! Get the quality there; try and figure in which we can make typefaces perform better and better on the screen — help people do that and it’s only going to get better. One thing I would say if I can, if I may, is that I think it’s wrong for web designers to lay the blame for how fonts rendered with say, Microsoft, or whichever rendering engine they don’t like that week. That’s, I think, fundamentally unfair, and it’s equally unfair laying the blame with the type designers themselves as well. The Windows effort— Windows typography, those guys are have done incredible work preparing typefaces to work in very, very adverse conditions on the screen for a very long time. If you cast your mind back to the early days of the core fonts for the web project inside of Microsoft you had people spending thousands of man-hours preparing fonts, hinting them, and giving fonts instructions so they would render as well as they possibly could on CRT screens, not even LCD ones; on CRT screens with no sub-pixel positioning, just black and white antialiasing around the outlines of the fonts, and this was a huge effort. Now, the way I characterize this: the way Microsoft did it gives control back to the typographer, to the foundry, and to the type designer — very fine-grained control. They did it in a way believed to be the most legible, readably output would be achieved to these techniques, and by giving control— but it’s a bit like building an interface for an application with every single control there is a button right in front of you — a bit like Microsoft Word was, or probably still is; I don’t know, I don’t use it anymore.
Pascal: Still is, yea.
Jon: Right, still is — OK. …y’know with this huge dashboard of features that you could possibly use; they’re so confusing and so time-consuming you never actually— it’s an overhead, it’s a burden to do it. But, it’s well-intentioned, and if you see the output of Microsoft typography over the years, although we decry some of the things that have happened, no y-axis initialising in ClearType and GDI plus ClearType when it switched from standard rendering to ClearType, although we decry that the intention was good. So you can’t blame Microsoft for trying to give people the controls to make fonts work really well on the screen, but at the same time you can’t put the blame with the type designers and foundries because in order to prepare fonts for the screen, especially on the Microsoft platform, it’s a huge endeavor — costly one. So it’s tricky, it’s a very tricky situation; we need to have just a little bit more balance, rather than blaming Windows, or blaming this person or that person, there needs to be a little bit more balance on how we approach this and realize we’re still in the era, like David Burlow says, “crude media”; that it’s not going to be perfect, but I think it’s good enough, I think we’re getting there.
Pascal: Interesting. You had some awesome points you mentioned there. And I should note, you’re yourself largely a Mac user, so it’s not like you’re an evangelist sitting one side of the fence…
Jon: No, not at all.
Pascal: …by any means. I find many of the thoughts you put up were— I mean, I started my computing life briefly on Windows, and then largely due to my father I skipped over onto the Linux/free desktop for a short period of time, and I find people need to calm the hell down and stop blaming each other for shit they don’t usually understand in many cases, especially when there are organizations and businesses involved where they don’t know the closed meetings and the decisions behind those closed doors so they can’t assess why something was actually done in many cases, and particularly when they’re given free shit.
Jon: Yea, there you go, and we’re all guilty of it — I would never take the position of being holier than thou: I have ranted and raged and been frustrated and held my head in my hands at some of the things that I saw and didn’t understand; I had no idea why display sizes on the web had jaggies on the curves, on the glyph outlines when Windows switched to GDI plus ClearType. It took the typography community to educate me about that because I couldn’t find any material to say this was happening.
Pascal: A few web developers are out there thinking that IE debugging is a pain in the ass; just wait till you start doing ClearType stuff.
Jon: [chuckle] But now you know we’re in this situation where we’ve got antialiasing on both axes — x and y — in Windows, direct-write in ClearType, or Direct UD, whichever way you describe it. I’m not a developer so sometimes… I try not to get these things confused but sometimes I do, but the new font rendering technology with ClearType in Windows is fantastic; it has subpixel positioning or rendering on both axes… outlines are incredibly smooth, it can start drawing glyph outlines in the subpixel position which means the kerning between characters and the tracking generally is much better. We’re making these advances here — significant ones, and like I said I feel positive; I know it can be frustrating but generally speaking I genuinely feel positive, and I think you’re quite right in saying we need to be just a little more circumspect. And although it’s not perfect, and it’s hard sometimes to explain to clients why it’s not perfect, you know, we are still young; the web is still relatively young — we might not be teenagers anymore, but we’re definitely still young.
Pascal: Yea, sound advice I think. So, I want to get into Fontdeck a bit, but before getting into Fontdeck I want investigate one thing: I know that especially Richard — I don’t know the extent of your work in this — Richard has done a bunch of work recently: moving beyond the desktop and looking at mobile platforms, particularly with the BBC.
Pascal: Can you talk to us about that? Where you involved, what sort of work was done?
Jon: Sure. I was involved. I’m going to try and be really careful and try and talk in-turn rather than out-of-turn about it. Basically what happened is that the BBC has a global experience language which is really just a set of standards for design on the screen, across all different devices and platforms, so that’s just to trunk it down into neat chunks, so they’re not perfect: that’s the traditional desktop web, mobile, and IP TV. And they’ve had this global experience language, was supposed to give them a structure with which to produce content for the web for the foreseeable future. One of the problems with the global experience language initially was that one of the preferred typefaces was Helvetica Neue, and obviously anybody who knows anything about the web knows that Helvetica Neue is only present with OS X, and if you specify Helvetica in a font-stack you can run into all sorts of problems on Windows machines for example — people who might have an errant copy of Helvetica from somewhere, maybe as a student they picked it up on a disc, or maybe they’ve even bought a copy, legitimately (which I would hope so), but it was a copy that was not prepared for the screen so it would render body text sizes atrociously. So, small misstep, so they switched very quickly back to Arial, which is a much more robust way of doing it on the screen. The BBC were looking for a coherent way of how they could implement good typography, distinctive typography, readable, legible typography on the screen, going forward in the future. So Rich and I were lucky enough to get involved to help them find out what their options were with that. We got the great privilege of being paid by the BBC to look into what typography is like on the screen at the moment, and where it might be going. Which is amazing — I love getting paid for things I really like doing. [laughs] Thank-you very much BBC. So that yea, that’s what we were looking into; Rich took the mobile element of that to look into it, and I did the more familiar desktop if you like, we research on.
Pascal: Are the findings public, or will they be made public at some point in the future?
Jon: That’s a really good question, and I’m not sure. I think while the BBC is considering all these different options probably not, but I’m at some point there’ll be a much more public conversation about it… certainly, definitely if the BBC go down the route of any particular path of type on the screen a lot of people will be the interest and I’m sure there’ll be questions asked, [pompous, mockingly British voice] and answers will have to be given because you know it’s the BBC; it’s a British institution, and we all feel a sort of weird common ownership of it, mainly because we do pay for it actually.
Jon: The findings — what can I say — the findings were all actually really positive. I can’t say that enough. This is the first time in the history of the web where big organizations, or even small ones, have the opportunity of doing what they’ve been doing in print for decades or hundreds of years almost… or using typography in defining their own identity, and giving people a user experience with typography on the screen which is unique and distinctive and ultimately rich and enjoyable for people. We’ve never had this opportunity before, and that’s what I would say is the main output of this — yes this all possible, doable, and advisable, and actually should be done, that’s what I think. Mainly because up until this point you could in some limited way have custom typefaces on the screen, but support wasn’t… you had to have them embedded or in images, or use something like sIFR, or what have you; some kind of image replacement technique, but now we can have live text and isn’t that amazing?
Jon: And what does that mean actually — my question was does that mean? And I think that that means it’s a fundamental change in the way people will approach branding generally, and unique brand experiences on the web from this point forward. Because, if you cover up a logo on a website — cover up the whole masthead even — how many could you identify? That’s a really good questions. I don’t remember who it was, but somebody reminded of that on Twitter not that long ago, in relation to this. I think the majority of experiences people have with companies, organizations, and institutions these days is on the web, and that’s the place which defines the brand equity of those organizations or institutions or companies — the experience people have on the web is what defines them.
Pascal: Yea, absolutely.
Jon: So therefore the type choice is an immediate and visceral indicator before people could even describe it they’ve already had some sort of reaction to the typefaces used in front of them — they’re having an emotional reaction straight away, and that’s what my talk at the New Adventures conference that Simon Collison organized earlier this year was about. We have this part of the brain called the amygdala, which is one of the oldest parts of the brain, and what is interesting about it is that it’s the seat of our emotional responses to stuff, it’s where our fight or flight response is — to speak very generally because I’m not a neuroscientist, but it’s where that stuff lives. The amygdala has no language, so what that means is that don’t process sensory input, but the amygdala receives sensory input; so we don’t process that with language. So when we see a typeface or a shape or a form we’re having an emotional reaction to that without language, without it being described in words before we’ve even identified what it is we’re looking at sometimes. And I think typography can incur that emotional response. I think nobody could ever look — to use the classic example — nobody could ever look at Vincent Connare’s Comic Sans and consider it to be a face of deep gravitas and seriousness and sobriety, okay. No matter who you are you don’t have to be a typographer to understand that.
Pascal: Yea, haha.
Jon: So those kind of responses to form translate in my view on the screen in this new era of web type, webfonts, to designers being able to encourage, bring out an emotional response in the audience, using type… immediately. And that’s possible now; possible for the BBC, and possible for all sorts of organizations — in fact, I can’t say who, I was just speaking to one last week who were thinking about commissioning a custom typeface for the screen, and deriving webfonts from that, specifically for the screen to lend them a unique identity. That to me is fantastic, you know, that’s where we need to be, and that’s great.
Pascal: Interesting… thank-you…
Jon: Sorry Pascal, I tend to rant and have a little diatribe.
Pascal: No, it’s fine — exactly, what — what’s the word: I couldn’t have hoped for anything better, and especially given the nature of the work; you’re doing cooperate work, it’s not necessarily going to be available, but given that, like you said it’s the BBC, [pompous, mockingly British voice] and the British institution that it is [Jon chuckles], the chances are that it could be made available in the future… and probably, considering who did the work, I’d say keep an eye on your website, or Richard Rutter’s — think that’s a clagnut.net, just in case it does come out in the future.
Jon: Yea, clagnut.com, yea.
Pascal: .com, yea.
Jon: Just let me say on last thing on that: because of the unique situation and the BBC funded by taxpayer money here in the UK, I could see a situation possibly in the future — and again, this is very possible but not certain, and I’m not speaking on behalf of the BBC here, I’m just speculating — but I could see a situation where you have a quintessentially British typeface coming from a British institution made freely available not people, for the screen — wouldn’t that be fantastic. The BBC are famous for using Gill Sans in caps…
Pascal: I was about to say, which typeface could that be…?
Jon: Yea. You’ve got Gill Sans which has been used by the BBC on their nameplate for… forever, you’ve got other quintessentially British faces, like Johnston, as used in the Underground, or even Transport on the road signs… you’ve got all this history of Baskerville and Caslon — British typefaces. British companies and institutions like the BBC, here have an opportunity here to develop the quintessential British typeface for the 21st century. Personally speaking, and again not speaking at all on the behalf of the BBC or anybody else apart from me: I would love to see that happen; I would love to see the quintessentially British webfonts produced… now.
Pascal: That sounds awesome.
Jon: You could say Jeremy Tankard is already doing it, so I’m not taking anything away from Jeremy whose work is amazing, but you know, I think it’d be amazing to see, wouldn’t it?
Pascal: Mhh, that does sound awesome, and if it does get made it’ll be available on Fontdeck I hope?
Jon: I don’t know… I’d love to be able to say, “of course!”, but I don’t know — it’s all speculation on my part; I would just love to see it happen.
Pascal: Coming back to Fontdeck, can you tell us about the journey, about coming up with the idea, what sort of hurdles did you have to jump across, were there any major problems in implementation, were there legal issues — all these sorts of things?
Jon: Wow, okay…
Pascal: It’s a bit of a big question, I’m sorry…
Jon: That’s alright; I’ll try my best. Rich had already posted about how a webfont service could work, and I think he did that many years ago — probably 2008, if not 2007… so, he’d already done that. I’d already been having thoughts about how it could work as well, and I think posted very short things about that. At the time it was perceived that there were no models there — it seems strange saying that — but there was no sort of business model how typefaces could be ported to the web. But we had an idea of how it might work, and I guess as I said before it was this idea of making a level playing field; providing a webfont service that helped as much as it could, but fundamentally left control in the hands of the designers who designed these typefaces originally. Rich and I met up at a skill-swap in Brighton — if people don’t know what a skill-swap is, it’s sort of an evening get-together where a couple of people talk about things that are really interesting to them — and Rich and I were talking about typography that night, and we got onto the subject of webfonts services. And like I said, there were none at the point, so we really thought “someone has to do this… let’s just do it — why not?” At SxSW, later that year, we had a meeting together — it’s amazing how many ideas come out of SxSW, let me say that — we had a meeting together at an amazing restaurant on 6th St in South-by with the guys at OmniTI who I was working with at that time who were exceptional, technical people, and basically wrote the book on scalability, and performance on the web… Theo Schlossnagle who is the CEO of OmniTI; he wrote the O’Reilly sort of Bible on it. I can’t what it’s called now, because it’s not my field, but I think it’s… I can’t remember — something to do with scalability anyway…
Jon: So these guys have the technical knowledge in order to do this, and were already sort of producing huge kind of content… serving huge sites like National Geographic, so we knew we had the technical ability to do that. So we basically formed it right there and then — saying “let’s just do this.” So, with client work, and OmniTI were doing client work, so was ClearLeft and Rich and his guys we didn’t produce Fontdeck as quickly as we might have, and in the meantime all these other services started to arrive: you had Kernest arrive first, Typotheque producing their service, Typekit came out with theirs, you had Ethan Dunham across at Font Squirrel and Font Spring — he was doing his stuff… suddenly there was this rush. And for us it was like… “wow” — this great, this is exactly what we wanted.
Pascal: Forgive my saying so, but it does sound like a lot of duplicated effort?
Jon: Um, well yea. I think, in all honesty everyone saw this as a business opportunity — and we did too, although I have to say that wasn’t our prime motivation; we didn’t want to obviously lose money by producing this service; our prime motivation was that this didn’t exist and we wanted to make sure it did, at the time. But yea, there is a lot of duplicated effort, but having said that it’s really healthy, because everyone pushes each other on…
Jon: …and there are very different business models here — the way that it’s done is very different. Fontdeck we deliberately tried to create it as a professional solution, which is why you license one font for a year at a time, so that if you’re working for clients you can have the clients take on that license and pay for it themselves, or pass that license to the client in a way… so as a designer you keep on working. Obviously other people have different solutions that that; they treat typefaces more as a library subscription, where we didn’t want to go down that route, mainly because I equated font hosting somewhat to site hosting — a lot of people are happy to host sites on behalf of their clients, but certainly not my expertise as a designer, and I didn’t want to have to be the one responsible for maintaining font service hosting on behalf of clients as a designer — I would rather that that was displaced away from me, and that’s why Fontdeck is the way it is, because it was a very simple thing: one license for a font, for a year; you can pass it onto a client. Fundamentally as well, affordable. The typeface designers and foundries set the prices themselves on Fontdeck, and we put a small commission on top — and I mean small… I mean tiny — in order to pay for running the service. The profit is theirs — they set the price in themselves, and a lot of them have astute enough to realize the market is vast, so the price of then license per font doesn’t have to be high, and people responded to that. I think it’s great that they have already. Yea, so there is a degree of duplication, but you have people doing amazing work; Ethan Dunhmam across Font Squirrel — I hope I’m saying his name right; sorry Ethan if I’m getting your surname wrong — but Ethan has been doing amazing work taking what Paul Irish did originally with his bullet proof font-face syntax, taking that and improving on that and making it available. So all the different people inside of this business are trying for the same kind of goals — yes we’re all trying to make a little bit of money, and provide a good service, — but at the same time it’s sort of in our own interest that webfonts become better and better, and I think we’re all legitimately and genuinely trying to work towards that goal. Webtype is a classic example… those guys have gone away and redrawn some typefaces for the web — spent a huge amount of effort from what I can see in preparing typefaces for the web… very inspirational I think to a lot of other people in the type community in the amount of time and effort and diligence they’ve put into preparing fonts for the web. In all honesty I think we’re having this debate at the moment — I’m going to be really honest about it… I’m having this debate in my own head — some of Webtype’s fonts when set them say it’s 16 pixels equivalent in ems on the screen they render a lot bigger in terms in width than the equivalent core font for the web, so that makes me a bit nervous because the font stack needs to fall back gracefully, typographically. But still, I’m not going to take away from the fact this is amazing work.
Pascal: Yea, I do agree. Could allude to any potential awesome futures for Fontdeck? I’ve seen there’s eight or nine foundries now under you, and a couple of small designers, like single designers — I didn’t get the full count.
Jon: I think it’s significantly more than that… even I lose count after a while… I’m just going to have a quick look myself, because I need to check myself — it’s not the sort of figures I keep on hand.
Jon: [laughs] Jos Buivenga, yea.
Pascal: Yea… oh my god… I’m sorry Jos.
Jon: [laughs more] Yea, it’s alright. One thing I find is interesting about the web is that we spend so much time reading that we come with our own pronunciations — or I certainly do — of people’s names, of different things from other languages, and then we hear it at some point and it’s like “wow, that’s how you say it! Gosh I’ve been living in a sort of a text-based… [laughs] text-based cave”…
Jon: …but I do all the time. Recently we’ve got more and more of Fontsmith’s amazing typefaces coming to the screen, shortly. They joined with us recently; Jason Smith… those guys have decided to use Fontdeck exclusively — we haven’t got an exclusive contract or anything; they just decided to use us exclusively because they liked the way we worked, which I find incredibly humbling and a great compliment because that’s why we started this service, to appeal to foundries like Fontsmith.
Pascal: That’s awesome.
Jon: Jason said that the fact that he retains control; he can set pricing himself, but he’s got a reliable service in order to give his customers webfonts is a perfect for him — it allows him to carry on a type designer, doing what he loves doing the best—
Pascal: Stupid question…
Jon: Go ahead.
Pascal: Really stupid question actually — something I should have checked up myself — do you guys allow free typefaces to be made alive through Fontdeck?
Jon: We have, and one of the original intentions was to support complex scripts actually, because a lot of designers design complex for dying languages or very niche languages for free themselves to support those languages, and one of the things we wanted to do was definitely host that sort of stuff for free. We did take on hosting fonts for free as well from other foundries, but it’s gotta be balanced, and it’s a bit of a tricky one for us, because even hosting for free costs us money in order to serve those fonts in terms of bandwidth and everything else, so we have to be a little bit careful not to shoot ourselves in the font- foot, doing what we actually really like to do, which is to say “yea, if you wanna give fonts away for free, you’re welcome to so.” I think some of Jos Buivenga’s typefaces, some of the free ones of that, are free with us today, as far as I recall.
Pascal: Ahuh. So Fontdeck is the one big thing you’ve been working on recently… I hear there’s a couple of other things in the can in the can, or things you have been working on are to some degree live, or… I suppose — could you talk to us about the two in particular?
Jon: Sure… at the moment I’m trying to quickly polish off a bit of writing I’m doing for the manual, which if folks haven’t heard about the manual it’s going be a magazine that really looks like a book to me… of design thought, or web design or web culture thought, coming and being produced by Andy McMillan, the guy that puts on The Bil conference in Belfast… so the manual is going to be coming out pretty shortly, and we’re trying to do some stuff for that. But apart from that, I’m also trying to prepare a talk for the Ampersand Conference being organized by the guys at ClearLeft down in Brighton very shortly. And then apart from that, the main thing actually — in fact I haven’t been doing a huge about of work on Fontdeck for a good long while; it’s mainly been done by the guys at ClearLeft and the guys at OmniTI in the States — the main thing I’ve been working on is Mapalong. Mapalong is an annotated, shared maps application, and the idea behind Mapalong really is very simple: Chris and Andrei, my colleagues at Analog, went on a trip to Iceland and wanted to record their trip and so they hacked together — in the way that talented developers do — they hacked together some sort of way of doing that using GPS and timestamps and all sorts of clever stuff, and at the same time Chris was trying to prepare a map for his family visiting him in New York, and just found Google Maps a little bit… didn’t do exactly what he wanted it to do. So the idea behind Mapalong is we wanted to solve this problem of annotated maps, of shared annotated maps where you could really record all of your favourite places; where you’d like to as well as where you’ve been, and see those from other people, and really start to tell your story with maps. It’s weird what happens… to me anyway, I love maps… whenever I see data on maps it adds a completely new dimension to it, in terms of visualizing that data in that context. So Mapalong is basically one huge shared map. We’re in private beta the moment, issuing invites slowly. We’re winding quickly homely, as quickly as we can to a public offering, but if anybody wants to get in-line for an invite they’re welcome to do so and we do keep issuing them. You just go to Mapalong.com and sign-up; reserve your username so you can make sure you’ve got the username you want when you finally get the invite, and get in the line and we’ll get an invite to you as soon as we can. So that’s Mapalong is major thing we’ve been working on—
Pascal: So that’s at Mapalong.com?
Jon: Mapalong.com, yea.
Pascal: I’ll make sure it’s in the meta links and such.
Jon: Cheers! Thank-you. And the other thing I guess, I should mention, is Brooklyn Beta, a conference that we’ve run with the guys at Fictive Kin; it’s really Cameron from Fictive Kin, and Chris Shiftlett from our end at Analog who’ve led, who’ve driven it forward, and done most of the heavy lifting for it, if not all the heavy lifting. Brooklyn Beta is a conference — as a you might guess — in Brooklyn, in New York. Took place for the first time last year, and it’s really just an idea of getting people together… getting people together for what we call the friendliest web conference that we can put on. And it’s very much about story-telling — kind of like Mapalong I guess in a way — we have speakers there who basically share their experiences instead of giving tutorials solely or kind of trying to come up with the next new big thing. What we really want to do is have inspirational stories, and that’s was the bulk of what happened last year. And it’s super-tiny; it takes place in a local art gallery — amazing old warehouse in Brooklyn, called The Invisible Dog. It’s all very Brooklyn-esque, it’s very ‘grundgey’…
Pascal: That sounds awesome.
Jon: It’s got “Dante’s Inferno” written on the inside of the lift-shaft by an artist. It’s a fantastic venue, right in the middle of a local Brooklyn neighborhood. And it’s tiny — I think this year we’re having around about two-hundred people I guess? So tickets have been in super high demand and people have kind of been a little bit disappointed that so many people have been frustrated in not being able to grab themselves one. But the whole idea behind it is to keep it small, keep it really friendly and open, and also blur the lines between speakers and attendees, because I’m not a big fan of reverential kind of celebrity culture on the web in any kind of sense — useful I guess in some ways, certainly in Brooklyn Beta we wanted to make it really flat; treat the attendees as important… treat the attendees the same way you treat speakers: make sure everyone feels welcome; everyone’s included, everyone feels on the same level as everyone else. And I think that was a great success last year, and that’s the reason why it sold out so fast this year. People just had a great time, going what was basically a friendly conference, with a big group of like-minded, lovely people, who wanted to talk to each other.
Jon: Can’t for this year, can’t wait for it to be on again.
Pascal: I find that a very interesting idea; I’ve gone to a number of web conferences down here, in Down Under, in Australia… and probably my favourite conferences are the BarCamps that we put on down here, simply… I suppose the thing, the patterns that I’ve notices at pay-for conferences, at large gigs, where you pay five-, six-, seven-hundred dollars to attend, and there’s a specialist of speakers and so forth… speakers are sort of revered, and given this extra status and they rest of the crowd doesn’t have that status, whereas at places like BarCamps that whole thing is reset, and people get the status depending on how good their talk is. So everyone is sort of at the same level, and there can be a speaker that stands out from the crowd who gives a talk, and it might not be that great, and people just… “okay, whatever… fine”, and then there can be another speaker that gives and amazing, mind-blowing talk, and then that person goes back to the crowd and everyone else continues that discussion later on, between corridors and such and so forth.
Jon: Exactly, yea. I’m not going to do any conferences down — I’ve spoken at a few; I’ve been really fortunate in that respect, and I really grateful to, but I think if you ask people for a genuine answer to where they’ve had the best time, where they’ve had the most inspiration, I remember years ago hearing people used to say [emergency services siren blares past] — excuse me a sec; just a siren going past…
Pascal: No more riots? [chuckles]
Jon: No more riots… [chuckles] just a random ambulance I think. Years ago, at OSCON, I remember hearing for the first time people talking about the hallway track, how they love the hallway track at OSCON. Really that was just a kind of bar/restaurant, chatting over coffee, in between talks track where everyone is on the same level, and everyone participates. And that’s the thing: participation, and feeling like, again, you are on the same level… like I said, I’m not a big fan of reverence and deference… I’m not a big fan of celebrity culture, but as an attendee as well as speaker of conferences I want to feel included; I don’t want to feel like just there in the audience, not being able to — you know, not on the same level as the speakers. That’s one thing in Brooklyn Beta we just did away with; we just “that’s not what we’re about.” In fact there’s so many amazing people on the web as well; we have an audience that’s made up of people who could easily just stand up and give a talk anyway, because everyone is doing interesting work, and everyone has amazing things to say, and interesting ideas to share. So why there should ever be the need to have sort of second-class citizen, if you like, at a conference, I’m unsure about — it doesn’t mean the speakers don’t have to be looked after, because they are the ones that are putting a lot of time and effort into preparing talks.
Jon: But on the actual conference day itself there shouldn’t be a separation between those giving talks, and those attending.
Pascal: Mhh. I suppose the two questions that come up now are a), how do you do that at Brooklyn Beta, and b), are there any tickets left?
Jon: In answer to the first question: we do that because there’s barely a stage — I mean The Invisible Dog is so tiny and cozy that there isn’t this huge… it’s not a conference venue; it’s an art gallery, so the stage is probably like six inches high, and the front-row is probably two feet away from where the podium is, so there isn’t this huge distance — you’re not a gig or a conference venue, a traditional one… you just happen to be in a room as people, and someone is standing up giving a talk.
Jon: And the way that we do that is that there’s no green room, there’s no separate stuff for speakers — everyone mingles together. To get into the garden at The Invisible Dog you have to climb through a window… so you goes up these steps, climb through a window and go out through the other side…
Jon: …and that’s where everyone eats lunch together; that’s where everyone is hanging out, all outside. And again, it’s very much Brooklyn-kinda-culure; everyone’s equal on the same level, everyone’s just there mixing together — if you want to talk to someone just go talk to them; everyone is super-friendly. Chris and Cameron decided all very early on — and we all agreed with this — that it should as affordable as possible, so that leads me to answer the second question: no there are no tickets left, unfortunately. I know there’s people frustrated about that — the tickets sold out literally on both days we issued them within a minute, and that’s because we… we wanted to be small.
Pascal: Wow, that’s incredible.
Jon: Yea, I mean we could probably fill a huge venue — Pascal, honestly — with people, but that’s not the point. The point is that it needs to be small, it needs to be intimate to retain that friendliness; that feeling of togetherness in one place. The Invisible Dog can only fit so many people in it anyway, otherwise the fire service will probably turn up and turf us all out. We don’t want to make it elitist; why make it super-expensive — all that means is that people with more money get to go, and it’s just another form of elitism. So yea, tickets sold out in super-quickly. I’m really sorry to anybody who didn’t get one, and I know people are really frustrated. We were so bummed both days, because it’s not nice to let people down, but…
Pascal: Just had to run it again in the future…?
Jon: Well, hopefully we’ll continue to do so… maybe I dunno, maybe we’ll run other Beta’s… in other places as well…
Pascal: Bristol Beta?
Jon: Bristol Beta, it’s alliteration — we always love a little bit of alliteration with what we do. [laughs]
Pascal: Thank-you for sharing with us the projects that you’d been working on, your thoughts on typography on the web, on webfonts, and to be honest more importantly just thank-you for the absolutely smashing conversation — I’ve really enjoyed the last hour.
Jon: Thanks for having me.
Pascal: Can you give us any — where can we find you, sort of your Twitter profile, is there any kind of awesome app, or web service, or book or something you would recommend that you’ve seen in the last few weeks… so the traditional end-of-podcast closing guest remarks?
Jon: Ah, oh… ouch. Okay, quick brain-wracking going on… I guess, first thing: I’m jontangerine pretty much everywhere, so that’s the one I am on Twitter, that’s my website domain… the only reason I’m jontangerine it made me laugh, and made a friend of mine laugh, so Jon Tan → jontangerine you know, you can see how that works — just stupid really, but good fun. So jontangerine everywhere… jontangerine.com, and @jontangerine on Twitter. My coop that I’m part of is Analog, so it’s Analog.coop and Mapalong — definitely check that out please guys — love to see everyone there at some point… working really hard on it; I’d love to see people get involved and tell us what they think… Mapalong.com. In terms of seeing really good things recently — to be honest I’ve had my heard pretty far down — I’m really excited to get a copy of the first copy of Codex from John Boardley across at I Love Typography.
Jon: I just expect equally as good as I Love Typography has been over the last few years, but in print and I just can’t wait to get my hands on a copy of that. In terms of books and stuff… there may well be a book coming out from guys like me at some point in the next year or something like typography [poor audio quality] … but I shouldn’t say too much just in case it never happens… but it way well be something like that. I’ve got to be honest and say I actually re-read The New Typography and I found loads in there to inspire me, in fact it was Mr. Kinoss who wrote the introduction to The New Typography, or the most recent introduction and I found amazing sort of inspiration in there, even in terms of what we’re doing on the web at the moment with type. So, heartily recommend reading something like that, if people can get their mitts on a copy. Apart from that I’m sorry to say that I don’t really have much else to offer, I’ve just been so busy I barely have time to read my own email or nevermind finding out what’s going on around the web. [laughs]
Pascal: [laughs] No, I can relate.
Jon: I’ve tried to recommend one thing actually — I’m sure everyone knows this already — but actually, I’ll recommend one book specifically and I think you know exactly what I’m going to say: I don’t think you could ever go wrong in The Elements of Typographic Style by Mr. Bringhurst. I mean as Rich said recently he’s more of a poet than he is a writer, and it kind of shows; it’s just the most— even as just an object, the hardback copy of this book is beautiful to behold…
Jon: …and it will stay with me a beautiful object no matter how many times I read it or flick through it, probably for my entire life — which is a weird thing to say about a book but that is exceptionally awesome. And there’s a tiny little book that I recommend everyone buy who works on the web with type, even though it’s not about the web particularly: it’s Detail in Typography, by, I think if I pronounce it right: “Jhost” or “Jost” Hochuli — [spells out the author’s surname] — and yea it’s called Detail in Typography. It’s an incredible, tiny little book; you can read it over coffee inside of an hour or so, easily and it’s full of amazing insights into how we read, what type is, and how it works in the very smaller scales. There you go — hope that’s good enough.
Pascal: Your recommendations are absolutely awesome; I have both books sitting— I actually have numerous copies, some of them still wrapped up that I want to keep or pass off as a gift. They’re both amazing books and they’re both very beautiful to behold, and to touch… and to smell…
Pascal: …yes, funnily enough.
Jon: Everyone confesses that in a very embarrassed tone; I think we should be proud of smelling the printed word! I think there’s great satisfaction in sniffing books and magazines. [joint chuckling] Maybe we shouldn’t shout it too loud actually, just having said that, I think maybe… yea… maybe I’ll keep that one quiet from now on.
Pascal: Jon Tan, it’s been an absolute pleasure — thank-you so much, and I’m sure… I’ll either check in with you at some point in the future; and I’m sure we’ll catch each other in one form or another again as well.
Jon: Thanks for asking me to be here Pascal, really appreciate it.
Pascal: No worries. Thank-you again.
Jon: Take care.
User Interface Design with Sketch 4
Photoshop for Web Design
Introduction to Photoshop
Designing UX: Forms
Jump Start Sketch
The Ultimate Guide to Prototyping
- 1 Using White Space: How Emptiness Can Give So Much to Design
- 2 Versioning Show, Episode 5, with Rachel Smith
- 3 Versioning Show, Episode 0, with M. David Green and Tim Evko
- 4 Form UX: Sometimes Even Apple, Google and Amazon Make Mistakes
- 5 Type Nugget: Good Typography is About Finding the Right Playground