Giving WordPress That New Car Smell (Part 1)

It’s been a while since I redesigned my sites, and this isn’t something I do very often. I also have a tendency to stick to a ‘theme.’ For the longest time, I was really homogeneous with the sites on this server. All my Ipstenu sites ran Retro Fitted and then Twenty Eleven. As we got near 3.4 I was all set to shift to Twenty Twelve, but when that was kiboshed, I sat and thought “Well, what do I want?”

Redesigning a site is not to be taken lightly. As I mentioned before, too many changes confuse your visitors. For the last few years, I’ve kept my sites pretty much the same, and this is normal for me. I mean, look at the designs for JFO! Clearly I find a style and stick by it. I don’t consider myself a ‘theme designer’ person, either. I can tweak the hell out of a theme, but inventing them? No way. I’ve never been very good at the part of art where I’m supposed to take an idea and make it visual. Oddly, I can do it with words and ‘people’ (think directing a play), but while I can see these things in my head, putting it down on paper fails me.

So why the dramatic change from everything the same to everything different?

Everything should be made as simple as possible, but not simpler. There’s a theme through these themes, actually. They’re all simplistic, focusing on the content in a way that I can, easily, shove the sidebars out of the way when needed, and showing you what’s important. I didn’t want to get distracted by bells and whistles, but I also wanted a theme that was easy to tweak. Ipstenu.org I wanted to look a little more grown up, Half-Elf needed to be more professional (but still as irreverent as I am 1), and my photos needed to be about photos and nothing more. I also didn’t want to fuss with colors too much, they can be a big distraction, and just putting up a black/white with accents felt ‘right.’

Once I committed to simplification, I cut down my menus while keeping them similar to what they were, and I kept my favicons as they were (though Half Elf has been sporting a Spock eye for a week now). Menus are tricky. You want people to find what they want, quickly, but you also want to guide them to where you want them to be. By cutting down the clutter, and having a little down-arrow on menus with drop-downs, I can gently nudge people around.

Buzz-words annoy me, and I try to avoid terms like ‘call to action’ whenever possible. Instead I thought of as the purpose. I like using ‘static’ content on front pages for that, as they can explain why you’re here, show you what’s new, and grabs you. The new Half-Elf page really does that, with the big honking ‘ad’ for the book. The haiku keeps you thinking ‘This is Mika,’ and the rest confirms that. On Ipstenu.org, the sales pitch is smaller, but you still have a little ‘who am I?’ blurb to get you started. While I wanted it to look grown up, I really felt the ‘feel’ of me had to stay. That’s the only site where you’ll see my Twitter stream, for example. As for the photos, well, they were simple.

I drew out what I saw in my head on paper a few times. A header, a menu, a ‘grab you’ blurb, and the content. It’s a good layout for me, I felt the eyes naturally flowed. Sorting out where on Half-Elf to put that ‘recent post’ inset was tricky, as I wanted it to be ‘above the fold,’ if you’ll pardon the archaic reference. Speaking of, all these themes are ‘responsive’ so if you shrink your browser, they adjust. Except for the leaderboard ad in the footer. I need to sort that out. 2 This does not contradict my drawing deficiencies I mentioned before, by the way. When I ‘drew’ my layout, what I did was grid it out. That part wasn’t ‘art’ and I didn’t try to make anything pretty. I just made a list of what the themes needed in black, what I wanted in blue, and what I knew would be custom work in red.

I ended up with three premium themes that I’ve added functions and style to, but that’s it. While I may have made child themes, there’s no duplication of code. That is, my child themes have two files (functions.php and style.css) and possibly some images. That’s. It. halfelforigin is the child for Half-Elf, ipstenubalance is for Ipstenu.org, and photodotos is for the Photo site. The first half of the name is the site, the second half is the theme. I’ve always done it this way, which is why I also have an ipstenu2011 folder in there.

Oh, and why does the ipstenubalance not have a style.css? We’ll get to that.

But that will have to wait for the next post, where I break down each theme, what I liked and disliked, and what code I wrestled with. It’s a little longer than this post, which is why it’s split up.

By the way, the title is thanks to Ryan, who took my joke seriously.

Notes:

  1. In talking to Dana Severance, she asked what my ‘voice’ was for my ebooks. I said ‘Ms. Frizzle, after 10 years in corporate America.’ And it’s true.
  2. What I want is for if your screen is less than X wide, it vanishes. Maybe I’ll play with hiding the overflow.
StudioPress Theme of the Month

Comments

  1. Firstly, I’m honored to have a minor shout-out. I think it’s my first one! :oops: Sometimes taking a joke seriously works out for the best!

    I think if this is the kind of look you’re going for, you are definitely going about it the right way. All good designs start with wireframey grid anyway, and sometimes there’s no reason to take it any further than that. If this is part 1 then I look forward to part 2-whatever

    • I may slowly add in a little more color for the line separations. Most of my headdesking has been Facebook ignoring the fact that, yes, I put your stupid code in my header. Google sees it just fine. FB I had to resort to an iframe to render.

  2. I’m not the one who can paint the Mona Lisa, but I’m the one to help you when you say “The Mona Lisa’s great, but I wanted her hair to be red…”

    I think that’s the best analogy I’ve got.

Half-Elf? Try Half OFF WordPress ebooks!