movito Mostly on interaction design and tools for collaboration

Flickr View All » Tender, loving, careEveryday absurdityRyesBlåskjellHemmeligheter og løgner / Secrets and liesSoyaaulait i avisenSoyaaulait i avisenWinter tastes great!Rådhusplassen
4 November 2009

Comments Off

Tammy Erickson’s E2Conf keynote

Tammy’s talk starts at 3:15. The player controls are awful, but the talk is excellent.


Testing web fonts

Having recently received my TypeKit invite, I went ahead and purchased the USD 25 Personal plan and font-ified my blog. TypeKit takes a very interesting approach to web fonts: you add a bit of JavaScript to your <head> tag and then manage which fonts you want to use where in the TypeKit editor.

Great fonts in the Portfolio/Performance plan

I initially found TypeKit’s font library unimpressive, but Jeff Veen was kind enough to point out that the portfolio and performance plans have more (and better, to be honest) fonts. I upgraded to the USD 50 Portfolio plan right away; it’s about twice the size, packed with great fonts.

typekit-fonts-in-portfolio-plan

Using TypeKit with “your own” fonts

Many of our clients will want to use their profile fonts; an option under development will allow us to purchase web licenses for the fonts we use in print, and have them served via TypeKit. Remember: we don’t buy fonts, we license them, but with webfonts, you pay as you go and you pay for use, so you get more bang for your buck. Actually, I wish print fonts worked in the same way.

Typotheque web fonts

In the meantime, I wanted to check out Typotheque’s new web font service as well.  So far, I’d say that the TypeKit site itself is easier to use. They’re also leveraging their customer community (via GetSatisfaction) to their advantage. Typotheque has a great webfont FAQ, but as always, I prefer a well-formatted means of engaging with my suppliers.

Updated 2009-10-24: It turns out that Typotheque can actually be reached via e-mail, uses Tender to manage customer feedback and have even commented further down on this page. Superb!

Typotheque offers their entire font collection as webfonts. Their selection isn’t as large as TypeKit’s, but they are all excellent, and some have been my personal favorites for years.

Typotheque-webfont-collection

I decided to use Jigsaw (you’re looking at it) across this blog for now, and simply added the font names to my CSS file – after selecting fonts to use at Typotheque (below)

typotheque-control-panel

I believe TypeKit also allows you to add font information directly to your CSS file, but I haven’t tried it, so I may be wrong.

Naturally, different browsers render the fonts differently.

Firefox 3.5 on Linux

webfonts-movitodotnet-linux-firefox-500w

Firefox 3.5 on Mac OS X

webfonts-movitodotnet-osx-firefox35-500w

Safari 4 on Mac OS X

webfonts-movitodotnet-osx-safari4-500w

Which approach works best?

I tried using TypeKit and Typotheque webfonts simultaneously. It worked rather badly (that could be due to my poor coding skills) but it might mean that you have to stick with one supplier. Unless you’re a huge fan of Typotheque’s fonts (I am), you’re probably better off with TypeKit, whose library is set to grow.

Typotheque might franchise their Amazon-powered webfonts solution to small foundries (e.g. Process) or larger foundries/publishers (e.g. FontFont) – or they might all make their own solutions. Other foundries might create their own solutions for the Web Open Font Format (WOFF). Microsoft’s Embedded OpenType (EOT) format might win in the end (and it could have won,  long ago, had they not had such bad manners in the 1990s and awful karma now).

Erik Spiekermann (see all his fonts at FontFont) endorses WOFF. Typotheque made their own solution. Emigré, Hoefler & Frere-Jones and the rest of the foundries who want in might make their own tools, too.

Dear WOFF: please succeed!

The creation of a webfont format that people will use and designers can make a living from has been a slow, stunted process. Technology Review gives a great overview of this débacle, you should read it.

What we need, now, is an approach that is equally exciting to type designers and type users, one where both parties win. On your computer, type works because PostScript and OpenType fonts follow a standard format; once you can pay, you can play. Fonts-as-a-service should be as simple for the designer as it has to be for the user. Creators want a font system that’s compatible with most browsers, and we want them served reliably and quickly.

If the webfont service market becomes very fragmented, we will end up selecting from a subset of high-availability fonts so that our more-gorgeous-than-ever services don’t suddenly collapse into a ghastly kaleidoscope of sans-serif when an AWS server crashes.

Updated 2009-10-24: After getting feedback from Typotheque, I’m not that worried about fragmentation on the supply side as long as we can use all of it in the browser. Of course, I’d like to see WOFF win, and font services such as Typotheque’s and TypeKit’s thrive.

In some cases we’ll be able to host the fonts on our own servers, for added reliability or for internal use (e.g. your intranet). Typotheque has €1500-per-individual-font licenses that you can host yourself (I’m sure there are conditions). Still, it looks like we’re headed towards an easy, cost-effective, reliable way of getting licensed fonts onto my blog and our clients’ websites.

