geek ramblings » Ideas http://dougal.gunters.org Random musings of a Southern geek Tue, 22 Apr 2008 18:24:49 +0000 http://wordpress.org/?v=2.5.2-alpha en Typography design patterns for the web http://dougal.gunters.org/blog/2007/07/05/typography-design-patterns-for-the-web http://dougal.gunters.org/blog/2007/07/05/typography-design-patterns-for-the-web#comments Thu, 05 Jul 2007 16:01:37 +0000 Dougal http://dougal.gunters.org/blog/2007/07/05/typography-design-patterns-for-the-web When I’m putting a new web site together, one thing that sometimes bugs me is choosing which fonts to use. I’ll typically throw together a list of fonts that I like, decide to use this set of serif fonts for these page elements, and that set of sans-serif fonts for those other elements, select some fallback choices for my stylesheet, and let it go at that. [...]

]]> When I’m putting a new web site together, one thing that sometimes bugs me is choosing which fonts to use. I’ll typically throw together a list of fonts that I like, decide to use this set of serif fonts for these page elements, and that set of sans-serif fonts for those other elements, select some fallback choices for my stylesheet, and let it go at that. Obviously, I’m no designer — or I’d be saying ‘typeface’ instead of ‘font’ — but I’d like to be able to make ‘better’ choices for my fonts.

I’ve done a little bit of searching, but I haven’t found what I’m looking for. I’ve found plenty of font surveys of which fonts are commonly found on Windows vs Mac vs Linux. I’ve found lots of discussions about things that affect readability, like font size, line length and line height. But it’s all very general, I’m looking for something more practical.

What I’m looking for is a resource that has pre-made sets of font-family definitions. But not just font lists in isolation — a set of font choices for various page elements. These fonts for headers, those fonts for body text, these other fonts for sidebar items, etc. A sort of “font palette” for the web, not unlike many of the color palette utilities that are available. I’m looking for typography design patterns for the web.

Does anything close to that exist? Even if it’s not full sets of font palettes as I envision, if I just had a good set of pre-made, cross-platform font-family definitions, it would be a start. Sure, I could just find well-made web sites that I like and see what fonts they use, but I wouldn’t know if they planned out their font use, or if they picked them as haphazardly as I normally do. I want to find a resource that has documented some lists of font-family selections, with good, cross-platform fallback choices.

I think this is a darned good idea for a web site. If I had the time to work on it, I’d make it myself. It would have a mockup web page skeleton, with some headers, body text, lists, strong and emphasized text, blockquotes, etc., and a selection of font palettes that could be applied, to see how they look. You’d be able to download these palettes as CSS stylesheet rules.

You’d also be able to see how things look if the visitor doesn’t have this or that font installed. The font-family definitions would try to be very complete, with good choices made for Windows, Macintosh, and Linux browsers. Users would be able to add new palettes to the site, and everyone would vote on them. And it would be all Ajaxy and stuff, with glossy buttons, reflected graphics, round corners, and a “beta” label.

There, I’ve laid out the basic project plan. Now, somebody go build it! :)

ShareThis

]]> http://dougal.gunters.org/blog/2007/07/05/typography-design-patterns-for-the-web/feed Dream Ideas http://dougal.gunters.org/blog/2005/07/28/dream-ideas http://dougal.gunters.org/blog/2005/07/28/dream-ideas#comments Thu, 28 Jul 2005 19:52:53 +0000 Dougal http://dougal.gunters.org/?p=630 Last night, I had a dream where I was visiting somebody else’s house (I don’t know who, and apparently it wasn’t important). On a small table were some leather-bound books. As I examined them, one stood out, partly because it was slightly larger than the rest, and also because the binding was a little different. [...]

]]> Last night, I had a dream where I was visiting somebody else’s house (I don’t know who, and apparently it wasn’t important). On a small table were some leather-bound books. As I examined them, one stood out, partly because it was slightly larger than the rest, and also because the binding was a little different. I realized that the owner of the house had created the book cover by hand (a hobby of his, I guessed).

When I examined it more closely, I saw that it had a title something like “The Essence of Romance” or words to that effect. And then I realized that it wasn’t actually a book at all. When I picked it up and opened it, I found that the inside actually contained a pocket on each side, stuffed with smaller articles. It was mainly pocket-sized books of poetry, but also I recall a silver flask of brandy or cognac, and a few other knicknacks (candles and matches?).

I’m not sure where that idea came from (especially since the other pieces of dreams that I remember from last night had no relation), but it stuck out in my mind after I woke up. That item just seems like a really cool idea, like something that James Bond would have on his bookshelf when wooing some female enemy agent. Except that his version would include knockout pills to slip in to her drink and a hidden miniature laser gun.

Anyhow, if anybody ever sees anything like this in the future, just remember that I thought of it first!

ShareThis

]]> http://dougal.gunters.org/blog/2005/07/28/dream-ideas/feed