guillermo, out of repose

My XHTML is stricter than your pops

Redesign done. I’ll now get into the details.

Design

So I was flip­ping through the pages of bon appetit’s Novem­ber 2009 issue (the sub­scrip­tion was a gift from my wife, who loves me enough to stop mak­ing fun of me for a few sec­onds every day and accept my odd habits and hob­bies… like spend­ing 20 min­utes a day read­ing about food after din­ner) last week, check­ing out all of the great Thanks­giv­ing recipes. I read through a bunch, dreamed up a fea­si­ble hol­i­day menu, and then reached page 147, which is essen­tially a mus­tard page fea­tur­ing sev­eral menus. My imme­di­ate reac­tion was this color is incred­i­ble. Sec­ond to that was this is what out​ofre​pose​.com is going to look like. I broke out the sketch­book and started play­ing around with some ideas — none of which, besides some about color, are present in this design — then hit the Mac­book Pro. I knew I’d be using Baskerville as the pri­mary type­face because, sim­ply put, right now it’s my favorite type­face. Wasn’t sure what the sec­ondary one would be, though, until I was a few hours deep into the PSD, and decided to limit myself to that one font. See­ing the use of text-shadow at Jina Bolton’s Sushi & Robots made me want to give it a shot. This is prob­a­bly a good place to start talk­ing about the pre­sen­ta­tion code…

XHTML, JavaScript & CSS

As the title implies, the markup val­i­dates as XHTML Strict (if you’re on a page that doesn’t val­i­date, please let me know), and I tried to keep it as seman­ti­cally sound as possible.

There’s a JavaScript file being called, but it’s empty for now because I don’t really need any client-side action.

Eric Car­roll and I had a con­ver­sa­tion (that he prob­a­bly doesn’t remem­ber) about the great flex­i­bil­ity the @import rule pro­vides in terms of orga­niz­ing stylesheets, sep­a­rat­ing them by func­tion or some other cri­te­ria. In going through Ms. Bolton’s site, I came across an arti­cle she wrote that dis­cussed that flex­i­bil­ity at some length. I’ve imple­mented the idea before, but not to the same extent that I have in this cur­rent design. I’ve put my reset styles (cour­tesy of Eric Meyer, of course) in their own file. Typog­ra­phy (font/text related rules), lay­out (mar­gins, col­ors, etc.), and grid (the base lay­out struc­ture) styles also exist in their own stylesheets. I call all of those stylesheets from the Word­Press theme’s main stylesheet.

Theme Files

I’m not sure how com­mon of a prac­tice this is, but I find it eas­i­est to keep my single.php, index.php, and page.php files iden­ti­cal and let my functions.php file do all of the dirty work. Here’s what they look like:

<?php get_header(); ?>
<?php oor_get_content(); ?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

oor is the pre­fix I use for all of my cus­tom func­tions. oor_get_content() (which I’m chang­ing to oor_show_content() for con­sis­tency, as I’m using the oor_get_ pre­fix for func­tions that return data instead of print­ing it) con­tains some con­di­tional func­tions and the almighty loop. I fig­ured I’d fol­low the DRY prin­ci­ple and just han­dle the loop in one place. I cre­ated some func­tions to replace some old plu­gin func­tion­al­ity that was dirtyin’ up my head tag, and wrote one com­pre­hen­sive plu­gin to hook into Word­Press actions. Every­thing else — search, com­ments, etc. — is pretty straight forward.

Plu­gin Development

For now, all my plu­gin does is update my twit­ter account when­ever I cre­ate a new post. It short­ens the URL with Tinyurl using cURL. I’ll be adding some admin options soon, once I have a bet­ter idea of what I need.

That’s it, folks. Hope you like it. If you don’t… ah well.

UPDATE: I threw some code into the JavaScript file to han­dle analytics.