Furthermore I think the browser is the best tool for resizing text, as opposed to alternative stylesheets, for example. Internet Explorer is an issue in that regard, but Safari, Firefox and Opera offer solid font resizing capabilities. So right now alternative stylesheets are a good and useful way to provide users of Internet Explorer with a working alternative. Personally I think Opera gets it right by zooming in the entire page, as opposed to only text. Atleast in that case I know my layout will not brake or look bizarre.

In my opinion typography is not only a matter of readability, it is foremost a matter of style. But I have to admit that the web is place where the selection is limited. Very limited. Using Flash is an option, but realistically only for headlines and similar shorter passages. Eventually your customization tool does not get in the way, on the contrary. Users can either use it or decide to ignore it and trust the default settings. Personally I prefer to trust the judgement of the designer and go with whatever the feel was right.

I post quite a lof ot code samples (X/HTML, CSS, C#, etc) on my site, and my biggest scare with giving too much control over fonts is whether this code enclosed in <pre> tags still fits in the content area. :) I’ve added a text size switcher, but I know up front how wide a <pre> area may get.

Since I float columns IE may push one underneath the other should it get too wide. Firefox and Opera handle it just fine, as you know. A slight overlap is no biggie.

Is there a good way to facilitate font selection and make sure code samples don’t go wild?

By the way, I like what you have done with you site.

Here is what I do instead. I created a local stylesheet containing just this line:

html, body, p, td, font {
	font-family: "Lucida Grande" !important;
}

Then, in my browser preferences, I opted to use this custom stylesheet. I use Safari, but I believe you can do this in most browsers these days. The end result is that a good 95% of body copy that I read on the web now is set in my typeface of choice, Lucida Grande.

Blake: Yep, I agree that users probably don’t need to use the Readability widget more than once. I’m starting to think about solutions where it may be very prominent on every page until you actually use it. Then, after you use it, maybe it would appear only as a small “Readability” link, perhaps right above the Invalidator Badge. Since the entire widget is rendered with this one line of javascript:

renderReadability();

… it shouldn’t be too hard to place it in different locations dynamically.

also, is this something that would be remembered on the next visit, or would they have to reset each time?

(naturally, it’s impossible to rely on in a production environment since no one else will use it; but it’s a nice accoutrement for those who care!)

Regarding the problem that “ComicSansMS” works but “Comic Sans” doesn’t:

You could change your script to recognize a variety of spellings for each font. Seems like that’d add a lot to the tool’s usability. Looks like you’re already doing that with Times and Trebuchet, which is a nice detail.

Also, you might consider escaping double-quotes in that input box. Check out what happens when you add this as the font:

times”; display: none; font-family:”times

I’m not sure whether any fonts out there have double-quotes in their names, but it’s probably worth escaping ‘em in your tool.

” } body { display: none }

Or similar terribly messy things :D.. Had to delete the cookie to be able to view the site again!

That’s a good idea escaping the field before it gets into the cookie. I think I’ll probably escape the whole thing, just to be safe, and then replace the percent 20′s with spaces. That should make it pretty tamperproof.

As for the names of fonts, I don’t think they are really allowed to have anything but standard letters in them. I could be wrong… I’ve just never seen one with any special characters in it.

As for giving the user too much control, that’s definitely a personal decision. As for me, I’m fine with making my suggestion to them the default (Lucida Grande Mac, Verdana PC) and then letting them switch to whatever they want if need be. After all, if they choose Comic Sans, they are only choosing it for themselves. Not for other users. And as Dave S. said, people may have great fonts on their system like Avenir or Myriad, so why not let them use them?

Why not make a Flash form, then use the getFontList() function to get the list of the users installed fonts? Or are you looking to not use Flash here?

That is a great idea! I’m on it. I’ll serve a Flash readability section if you have Flash, and the current HTML one if you don’t. Perfect.

The only thing I’m worried about is Inman getting one out before me.

Also, the current textfield is now fully escaped so it should be unbreakable.