Web Typography Sucks

kensoliva's picture

Hello from SXSW Interactive! This morning I attended a panel discussion entitled Web Typography Sucks hosted by Mark Boulton and Richard Rutter. The panel delved into some of what plagues typography on the web and offered some insights about what can be done to correct the most common offenses. Topics covered included:

  • Creating a vertical typographic rhythm
  • Building em based grid structures
  • Web friendly typeface selection

Admittedly, many of these ideas have been presented before. However, Mark and Richard are doing a great job of packaging everything together for an audience that may not otherwise know the names Tsichold or Bringhurst. For those interested, slides from the presentation and additional resources can be found here.

vincentg's picture

Thanks for linking to this, Ken.

I find the part on em-based grid design particularly interesting. Although I have read all of M. Boulton's articles on grid design for the web, I still didn't have a clue how to do it properly. The way it is represented in the slides, with the notes, is so much easier to understand.

I hope you are having a good time down at SxSW!

blank's picture

An excellent, and useful, presentation, especially with the notes. Thanks.

jlg4104's picture

Good stuff-- I'm linking it all up for my students.

One thing I notice about these kinds of discussions, though-- where is the push for truly high resolution monitors? I got a laser printer for $69 that'll do 600 x 1200, while my snazzy 19-inch flat screen remains stuck at less than 100 ppi in real measurements. Even so-called "ultra high pixel density monitors" like this one are barely more than 200 ppi and cost, in this case, $6000 (100 times as much as my printer?!).

I appreciate all the general design ingenuity that this presentaiton offers. It's very good, useful stuff. But I think that ultimately the "look and feel" of on-screen typography will never rival print until the resolution issue is addressed on a big scale. In a way, it's kind of like dealing with printouts that never get any better than what you'd get from an NOS dot-matrix printer.

Si_Daniels's picture

Try printing out every Web page you visit instead of viewing it on screen, you'll soon work out the true cost of your $69 printer ;-).

aluminum's picture

It seems as if most of the content of this presentation is really about typography in general. Perhaps better titled as "Default typography settings in most software sucks".

As for the em-based grids, it's a valid approach, but does have pros and cons just like any other approaches.

jlg4104's picture

>Try printing out every Web page you visit instead of viewing it on screen, you’ll soon work out the true cost of your $69 printer ;-).

Er... but I don't print them out. I read them on the screen. I print some out, yeah. What I'm thinking of is simply print resolution-- in, you know, books and magazines and stuff-- versus screen resulution. If I really wanted to save money, I'd have neither a screen nor a printer. I'd use my local library more.

Anyway, luminosity seems to be the screen's chief advantage. And the associated blending of colors of light that make photographic material look pretty decent at low resolutions (which has the analogy in the 150 dpi color inkjet printout, which can look ok for a lot of photos on glossy paper). But this is getting more and more off-topic. Sorry.

- J

aluminum's picture

jlg4104...that is one of the main complaints that Tufte has. I agree. Every aspect of computing as increased 1000+% (ram, disk storage, speed, size) except monitor resolutions. The standard resolution increase on most monitors in that past 25 years as increased what...25% at best?

Related to that, is the lack of resolution independant screen rendering. Eventually, we will have more control over on-screen rendering when we can specify sizes in real measurments like an inch and have it display as an inch regardless of the screen resolution.

tina's picture

online em-calculator: http://www.riddle.pl/emcalc/

Syndicate content Syndicate content