My XHTML is stricter than your pops
Redesign done. I’ll now get into the details.
Design
So I was flipping through the pages of bon appetit’s November 2009 issue (the subscription was a gift from my wife, who loves me enough to stop making fun of me for a few seconds every day and accept my odd habits and hobbies… like spending 20 minutes a day reading about food after dinner) last week, checking out all of the great Thanksgiving recipes. I read through a bunch, dreamed up a feasible holiday menu, and then reached page 147, which is essentially a mustard page featuring several menus. My immediate reaction was this color is incredible. Second to that was this is what outofrepose.com is going to look like. I broke out the sketchbook and started playing around with some ideas — none of which, besides some about color, are present in this design — then hit the Macbook Pro. I knew I’d be using Baskerville as the primary typeface because, simply put, right now it’s my favorite typeface. Wasn’t sure what the secondary one would be, though, until I was a few hours deep into the PSD, and decided to limit myself to that one font. Seeing the use of text-shadow at Jina Bolton’s Sushi & Robots made me want to give it a shot. This is probably a good place to start talking about the presentation code…
XHTML, JavaScript & CSS
As the title implies, the markup validates as XHTML Strict (if you’re on a page that doesn’t validate, please let me know), and I tried to keep it as semantically 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 Carroll and I had a conversation (that he probably doesn’t remember) about the great flexibility the @import rule provides in terms of organizing stylesheets, separating them by function or some other criteria. In going through Ms. Bolton’s site, I came across an article she wrote that discussed that flexibility at some length. I’ve implemented the idea before, but not to the same extent that I have in this current design. I’ve put my reset styles (courtesy of Eric Meyer, of course) in their own file. Typography (font/text related rules), layout (margins, colors, etc.), and grid (the base layout structure) styles also exist in their own stylesheets. I call all of those stylesheets from the WordPress theme’s main stylesheet.
Theme Files
I’m not sure how common of a practice this is, but I find it easiest to keep my single.php, index.php, and page.php files identical 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 prefix I use for all of my custom functions. oor_get_content() (which I’m changing to oor_show_content() for consistency, as I’m using the oor_get_ prefix for functions that return data instead of printing it) contains some conditional functions and the almighty loop. I figured I’d follow the DRY principle and just handle the loop in one place. I created some functions to replace some old plugin functionality that was dirtyin’ up my head tag, and wrote one comprehensive plugin to hook into WordPress actions. Everything else — search, comments, etc. — is pretty straight forward.
Plugin Development
For now, all my plugin does is update my twitter account whenever I create a new post. It shortens the URL with Tinyurl using cURL. I’ll be adding some admin options soon, once I have a better 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 handle analytics.