The Hacker Chick Blog Makeover

Hacker News LinkedIn Google+ Facebook Twitter by Abby Fichtner

Finally finally got my new blog design up. This is my first time with WordPress (old design was on Blogger) and, of course, being the hacker chick, I couldn’t quite content myself with using an off-the-shelf theme, so it’s all built from scratch and am looking forward to hacking evolving it over time.

Old BlogNew Blog

I did manage to learn some blog design fu in the process so thought I’d share a bit about the why and the how

Why?

This started as a “just ‘cuz.”  I so get a kick out of the brilliant, clever, shocking and crazy fun blog designs people do and I wanted to take a stab at it myself.  I also questioned whether blogs always have to look like blogs (my favorite by far is Jason Santa Maria’s site which takes more of a magazine-type layout approach to his blog) and I love the idea of making layout a 1st class citizen.

But, sadly, staring at a blank slate in Photoshop with the goal of “making it look cool” doesn’t really get you very far, so I came up with some goals that I wanted to get out of the redesign…

Readability/Ease of Finding Stuff

I felt like there was so much going on in the old design, it was distracting. I wanted something cleaner — more whitespace, with the “extras” clearly grouped so it made it easier to just focus on whatever you were interested in without 50 different things competing for your attention. Interestingly, the new design has more elements then the last, but it feels less busy.

I used a lot of ideas from Jim Krause’s Design Basics Index, which has been a great help & I’m only part way through it.

Interactive

I really want The Hacker Chick Blog to be more dynamic and interactive. Part of this is simple things like mouse-overs to give you more information (like over the social network icons in the header or, better, over The Big Room in the footer, where you can mouse over images of events I’ve been at to have me tell you about them).

Connecting with You

But an even bigger part of being interactive is letting you have a voice.  I’m keeping JS-Kit’s Echo in place, which pulls in some of your buzz about The Hacker Chick Blog on social networking sites, along with the twitter feed (just mention @HackerChick and it’ll include you).

I also added a Top Commenters to thank you guys who are sooo awesome in taking the time to leave comments (thank you!). I did this by hand based on the comments on blogger, of which, sadly, only a small portion survived the migration, something I’m truly sorry about! I don’t have icons for everyone so you’ll just have to comment more so I can fill that out :)

Let You Know What I’m Up To

I know I don’t blog as often as some but I’m always out there at events – software groups, conferences, and now with the new job I’ll be at lots of events for startups and web designers/developers – so I wanted a way to share that.  Thus, The Big Room shows pictures from recent events, which you can read about by mousing over them, or click through to go to the event’s page.  And, a list of snazzy Upcoming Events that are on my radar.  Let me know if you’ll be at any of these, would be way cool to meet you.

Those were the main goals. My hidden agenda, I suppose, is that I’m looking forward to learning more about web design as I get to work with amazing web designers and so I wanted more hands on experience with it myself.

How?

Stay tuned and I’ll follow up with some posts on the How I built the custom theme in WordPress.  And also a little more about how I’ll be working with web designers & developers – which I’m totally psyched out. A big part of it is through the WebsiteSpark program (pssst, free swag & support for small web shops!).  So if you’ve got a small web shop in the Northeastern US, lemme know and maybe we’ll get to work together.. or, if nothing else, I might hit you up for design tips. ;-)

What do YOU think makes for a good blog design?   What are some of your favorite blog designs out there?