Learn more about web fonts & web typography

  • Smashing Magazine’s Rich typography on the web is a great place to learn about the many different ways you can add fonts to yoursite.
  • Zomigi’s Roundup of font embedding and replacement techniques is worth a look
  • Typotheque’s web font service has great fonts and is easy to use – I hope they create a franchise that other foundries can use.
  • The TypeKit web font service has lots of great fonts in the Portfolio and Performance plan
  • FontDeck (not launched yet) web font service should be interesting
  • .webfont was a suggestion by Erik van Blokland and
  • Mozilla’s Web Open Font Format (WOFF) will hopefully suceed
  • Microsoft’s Embedded OpenType (EOT) format was created in 1997. It was a proprietary format that worked for Internet Explorer only, but in 2007 Microsoft opened it up and proposed it as an addition to the CSS3 standard, something the W3C rejected for security reasons. It was resubmitted in 2008.
  • Ascender Corporation recently created the EOT Lite webfont format. Similar to EOT, it does away with proprietary compression and URL binding (limits which sites you can use a font at)
  • Tim Brown’s Nice Web Type aggregates the latest web font news; subscribe to his newsfeed for the latest updates.
  • The League of Movable Type promotes the use of open-source fonts and has gathered a very nice collection that you can use freely. Chunk, for example, is a great slab serif.
  • Zoltan Hawryluk explores the performance and development side of web fonts with @font-face in depth and More @font-face fun
  • High Performance Web Sites Blog (sic!) puts  @font-face and performance under the microscope, and offers some smart workarounds that keep your site fast.

Helping ourselves, helping you

Shaun Inman created Mint years before we had GetSatisfaction. He likely got tired of answering the same questions over and over again, and added a bit of instruction to his home-grown forum (below).

mint-forum-frontpage

Forums don’t scale well

Frankly, if you use a plain-vanilla forum for customer support, you’re sabotaging yourself. When a forum has thousands of threads and tens of thousands of posts, no reputation infrastructure, no tagging, poor input categorization (is it a question, a suggestion, a problem – just what is this piece of text?) and poor sociality, it collapses.

If you’ve noticed how most forums have a) “sticky” threads that stay at the top of the thread list and b) repeated messages admonishing people to search first, ask questions later, well, then you’ve seen why forums scale so badly.

Let the network create value

If we ask make people format their input, it’s easier to manage.

Questions need answers, problems need solving, ideas need discussion and praise deservers response. This one single design decision divides your community’s input into input types you can prioritize.

getsatisfaction-input

To limit content duplication, a search is performed and in many cases, your customers get the answers they’re looking for in a step or two. Why? Because often, we have the same teeny-tiny, highly-specific problems. Once the answer has been found, it’s just a matter of efficiently distributing it.

A while back, I asked a support ninja at OmniGroup why they use “traditional” forums instead of GetSatisfaction. I expected them to say “the switching costs are too high” or “we prefer to control our own content”, but their reply was far more interesting:

“I can tell you that since we already have an existing support structure, these services become additional sources we have to monitor, duplication a certain amount of effort. I can see them being useful for a small developer who doesn’t have an existing support infrastructure, though.”

I can see his point: simply adding yet another channel for support would mean more noise and more work, not less.

and you thought you had computer problems

The Golden Age of Forums is at an end

Using a plain-vanilla forum was once the best we had, but forums rely on our attention, participation and constant gardening to remain vital and leverage the knowledge that’s locked inside the participants’ conversations. That’s because they think in terms of audience and administrator. Some forums do better: Slashdot automatically identifies reputable users and lets them moderate the moderators, as Yochai Benkler documents in the Wealth of Networks. This “crowdsourcing” of moderation work is worth noting.

What makes Community tools productive?

So, how can we transform all this attention, discussion and knowledge into a peer-driven, pull-based knowledge system? I think the points below are vital to customer support communities, but – as we’ll discuss at a later date – they are how we tilt any type of social software away from chatter and towards productive output.

Offer a clear frame for collaboration

  • Making people describe their text : “Is this a question, an idea, a problem or praise?”
  • Giving topics descriptive names
  • Offering a description, with images if necessary
  • Tagging topics, so that they can be found
  • Describing one’s mood (frustrated, angry, elated, etc)
  • Stating that “I have this question/problem/suggestion too”
  • Marking items as answered (this does not bar participation, however)
  • Showing that this is the main place where the provider and the customer interact helps funnel queries into this one, highly-scalable channel
  • (None of this works unless you’re willing to be present and participate in your own community)

Leveraging the cognitive diversity of the community/user base

As Scott Page points out in The Difference, there are four areas where we can make use of cognitive diversity:

  • Diverse Perspectives: ways of representing situations and problems
  • Diverse Interpretations: ways of categorizing or partitioning perspectives
  • Diverse Heuristics: ways of generating solutions to problems
  • Diverse Predictive Models: ways of inferring cause and effect

Now, if we assume that the tool has the right kind of sociality, that users are (and are gently reminded to be) civil and benefit from a good standing among their peers, we can make use of their perspectives, interpretations, heuristics and predictive models to discover, understand and fix problems. Of course, built into this is information aggregation and disintermediation. People converge around a topic, and off we go.

Lowering coordination costs

  • The above is dependent on very, very low costs of coordination. Imagine doing this by post, e-mail or, ahem, traditional forums.
  • When coordination costs are near-zero, everyone can gather on the same page, share input, suggest solutions, share experiences and find answers together. That’s why it’s so important to prevent content duplication – the conversations would be split, limiting the group’s potential effectiveness.

Making topics dead-simple to find

  • None of this works, of course, unless people can come across the discussions they need to find, quickly and easily.
  • StackOverflow, GetSatisfaction, UserVoice and others assume that people go looking for answers, not their supplier’s support forum, so their threads need to be exceptionally easy to find.
  • That’s why, of course, we ask the people who have questions, ideas, problems and praise to tell us what their thread is about in plain language, so that their peers can find them with ease.

Questions? Ideas? Suggestions? Tell me in the comments below. I doubt our conversation will grow too long, but if it does, I’ll embed a GetSatisfaction forum below :-)   And: if you disagree with me and think that forums have a bright future, please tell me why!


← Before After →