Web Journal: The Metastatic Whatnot

Daniel Poindexter's picture

Still new, but this is something that I could really use some help with. I am pretty far out of my league.

I've designed an ezine of sorts

eomine's picture

It looks ok for me.

The only problem is, I don't have Bookman installed here.
I think you should go with Georgia for everything.

antiuser's picture

What Eduardo said. Either that, or use images (you can even create them dynamically, with PHP using GD and freetype/t1lib).

antiuser's picture

Damn you, Internal Server Error.

kakaze's picture

I think only windows 2k and XP users will have Bookman installed.

antiuser's picture

I'm on WinXP and don't have it... I think it comes with MSOffice.

antiuser's picture

GAH! Another double post!

kakaze's picture

Oh, maybe you're right, I do have office installed. It's an opentype font, and I didn't think Office came with OT until Office XP and I have Office 2k.

Daniel Poindexter's picture

Do you have any more information about PHP generated letters? Also, is it a problem that it degrades in any system without Bookman? I can just set Georgia as an alternate font, and anyone without Bookman should be fine.

Or does it just not work at all?

Jon Whipple's picture

You are able to specify a range of fonts in decreasing order of preference in your stylesheet, so when you specify your font (please forgive me I haven't tried to read your site's code or stylesheets) you do something like:

p {
font-family: Bookman, Georgia, serif;
font-size: 1em;
line-height: 1.35em;

In this example: everything inside a paragraph tag will be Bookman if available, Georgia if Bookman isn't, and whatever the browser understands is its default serif type if the first two aren't available. The text would be set at the browser's default size and the leading is 1.35 times the browsers default text size.

Personally I would specify Georgia, serif for everything and leave it at that. I wouldn't get into automated graphics unless you have the technical chops and patience to do so (though I know from experience that automated graphics can be very useful).

One of the hardest lessons for me to learn is that typography on the web, even with powerful web standards such as CSS, is that it's a thing that's best controlled by making suggestions about what you prefer, rather than imposing your will.

Daniel Poindexter's picture

Jon, thanks for your suggestions. I'm pretty familiar with CSS; the layout you see is pretty close to CSS 2.0 and XHTML strict validation. It's also tableless, by the way.

The problem I have is that Georgia is the font used by just about everyone today. There is no other font that works as well for screen display, which is why I use it for the body text. But I'm also attempting to create some sort of semi-unique look, and in my mind, Georgia is not the way to go with headings if that's my goal. I liked the way Bookman is just slightly reminiscient of typewriters, and how it contrasts with the more flowing, elegant Georgia.

But on the other hand (and this is a powerful counter indeed) i really don't know jack about typography. Any other reasons besides cross-compatibility that you would recommend Georgia?

Dan Weaver's picture

Daniel do you have time to create gif titles for the quarterly. If you do you've solved the cross platform issue and the CSS issue.

hrant's picture

But you'd be creating potential resolution/size issues...


nicolai's picture

> ...potential resolution/size issues...

On screen or printed? Please explain...

(I just ask hoping too learn something new - which is
the reason I read through most of the discussions btw)


hrant's picture

If you fix the titling text into an image, you can't control its size depending on a user's display attributes. And if you have some sizable text below it, it could conceivable end up larger than the title!


Jon Whipple's picture

Daniel P: I think that specifying Bookman as first choice is okay, but then follow with Georgia and serif of Georgia, Times, serif.

The problem I have is that Georgia is the font used by just about everyone today. There is no other font that works as well for screen display, which is why I use it for the body text. But I'm also attempting to create some sort of semi-unique look, and in my mind, Georgia is not the way to go with headings if that's my goal.

In a case like this you are on the horns of a dilemma. I don't think that typographic branding or identity can be accomlished easily on the web without the use of graphics, Flash or SVG.

Consistency and pleasant on-screen presentation can be achieved in your type and you can rely more on your colour scheme, page layout, and page title header for ID and brand distinction.

If preserving Bookman is that important and you have about 10-20 titles to set each quarter, I think that it's reasonable to make title GIFs by hand. As long as you are aware of the threshold that Hrant has indicated and can live with that for an odd user or two.

In a case like this, plan a single title block size (that maybe allows for two lines) and build all your titles as layers in the same document over time. It will help speed you production and maintain consistency.

I was just reviewing your site, and I like its look. It looks educated but friendly in a newspapery kind of way with the all cap titles. And in truth, using Georgia doesn't make me think I'm at any other site than The Metatastic Whatnot.

Jon (the over-explainer)

Daniel Poindexter's picture

Thanks, Jon (and others). I appreciate the advice, and I'm glad you like the site. I'll really think about doing the image headers. It would give me a bit more freedom, and I could even look at using a nicer font in that case. Based on the feel of the site, what would you recommend? Something like a Hoefler or Caslon, maybe? Didot might also work well in all-caps, but I think it might be a little too cold.

In fact, just after lurking on this site for a month or so, I'm having to go back and reaccess many of my extant typographic images as just plain clumsy. Thanks for multiplying my work.

Jon Whipple's picture

Daniel, just wanted to say stay away from Didones unless you're setting them at pretty large sizes. I have to contend with Bodoni Book as part of my library's CI.

I've found that I really can't go any smaller with the logo at this site without it looking blurry and nasty and illiciting strong negative comments from many quarters. So my experience is it's less about coldness than resolution of the fine serifs and radical think and thins at smaller sizes.

BTW: If you stare at the line 'Vancouver Public Library', the words appear to grow in size with 'Library' beginning to look positively large compared to the 'Van'. An optical illusion that makes me crazy.

Let us know how your refinements go.


jonny's picture

For your reference this is what your web page looks like on a system with out Bookman Old Style.

cjg's picture

As for the prevalence of Georgia on the web, I believe weblogs using Movable Type or Blogger as backend use Georgia in their default CSS stylesheets. So there's a good bit of it out there, but that doesn't necessarily make it bad.

IMO, having a well-designed page that mimics a printed page will look outstanding with Georgia as body text, certainly better than any other commonly-available Web font.

Syndicate content Syndicate content