A few days ago, I managed to work through part 3 of wpdesigner.com’s WordPress theming tutorial. This left me with a locally installed copy of WordPress, a plethora of test posts (which are invaluable), and a rudimentary theme. And perhaps most important of all, I learned a lot about how a WordPress theme works (and a little bit about php along the way too!).
So now I’m mulling over how I want this blog to look. I’ve been following Lauren’s posts over at Creative Curio which have provided valuable discussion on the topics of design and layout. I’m probably going to go with something infinitely more pedestrian than Lauren. I’ve also been mulling over the huge amount of examples at Design Meltdown and I think I’m zeroing in on something closer to minimalistic. While I like these types of sites, I can’t deny that a minimalistic design might also be easier to code! :) It’s really the css part of things that scares me more than anything.
I’ve also finished reading Dan Cederholm’s book Bulletproof Web Design, and that has taught me that things may not be as difficult as they look. Most of the methods he uses for things like rounded corners and expandable boxes make common sense and are easy and clean to implement. That bodes well for a CSS simpleton like me.
So for now, I’ve come up with a very rudimentary layout. It’s pretty much a standard two-column layout but I’ve added a left column to hold the ‘header’ image. I decided to put in the side purposely just to avoid the header+2columns+footer monotony that seems to prevail in WordPress blog designs. Does shoving the header in vertical left side column change that? Likely not, but we’ll see where it goes. I’m not fixed on the layout, it’s likely to change, but it’s a starting point. I’m also determined to likely keep everything white -especially the posting area- since I’ve been stung by posting images and photos on top of a weird background color only to be disappointed that things look better when they show up in Google Reader than they do on the blog itself.
In the end, I want the design to be clean with a generous amount of whitespace. For now, I’m thinking of marking off the various areas with curved corner hatches, likely very thin and grey coloured to denote the different areas without loading up the page with images: