¶ So Mark and I gave our presentation yesterday at South by Southwest. We covered use of proper characters, vertical rhythm & browser defaults on margins, layout of lists, font stacks & choice of type faces, the relationship between type and grids, and discussion of where typography is in the design, development and production process (it rarely is). The slides and some references are online, as is the a recording of the session from the SxSW podcast and its transcription.
We had a fair bit of time for questions, but if you’d like to continue the discussion here, please feel free to drop a comment. If you work on content-based site which is live at the moment, we’d particularly like to hear if and how typography is part of your web production process, or if you have any ideas for making it part of the process, as it is in a print environment.
Comments
1
The resources are nice but I feel there should be 1 more resource that deserve to be included which is the Typography Guidelines in NBCS article located at the site below as I found it quite an excellent introductory guide to typography for both in print & on-line:
http://www.nbcs.rutgers.edu/~hedrick/typography/
2
@Richard: It was a great presentation. Definitely one of the highlights of the week, for me. Well done.
@MTC: Maybe I’m missing something, but that URL seems to be all about fonts, and not so much about typography.
3
Yours was one of my favorite panels. Although most of what you guys covered had been discussed on your sites already, it was great to hear it, and walked out really inspired. In fact, I spend my entire flight home playing with vertical rhythm.
Very well done.
4
As someone with a budding interest in web typography, I didn’t realize that there were convenient equations to get the right line spacing. Very awesome.
5
Ah, I’m sorry, I see that resources section is suppose to refer only to resources that the presentation refers to.
Jeff: All about fonts & little about typography? Not really, fonts are part of typography as well!
The document located at that site I mentioned earlier (see link below) is an attempt by somebody to summarise some of the most important typography points for web & print in about 30 pages and is an excellent read for an absolute beginner like me in my opinion =). I’m not sure if you have seen the wrong one since I link to the main page instead of directly linking to article in my earlier comment.
http://www.nbcs.rutgers.edu/~hedrick/typography/typography.zr.107514.pdf
Anyway, the presentation slides are great other than some slight problems as highlighted by Joe Clark on his website. Great job Richard!
6
Hey Richard,
Any chance we could see a slidecast of your presentation ala http://simonwillison.net/2007/openid-fowa/ ?
Many thanks,
Ben
7
Ben – how does one create a slidecast? I presume it would involve syncing the slides with audio from the podcast?
8
Hmm… not sure, perhaps Simon will know: http://simonwillison.net/2007/Mar/12/slidecast/
My guess is that it could be quite easy in iMovie: just put in audio, some markers, then drag in images of your slides.
Also, there’s http://www.fliptrack.com/
Have we just spotted a gap in the market?
9
The presentation showed me again that there
’s so much learning for me to do. Hope to find the time to really pick this up. thumps up!
10
Richard – Although I wasn’t able to go to SXSW, I really enjoyed the podcast and the slides. Thanks for posting those.
I’m a print typesetter by day, web developer by night, so I really appreciated your insights to web typography.
The Backstory:
I really like Calibri, and would like to use it with my websites. I know it’s new and isn’t terribly common, so I’d like to use Verdana as a backup. The problem is that I usually (using Verdana) build sites out at .6875 em (off the 16px default, yielding an 11px letter-height). The problem is that Calibri at .6875 em is a fair amount smaller than Verdana at .6875.
The Question:
Is there any way to select one font, at one size, and then to backup to a second font at another size? I don’t think there is, but would love to hear if you’ve heard of any ways around that.
11
Hi Charlie. There’s no way I know of passing apply one size to one font and another size to another font through use of CSS alone. There was the “”: property in early versions of CSS 2 but that was never implemented in browsers and had its own problems anyway.
Javascript solutions are available to ‘guess’ if a font is installed, such as Lalit’s JavaScript/CSS Font Detector which may go some way to programming a solution.
However, I would address the issue by revisiting your font stack so that you only specify fonts with a similar x-height. For example, rather than Verdana, Arial might be a more suitable back-up for Calibri.
12
Thanks for the sharing the slides. I thinking using and choosing the right fonts is not easy, but there exists common meanings for the use of typographs and it is nice to see yours.
13
Has this slidecast been published yet?
14
BenSky – I’m still not quite sure what a slide cast is, or how to produce one.
Add your comment
Comments are now closed on this post. If you have more to say please contact me directly.