No Commercial Potential: Trying is just the first step toward failing.

begin text

Aggressive Em-hancement 1 April 2008

So Coudal Partners launched a new one-page site for their Seed Conference yesterday. I found the very tidy all-text design to be quite impressive, but (always a but) I also thought this page is a perfect candidate for an em-based stylesheet.

And I even said so.

But really, what are the chances that anyone working in the wacky, circus-like atmosphere that is CP would ever get bored?

So I took an hour and em-hanced their page for them.

  • While it’s not a 100% dead-on to-the-pixel recreation, it’s really, really close. At least in Safari 3.1, Firefox 2.(something) and Opera 9. Didn’t test in IE anything because I couldn’t be bothered to fire up Parallels and that wasn’t really the point.
  • The layout doesn’t asplode if you change the text sizes.
  • It is no longer using <br />s to insert space between block elements. (For shame, CP!)
  • The only measurements specified in pixels are the letter-spacings, just because it’s too much stupid math where “-1px;” does the job just fine.

The moral of the story is: ems are good. The end.

Of course what I really want to know is, when am I getting something back from the Swap Meat?

Comments

Andrew

1 April 2008, 16:07 #

Wow, great job Phineas!

coudal

1 April 2008, 16:10 #

Well, the whole thing started because I got so pissed off at how much web type justification blows, so I decided not to use any and “hand-set” all the line lengths. For this task pixels made a lot more sense. For me anyhow. Yeah, the <br/>s are lazy, I’ll fix that.

But thanks for paying attention. Swap Meat? What’s that?

jim

Naz

1 April 2008, 19:10 #

Super nice work Phineas, I agree, it was perfect for em-hancement.

Greg

2 April 2008, 08:42 #

Great job Phineas. Tested on Safari 3.1 and works great.
I hear alot of designers saying not to worry about em since future browsers will automagically support resizing, but too many idiots don’t upgrade their browsers.

Thanks for mentioning the swap meat, that looks like fun.

Chris Pearson

7 April 2008, 18:25 #

I cursed the real S33D page when I first visited it and resized it (as is my habit with every site that is typeset deftly), so it was a keen pleasure for me to visit your em-hancement page and give it the ole’ resize @times; 2.

I dig it.

Brady J. Frey

23 April 2008, 17:11 #

Beautiful job reworking that! Reminds me I need to jump off the px train and rework all my company sites.