The Wall of Sleep gets a new coat of paint

Dan has completed his redesign of From Behind the Wall of Sleep, and he's seeking reader feedback.

He has a Colophon, which is one of my favorite features, especially when my name is included. <blush> In a fit of deliriousness, Dan lobbed me a softball of a CSS question and in that miraculous moment of blind flailing that happens only in sappy movies, I hit it. But I appreciate the nod, just the same.

Dan mentions disappointment that his font of choice, ITC Souvenir, doesn't have oldstyle numerals. The fact that he's looking for a monospaced font rules this out, but Georgia is perhaps the best font around with such numerals, and it was designed specifically for screen display. I've used it on a couple of client websites and it looks classy. Never mind that it was created by Microsoft.

Comments

You know, I actually like Georgia, Verdana, Trebuchet, etc. Microsoft did a good job with those.

And I used to have a typewriter, many years ago, that had an elite face. I thought it also had old-style numerals (with ascenders and descenders). They keys all stuck together somewhere between California and Japan; foolishly, I threw it away.

I think it was an Italian machine. Back then, we called them “mills.” It might have been French. It was not an Olivetti, but I don’t remember the name. I got it from a Turkish linguist at a garage sale.

By the way, why can’t I get them in a monospaced typeface? Aren’t numbers set to the same width, anyway? Numbers always need to line up…?

Frankly, I don’t remember. But I do like Souvenir

Posted by: Daniel Morris at October 15, 2004 02:49 PM

Dan, you're right, of course, about numbers being "monospaced" in almost any mainstream font, for precisely the reason you mention: columns of numbers need to be properly aligned.

If you didn't mind mixing and matching, you could use numbers from a font like Georgia and all other characters from Souvenir. Bit of a pain to implement, of course, but easy to set up a CSS class to use with a span element, like so:

Friday the <span class="numeral">13</span>th

where "numeral" is defined as

.numeral {font-face: georgia, souvenir, serif;}

Georgia may be optically larger than Souvenir so you might have to decrease the size to, say, 95%.

Haven't tried this, btw...YMMV! ;-)

Posted by: Eric at October 15, 2004 03:16 PM

dumb, dumb question . . .

What's a "colophon"?

Posted by: Bill at October 15, 2004 05:53 PM

So, Bill...I see you're not using Netscape 7.2 for Mac, which allows you to highlight a given word, right-click and do a search on it, which then would lead you to a definition similar to this:

An inscription placed usually at the end of a book, giving facts about its publication.

As an example, all the O'Reilly technical books have colophons, and they're unique in that they give a detailed description of the animal pictured on the cover (sort of their trademark -- their book on CSS features salmon, presumably because they jump a lot in streams. Get it? Cascading...jumping...streaming. Yeah, a bit lame.) They also describe the software used to create the book, the fonts, and also the people involved in the technical process of creating the book.

Posted by: Eric at October 15, 2004 06:01 PM

Eric, that’s a neat trick; I never would’ve thought of it. Tomorrow, I’ll give it a whirl, after I re-read Eric Meyer on CSS.

And, Bill, don’t despair if you’re not using Netscape. You can get definitions in any browser that supports JavaScript (uh, ECMAscript?). Just use a bookmarklet:

javascript:s='';function%20gS(w)%7Bfor(var%20i=0;i%3Cw.length;i++)%7BgS(w.frames%5Bi%5D)%7D;try%7Bs+=w.window.getSelection()%7Dcatch(e)%7Btry%7Bs+=w.window.selection.createRange().text%7Dcatch(e)%7Bs+=''%7D%7D%7DgS(top);if(!s)%7Bvoid(s=prompt('Term%20to%20look%20up:',''))%7Dif(s)location.href='http://www.m-w.com/cgi-bin/dictionary?va='+escape(s)

(Create a bookmark, save it, and paste the code where the URI normally goes. I keep mine in my bookmark bar, where it’s just a click away. The code here should take whatever you’ve selected in your browser, and fetch the definition from Merriam-Webster. If you didn’t select anything, it should ask you for a word. I haven’t tested it extensively, but it works in both FireFox and Safari on the Mac.)

Posted by: Daniel Morris at October 16, 2004 01:44 AM

Bookmarklets are cool, yet I consistently forget about them...

Posted by: Eric at October 16, 2004 06:24 AM
Post a comment [Take your time...we're in no hurry.]









Remember personal info?