Tuesday, August 6, 2013

DIY Blog Design

If you're anything like me, after you've been blogging for awhile, you start looking at everyone else's blogs and wishing yours looked like theirs.  How do they get that cute font?  What about those adorable social media buttons?  Why doesn't yours look so clean?  You could hire a blog designer to give you exactly what you want.  But, if you're cheap frugal like me, you might want to consider doing the design yourself.  
Because blogging is a hobby for me (albeit a time-consuming, slightly profitable one!), I couldn't really justify spending a chunk of change on a blog overhaul.  So I turned to the Internet for help.  And, I was also thrilled that this was a topic at last year's Online Blog Conference!  I came across some great tutorials, and I'm going to share some of them with you.  As a result of my "research", I completely designed our blog Occasionally Crafty by myself, using tips and tutorials from the pros.  All it takes is a test blog, a clear vision of what you want, and a little courage to try new things!





Before we get started- set up a test blog.  I am on Blogger, so I just created a new blog, named it Valerie's Test Blog, and set it to "private".  Now I can try out any coding or HTML there first without screwing up my actual blog.  Super important, right?  And here's a disclaimer:  I've only used these tutorials on Blogger and really have no idea how to personalize WordPress.  So if you are a WP blogger- you'll have to search elsewhere for help.  Maybe my WP readers can leave some resources in the comments? (hint, hint).  Still, I think everyone can learn something about DIY design from my experience- so please keep reading!
Ok.  Let's get started.  Here are the most important things (according to me, but based on experience and lots of research!) that you need to have when designing your own blog.

1) A CLEAR VISION OF WHAT YOU WANT
If you haven't already done so, take some time to browse your favorite blogs.  What jumps out at you?  What catches your eye?  What do you wish your blog had?  Take notes and figure out how to make those things work for you.
2) A HEADER THAT CATCHES YOUR READER'S ATTENTION
I don't know about you, but most of my traffic these days comes from Pinterest.  That means most of the people coming to my blog are new visitors- and I want to convert them to loyal readers!  A header not only includes the all-important name of your blog, but it shows a little bit of your personality, and ideally gives your visitors a way to find you on their favorite social media platform.
Think about including a tagline.  Let them know what your blog is about, especially if it's not obvious in your name.  If your blog is called 123 Cherry Tree Lane and is all about sewing- well, you might want to explain that somewhere.
As for helping people find you, you'll notice I have my social media buttons in my header, and they are clickable (in my actual header- not this image). If, for example, one of your visitors isn't an avid blog reader but loves Twitter, showing them they can you find you there is a huge plus!
Another option is to put the social media buttons in your sidebar.  If you choose to do it that way, make sure they are at or close to the top and easy to find!
Click here to find some really cute social media buttons for your blog.
Click here for a great tutorial for installing them from My Favourite Things
Design your own header with PicMonkey using this tutorial.
Here's how to make any image in your header clickable (Image-Mapping).  Thanks Something Swanky!
3) A CLEAN DESIGN THAT SHOWS YOUR PERSONALITY
I highly recommend that the main part of your blog is a white background with a fairly standard font in black. If I have to struggle to read your font, I'm clicking away and I'm not coming back.
However, it's fun to have some fun or creative fonts for blog post titles and for your sidebar titles.  A GREAT tutorial for installing these on your blog can be found here, as well as some really fun fonts here.
Let the background pattern or image show off your personality.  There are a bunch of sites that offer free blog backgrounds, and those are great when you're starting out.  But since they are free, ANYONE can use them, which means you'll see "your" design on other blogs.  Why not find something completely unique to you for a background?
The Cutest Blog on the Block teaches you how to make a cute scrappy background in Photoshop here.
Something Swanky has a great tutorial to learn how to design your own custom background in PicMonkey.

I wanted diagonal stripes, so I used the stripe generator here, then installed it as a repeating image following this tutorial at Blogger Buster.  You could use that same tutorial for polka dots, chevron, flowers, or really any image you want to continue across your whole background.
4) A FOCUS ON YOUR CONTENT
Readers come to your blog for your content, be it recipes, crafts, or to read your thoughts.  Make your content the STAR.  You can do that by de-cluttering your sidebar, getting rid of distractions like music playing, and improving your content space.
I made my text area extra wide.  This gives me plenty of room for extra-large photos to catch my reader's eyes.  If you want to do the same, here's the tutorial I used.  
5) SPICE IT UP WITH ATTRACTIVE EXTRAS
There are some things you NEED to have on your blog, like a navigation bar for your different pages, a photo or "About Me" box, and a way for people to get in touch with you.  
I suggest starting here at Something Swanky and see if she has what you're looking for- her tutorials are easy to follow!

Then there are things that add a little something extra to your blog, but aren't technically necessary.  This is where you can really have some fun making your blog look just how you want it.  Get those typing fingers going and search online for tutorials for exactly what you're looking for.  There are many people willing to share their knowledge with you, if you just take the time to search them out.  
6) DO WHAT MAKES YOU HAPPY
In the end, it's your blog.  You have to stare at that thing every day, and things will start to bug you if they're not quite right.  Even if "everyone" says to do something but you just aren't a fan, stay true to yourself and your vision.  There are as many blog designs as there are blogs, and they all have success despite their differences.  
I'm going to close this (rather lengthy) blog post with a list of some of my favorite blog designs so you can get started with some inspiration for yours.  Good luck, and have fun designing!
Visit Vintage Revivals to see how Mandy makes her content the STAR!
Visit Crazy for Crust to see one of my favorite headers (and I love Dorothy's post title font!)
I love, love, love the background at Love Grows Wild.  (Really, I just love Liz's whole blog!)
Lolly Jane is the epitome of a blog that represents the style of its authors, Kelli and Kristi.  I love everything about it!

***If you found this helpful at all, register for this year's Online Blog Conference, where you'll learn even more tips to help you grow, maintain and improve your blog and blogging skills.  I'll "see" you there!***
  Image Map

4 comments:

Heidi@OneCreativeMommy.com said...

Great post, Valerie! I'm on wordpress, and most of what I've learned about design has been online forums. I just did a quick google search and found this article that links several helpful tutorials for WordPress beginners.

Thanks for the great tips!

Unknown said...

Thank you for this post! I'm celebrating 1 year of blogging and realize I need to do some re-vamping. I am also a part-time blogger, so I know my husband would rather I did it myself than spend our cash to get it rehauled.
Cindy @ Crazylou

Unknown said...

Great advice, girl! And thank you so much for the sweet shout-out! Hugs : )

Losing Wicked said...

This post was so helpful! I'm a newish blogger with so much to learn and this post is exactly what I needed. Thank you for sharing such great tips! I'll definitely look into Online BlogCon :-)

Lena @LosingWicked