Skip to content

Challenge

Interact! 7 blog layout tips to engage your reader

Why is it that we blog? Why not just write in a journal? The specific answers may vary, but in the end it all comes down to the audience – the readers.

Maybe you want to make people laugh, maybe you want to offer people help, maybe you want to share stories, maybe you want to draw traffic to make money. It’s all variations on a theme: finding readers. Because if we didn’t want readers, we would just write in in a private journal. So when people land on your site, if they are your target readership, you want them to stick around, get to know you and get hooked! What should be at the top of the page? What should be in the sidebar? Today’s post is 7 blog layout tips to keep people on your site, and to encourage them to interact with you – largely by subscribing and commenting. You know it’s what you want! :)

And as in all the previous posts in this blog redesign series, my friend Lori’s blog, “In My Kitchen, In My Life” will serve as the example where I’ll be making these changes. So here we go!

Comments are like candy for a blogger. I LOVE comments. It lets me know people are reading – and it lets me know what they are thinking about what I’m writing. Comments give you great feedback on what people want more of, what people find especially helpful, and plus, they’re just fun! Here are some hints to encourage commenting:

‣‣‣ Make sure your readers know you WANT comments! Don’t be bashful. At the end of your post, put a clear “call to action” asking people to leave their thoughts and letting them know you enjoy hearing from them.
‣‣‣ You can take it a step further and instead of asking for comments in general, pose a particular question that you would like comments on, and include that in the “call to action”.
‣‣‣ Make it EASY for them to comment. Avoid using CAPTCHA like the plague, and if possible, just provide a place for name/email/website rather than making them sign in to comment.
‣‣‣ Have a blog design that allows threaded comments so people can respond to each other.
‣‣‣ Once someone leaves a comment – reply to it! Especially on your most recent posts.
‣‣‣ Realize people comment about your blog elsewhere than your comment section. Provide social sharing buttons at the end of the post to make it easy for people to share and comment on your blog on sites like Facebook, Twitter, Pinterest, etc. (Helpful tip: if you’re curious what people are pinning and saying about your site on Pinterest, just go to pinterest.com/source/YOURDOMAINHERE.com … just put your domain name where it says “your domain here”. For instance, mine would be pinterest.com/source/theflourishingabode.com. See what people are pinning and commenting there, too!)
‣‣‣ Consider some WordPress plug-ins that make commenting even more friendly for your readers! For example, Lori wants “Comment Luv” on her blog. That’s the handy little feature that includes a link to your readers’ most recent blog post along with their comment. You can find this, and other commenting-friendly features, in the plug-ins section of your WordPress dashboard. Just click “add new”, search for the plug in, and when you find it click “install now”. Then once it has installed, click activate! Easy-peasy – now CommentLuv is installed on her site! Some plug-ins have options, and you can edit those under the “Settings” section of your WordPress dashboard.

So there are some ideas on encouraging comments. But before you can get comments, first you need readers to stick around and feel engaged enough to WANT to comment. (By the way, I’m totally hoping to hear from you in the comments of this post!) Plus, you’re hoping they’ll subscribe so they’ll be back for future posts. The rest of the tips address those issues.

If you’re not familiar with the term “above the fold”, it just refers to the amount of a webpage that you can see before you scroll down. If you have to scroll down to see it, it is “below the fold”. First impressions really do make a big difference – if someone lands on your blog and they don’t like what they see above the fold, chances are they’re not going to take the time to scroll down and investigate further.

Bear in mind “liking what they see” isn’t just style, but also whether it looks easy to use and navigate. It might have lots of pretty elements, but if there are a gazillion different things going on, and they can’t tell where to go or what to do – people generally aren’t going to stick around. So usability and navigation is a HUGE part of it. There is also the style side, of course – but bear in mind, like we talked about before, you’re not trying to appeal to everyone, you’re trying to appeal to your target audience. One big part of the style showing above the fold is your banner, like we talked about last week.

Whatever it is you’re going for on you blog, the area above the fold should “hook” your target audience. The style should speak to them, the navigation should be easy, and it should be clear what they can expect. In deciding your layout, remember that above the fold is the most valuable space on your website, and you should make sure it is high impact. But *how* to do that? On to the next tips…


In this online world of computers and information, one of the reasons we are drawn to individuals’ blogs, or small handmade businesses and so forth on the internet is because of the PEOPLE behind them. When we meet someone, we can see their face, and their personality in their appearance. In your content, you should also be conveying who you are and your personality … but in general it’s still a lot easier to “connect” if you can actually see the person. A nice well-lit photo that conveys your personality near the top of the page is a GREAT way engage your visitors – let them see you! Lori has this *fabulous* photo of her and her husband – I just love all the personality and joy in this photo. Plus, it starts cluing you in to the fact that her blog is about home and family right away:

I think it deserves to be above the fold. It’s welcoming, important and creates a connection. So I put it at the top of her sidebar (and check it out – her branding colors are even incorporated in her photo! Just like my colors are in my photo. Ka-pow!):

Ok, pull back out your branding printable from week 1. (I told it would come in handy!) One of the questions on that first page was, “Someone has just landed on your blog and wants to know what it is about: Describe your blog in 50 words or less.” If you answered this question (and kept in mind that you’re explaining your blog to someone who just landed on your site), then you now have a great little blurb to use on your site! Here is Lori’s blurb: “In My Kitchen, In My Life is a place where women (and the odd male) can be encouraged, nudged, and occasionally kicked in the pants toward living their lives on a higher plane. Oh, and readers get plenty of chances to laugh at the author’s foibles, which is always worth a click.” Have to say, I love her style. :)

I’d recommend having either a little description of yourself or of your blog right below your photo. On my blog, I have a description of myself there, and I have my blurb a little farther down the page under the heading “so … what’s this place all about?”. Here is Lori’s blog with the blurb put right below her photo:

So, let’s say someone has landed on your site. Your banner speaks to them about what your site is about, they see your photo and feel a connection to you, the writer, and then they read your blurb and think to themselves, “Wow, this is right up my alley!” The content they came to read is helpful, and they’re liking what they see. They are your target reader. Maybe they leave a comment, maybe they browse around some more. They think, “Oh, I like this blog!” And then they leave to go do something else and you never see or hear from them again.

What was missing? Subscribing. But if you really want people to subscribe, you NEED to make it easy and obvious – don’t make them hunt for it. I’ve heard this as good rule of thumb – ask a friend to look at your blog and if it takes them more than 5 seconds to find where to subscribe, you need to change it. Ideally, it should be above the fold or JUST below the fold.

I also think it’s a good idea to have additional places to subscribe at places on your blog where a reader has reached a point of “commitment”. For instance, if they read a blog post and make it to the end, or if the decide to leave a comment, or if they make it to the bottom of your website, there can be an option there to subscribe. If they’ve made it that far in, give them another opportunity to keep in touch.

But what kind of subscription should I offer? RSS? Email subscription? A weekly newsletter? Or what? This will vary somewhat depending on what type of blog/site/business you have and your personal preferences. You have to weigh the pros and cons. For me, email subscription to my blog itself has been by far the most popular way to subscribe, though I do offer RSS as well, and I also tried a newsletter. Just to illustrate – I officially launched this blog in January, and I now have 524 blog subscribers by email, but just 106 subscribers by RSS/readers. I had tried a newsletter in the past, but personally, I found a newsletter to be extra work and less effective because I had more to share than I could reasonably put in a weekly newsletter. I definitely prefer just offering blog subscription, and putting anything I would put in a newsletter into a blog post. *shrugs* But that’s my personal preference.

We’ll be getting more into exactly HOW to set up email subscription, etc. to your blog in a week or two when I move Lori’s blog over to WordPress and get all that stuff set up more fully. But for now, I’ll just set up a place for it high on the sidebar with a button that incorporates her branding and design choices, like we’ve talked about before:

People who land on your blog won’t automatically know everything you have to offer .. and they probably don’t want to scroll back through pages and pages of posts hunting. You want to make navigating around your blog as easy as possible. Here are a few suggestions to help with navigation

‣ ALWAYS make sure you have a search bar for your blog on your page.
‣ Put blog posts in “categories” so the people can click on those categories and see what else you’ve written on the topic
‣ Consider including a category drop-down menu in the sidebar do people can browse and discover more content
‣ Consider having buttons in your sidebar that link to an especially good series/topic
‣ Consider building stand-alone pages/menus that give helpful lists of posts or give maps of your content (we’ll be talking about this more next week)
‣ Consider making a gallery of posts (like I have on my Tips & Tutorials page)
‣ Make sure your contact info is easy to find from every page

The sidebar on a blog is some pretty powerful real estate. For one thing, the sidebar is visible on pretty much every page of your blog. Different people will have different priorities for the sidebar. If you make money by ads on your blog, ad space is going to be important in your sidebar. But firstly, your sidebar IS your own! Make sure you’re using it for the things you need to use it for to make your blog user-friendly and easy to navigate. And if you don’t have ads, don’t feel the need to fill up your sidebar with just a lot of “stuff” – think about what will have the most impact and engage your readers. Your sidebar is valuable real estate, and that is what to remember in deciding what should go there. Here is what I’m recommending on Lori’s sidebar, and which I think are just good to have in general, most of which we’ve already talked about:

‣ at the top: a photo of her, a blurb about her blog and a subscription form (as we’ve already talked about)
‣ Branded buttons linking to series/features (to help with navigation to some of her best content)
‣ Branded buttons linking to her Twitter and Facebook page (to encourage connections on social media)
‣ A search bar (to help with navigation)
‣ A category drop down menu (to help with navigation)
‣ A “grabbable” blog button (handy tutorial for that here)

It’s too much to fit in a screen shot, so instead you can just go check it out and see the work in process on her blog here: In My Kitchen, In My Life. and within just a few weeks it will be time to transfer her blog over from Blogger to WordPress!

I hope these tips have been helpful … and I’ve also laid my secrets out on the table: I want to interact with YOU! I’m always thrilled to get a notification of a new comment. Let me know what you’ve found helpful, or even just say hi – it really does make my day. :) Leave your thoughts and comments below!

If you’ve missed the other posts in this series on DIY blog redesign, here they are:
Part 1: Discover your branding with “The Drawing Board” Printable
Part 2: WordPress vs. Blogger
Part 3: Design Tips + Design Worksheet
Part 4: Themes, Coding and Stylesheets
Part 5: Making your own graphics
Part 6: 7 Blog Layout Tips to Engage your Reader (This is this post!)
Part 7: Blog Page: The Must-haves and the Panache
Part 8: 25 Tips for using WordPress
Part 9: The Big Reveal
Part 10: 7 Ways to Promote and Market Your Blog

DIY Blog Design: Making your own graphics!

Ok, so we had a lot of groundwork to set before we got to this point – but at last we’re able to start designing our graphics! WooT! :D

If you’re new to this series, it’s a 10 part event that happens each Friday – so if you haven’t seen the previous posts, I’d recommend you go back and check them out to be able to get the most out of this post.
Part 1: Discover your branding with “The Drawing Board” Printable
Part 2: WordPress vs. Blogger
Part 3: Design Tips + Design Worksheet
Part 4: Themes, Coding and Stylesheets

And now, today, part 5 – we actually get to start making graphics! Several people expressed an interest in learning how I turned my hand drawn illustrations into graphics for my site – so I’ll be explaining that, plus talking about using photography for graphics (which is the medium I am using for the graphics I’m making for Lori’s site) as well as tips that I hope you’ll find helpful for whatever medium you are using. Let’s jump in! :)

Alright – first step, pull out your branding printable from part 1 and review your target readership and branding statement; keep it in mind in every step of designing your graphics. And look back at your design worksheet from part 3 – remind yourself of your design choice limits (like your medium, colors, etc.) as well as the design tips I included on that sheet. Make sure you stay true to your design choices as you start making your graphics.

So, as I’ve mentioned before, my friend Lori from In My Kitchen, In My Life has kindly let me use her blog as the demonstration for doing this redesign and move to WordPress. The branding statement we came up with from her branding printable was “Classic and cultured, done simply and down to earth”. On her design sheet I chose colors, fonts and the medium of photography. I consider these choices to be the “paints” I have filled my design palette with – whenever I need to design something for her site, these will be the “paints” I will use.

Today we’re going to work on designing a header. After the importance of not having a background that overwhelms your content, I would say what you put in the header is probably the single most important graphic on your site. First impressions really do make a big difference – and the header is right at the top. The header is actually the whole area right there at the top of your page … and often people have a banner there, which is what I’m going to be putting on Lori’s site. As I mentioned above, I’m using photography as the medium for her design.

A few pointers to bear in mind while making your banner:
– make sure your blog name is large enough and easy to read
– consider including your tagline on your banner to help people know what your site it about right away, but if it doesn’t work on your banner, it is not a requirement
– don’t forget the previous pointers on the effectual use of white space – sometimes less is more
– make sure the main colors in your banner are colors from your design choices
– ask yourself “does this banner fit my branding statement?”
– look back at your branding printable and look at what you wrote that you wanted to be people’s first reaction to your site — and realize that the banner is probably the first thing they will see and react to on your site

So, the next step is to just start playing around. Admission: I am a graphic designer … but that doesn’t mean the very first draft of a design comes out fabulous. Don’t expect the first try to be perfect. Don’t worry about messing up. Just have fun and play around with your ideas! If your medium is painting, try some different techniques, maybe some that are messier, and some that are neater. If your medium is pen and ink, cover your papers with assorted drawings – you can always just crop out the ones you don’t want! If your medium is photography, like I am doing for Lori’s blog, try a variety of shots – different angles, different distances, different photography subjects. And just to show you kind of how it goes, here are an assortment of photos I took just to try out some different ideas for Lori’s banner.

Some rough draft photos:

I wanted to take a photo of some basil and try that out, but I didn’t have any basil. Here is a tip if photography is your medium – try checking out some public domain photo sites. PLEASE bear in mind that just because a photo is on the internet, that does NOT mean it is public domain – even photos on the internet are protected by copyright and you can be sued for taking copyrighted photos. However, there are some sites where photographers choose to make their photos available in the public domain, which means they are no longer under copyright, and you can use them for both commercial and personal use. Just *make sure* the site states they are in the public domain – assume they are copyrighted unless the site specifically says otherwise. A good example is publicdomainpictures.net where they state that you can use their photos for person and commercial use for free – and I found a photo of some herbs there:

And, as I mentioned, I’ll also be showing how turn your hand-drawn illustrations into graphics … here is a sheet where I was sketching some images for graphics for my site:

So now we have a whole bunch of rough drafts – the sampling above is just a few of the many photos I took for Lori’s site and illustrations I drew for my site.The next step is to take those and enhance them into actual graphics in your image editing software. If you have Photoshop – great! If not … well, neither do I. It’s simply not affordable on my budget. However, there is a program called GIMP that is a completely free download from GIMP.org which I highly recommend. I’ll say up-front, it’s not the easiest program to learn. BUT, really, you don’t need to know how to do everything. I’ll give you a few pointers on some of the features … and even if you never learned anything beyond this, I think you would still find the program tremendously helpful. But chances are once you started using it, you’d learn more as you go.

First off, here is the explanation of how I take my hand-drawn illustrations and turn them into graphics. This assumes you’ve already drawn your art (like my feather you saw I drew, above) and have it in the scanner and the instructions are meant for that – but many of the steps and tools are useful for any type of image editing:

For photography, which is the medium I’m using for Lori’s blog, many of these tools are what I’m using as well. Be sure that in editing brightness/contrast that you click the “edit these settings as levels” button before adjusting anything, especially in photography. You probably won’t want to alter the levels quite as harshly in a photo as you would in a black and white line drawing, either. A couple other helpful tools for editing photography are on the “Color” menu: Color Balance and Hue/Saturation. As long as I’ve taken the photos in shaded natural lighting (for instance, taking a photo inside right by a window), these three (brightness/contrast, color balance, and hue/saturation) are usually all I need. See the difference these few can make? This is a lovely photo Lori had on her blog that I may be incorporating into her design that I touched up with these tools:

Plus, of course in a banner, you’ll use text overlay. Like I mentioned before – play around and have fun with it! Here are a couple banners I made to try out on Lori’s blog:

But in the end, I decided they weren’t quite working. So I started using the herb photo from the public domain site. This is a good example of where cropping can be effective. I really only used a small portion of that photo – and even then, I blurred out a significant portion of it to white so that the words would really pop. In the end, I felt this one best spoke to her blog and branding, and also represented her colors best. Here’s the final result:

Though, of course, that is just a smaller version there – you can see how it looks full size on Lori’s site by clicking here: In My Kitchen, In My Life.

Also, if you’re using WordPress and the theme which I recommended last week, you can click here for simple instructions on the code you need to put in to give your site a banner.

I hope you’ve found these tips and pointers helpful – and that you’ll have fun working on your new graphics!
What medium are you using for your blog graphics? Share your thoughts below, I love to hear from you!

To check out the next posts in this series, you can see them here:
Part 6: 7 Blog Layout Tips to Engage your Reader
Part 7: Blog Page: The Must-haves and the Panache
Part 8: 25 Tips for using WordPress

DIY Blog Design: Stylesheet? Coding? Fear not!

If coding and customizing your WordPress theme sounds too scary – then this post is for you!
(This is part 4 of my DIY Blog Redesign series… a little more techy for this post, and next week we’ll be back on the artistic.)

Admission: I designed my blog look – and starting out, I knew next to nothing of how to do CSS. Now, granted, I did know a fair amount of HTML, but I still had to start from scratch on CSS – and it wasn’t too bad. My point is this … don’t be intimidated by coding and the “back stage” parts of blog design. It doesn’t have to be scary. Especially if you’re using a child-theme. But I don’t claim to be a coding expert by any means.

Today’s post is going to be all about:
-choosing a “theme” for your blog (this is something you install from WordPress, related to templates)
-creating a child-theme (this doesn’t mean it’ll look like a kid blog, it just means you’re creating your own sub-theme based on the original)
-the CSS (style sheet)
-simple approach to coding

Ok, so the first step is finding a theme. If you remember the blog design tips from last week, we’re looking for a theme that allows those to be put into use. Plenty of white space, nothing too distracting, nothing that will detract from your content. I remember when I first signed up with WordPress, I was initially distraught because there wasn’t a theme that had exactly everything I was looking for … but that was before I realized just how much you could really customize a theme once you had set it up.

The theme I recommend going with is “Thematic”. It’s free, which is obviously really nice. It’s a simple and well-thought-out design, specifically made to be customized to however you want to design it. The really nice thing about Thematic is that even if you just leave it without customization, it is a nice simple theme … but that by putting in some work on it, the possibilities are endless. For instance, my blog is based on Thematic, as will Lori’s blog which I am redesigning as we go through this series … but our blogs will look entirely different in the end. Also (and this is a huge bonus) there is a whole community of Thematic support – Q&A forums, a free guide, etc. If you want more info on Thematic, as well as links to the support options, you can find that here.

To use the original Thematic, just go to your WordPress admin panel, then go to Appearance –> Themes, then click the “Install Themes” tab and search new themes for “Thematic”. Click “install”. After it’s installed, make sure you click “activate” to, well, activate it. ;) Simple, eh?
This is what Thematic looks like in just the base form:

Pretty simple, pretty basic. But as we’ve talked about before, often less is more. Content “pops” well on a simple design. However, we’d obviously like to add interest, branding and a more developed aesthetic. So first you’ve installed the original Thematic, and now we’re going to make “child theme”. This is basically a second-generation version of a theme. Pretty much all you’re doing is copying the basic elements of the theme, but setting it up as it’s own theme where you can customize it. You can click here for an easy run through on setting up your Thematic child theme.

So, I’ve now set up a child theme based on Thematic for Lori’s blog. Here’s what her site looks like, and as you’ll see, the child theme automatically looks just like Thematic:

But now that it’s a child theme was can go in and start tinkering around.
*taps finger tips together menacingly*
(Ok, well, not menacingly. This isn’t supposed to be scary.)
*taps finger tips together expectantly*

This is where we get into … the stylesheet! Ta da! It’s a CSS file that has all the rules for what your site looks like as a whole. I’m trying to think of a good analogy for the stylesheet … maybe think of it as your design’s DNA. It has all the guidelines for how your site displays. Some of the changes we’ll be making will be more like dying your hair or getting a tattoo – things that affect just one particular area – but appearances we want to change overall on your blog, we’ll have to rewrite the “DNA”, the stylesheet.

As I mentioned, I knew next to nothing about CSS when I started out. However, there are a ton of great resources online … CSS Basics being a good place to start. You don’t have to know how to do everything, but at least familiarizing yourself with the basics is a good idea.

You can get to your style sheet by going to your WordPress dashboard, then click “Appearances”, then click “editor”. There might be a few files available over on the right, and you want the one called “style.css”. Since you have a child theme, all the rules come from Thematic by default, but you’re not editing Thematic itself. (Again, make sure you’ve installed AND activated your child theme, you don’t want to start tinkering in the innards of the original Thematic, just your child theme.)
Here is kind of what your stylesheet will look like, starting out:

You may not be able to read it in my tiny preview above, but the friendly Thematic author has written handy and helpful notes here touching on what you need to do to change things from the Thematic defaults. It mentions different files … like
“/* Apply default theme styles and colors */
/* It’s better to actually copy over default.css into this file (or link to a copy in your child theme) if you’re going to do anything outrageous */
@import url(‘../thematic/library/styles/default.css’);”.

Basically, its just relying on the original Thematic rules unless you change it … so if you want to change something, but you don’t really want to start coding from scratch, you can copy/paste those files and just edit the lines you want to. Since you previously have installed the original Thematic before installing and activating your child theme, you can find all these files by logging into your hosting service (like we talked about how I use BlueHost), going to your cPanel, then to your File Manager. In your file manager, in the file for your WordPress (for instance, Lori’s file is called “InMyKitchenInMyLife”), open the folder “wp-content”, then the folder “themes”, then the folder “thematic”, then “library”. That contains all the folders that have the various CSS files. Don’t change the content of these files here, just copy the contents of, for instance, the default.css file, and then paste it into your stylesheet. Then you can edit lines. Today’s post is mostly an introduction to the whole topic, and in future posts I’ll share with you specific line edits you may want to do. But just for example today, let’s say we want to change the width of the site. I’ve already copied over the necessary CSS file, and I just go to the line that determines the width of the site, and change the pixel number:

I find it very helpful to know I don’t have to start from scratch and code it all myself – I can tweak! This is my simple approach. And lest panic seize you, let me tell you this – you don’t have to edit anything blindly. If there is something you want to know how to do specifically, you can probably find it online. For instance, next week, I’ll be sharing the code snippet you can insert in there so you can add a banner. But there are lots of tutorials out there if there is something you want to do and you don’t know how. Plus, there are also the Thematic forums where you can search because your question may already be answered there, and if not you can ask for help on a specific question. (But do try to figure it out first, before asking on the forums … they’re super helpful, but they do have guidelines and expectations that you’re trying to figure it out.)

So that’s how/where we’ll be changing DNA stuff. :) There are somethings that can be changed without altering the DNA. For instance, if you go to your WordPress dashboard, then to “Appearances” and then to “Widgets”, you’ll see lots of places to change things up there as well … these are more changes to a specific area. Over on the right, you can see what these different areas are. For instance, if you want to add a search box to your sidebar, you simply drag “search box” over from the widget options and drop it in the sidebar area. And there are lots of other areas you can drop widgets, such as at the end of a post, at the top of a page, etc. You don’t need to (and probably shouldn’t) use them ALL – or you’re going to start overwhelming your blog with extra “stuff”. But it is nice to have the capability to be able to easily drag and drop into any of these areas. We’ll be getting more into the sidebar, and what should go there, in a couple weeks. Next week, though, we’re going to be working on actually creating graphics, and starting to put them on the site. I can’t wait to share Lori’s new banner with you then!!

I hope that this has helped to show that getting in and tinkering doesn’t have to be scary or overwhelming. You just take it one edit at a time. :)

Do you do this kind of thing on your blog? If not, does this help to make it less scary? I hope so!
Leave your thoughts and comments below, I love to hear from you. :)

If you’ve missed the other posts in this series on DIY blog redesign, here they are:
Part 1: Discover your branding with “The Drawing Board” Printable
Part 2: WordPress vs. Blogger
Part 3: Design Tips + Design Worksheet
Part 4: Themes, Coding and Stylesheets (That’s today’s post!)
Part 5: Making your own graphics
Part 6: 7 Blog Layout Tips to Engage your Reader
Part 7: Blog Page: The Must-haves and the Panache
Part 8: 25 WordPress Tips
Part 9: The Big Reveal
Part 10: 7 Ways to Promote and Market Your Blog

DIY Blog Redesign: Design Tips

I guess there are basically two sides to this blog redesign series … the artistic side, and the more tech related side. We’ll be kind of jumping back and forth week to week from one to another – this week it’s the artistic. You know, the fun stuff! ;) I have six blog tips to share plus a worksheet to start making some design choices.

So far in this series, we’ve talked about getting a vision for your branding so you can know what you’re aiming for, and then the next week we covered where to blog and how to get set up, and this week we’re going to be getting into design tips. Then over the next couple weeks we’ll start combining your branding and these tips to start really building your site.

All of the tips today are going to be with one aim in mind: Distracting vs Enhancing. We want all the aspects of our design to enhance our content, not detract or distract. Also, bear in mind that these are tips, not rules. I hope you’ll enjoy them and find them useful – I definitely had fun writing it!

DESIGN TIPS

1 ‣‣‣ The garnish shouldn’t be larger than the food

So, if you’ve been following this weekly series all along, then you’ll remember that your blog is like a dish: the content (your posts) is the food, and the design of your blog is the plating/garnish. Garnish can’t make up for lack of actual food … but it makes a huge difference in how the food is presented – and received by the eater/reader.

I don’t know if any of you are FoodNetwork fans, but I simply loooove watching “The Next Food Network Star”. It combines a couple of things I love – cooking and branding. Each contestant is their own brand, trying to win a spot for their own new show on FoodNetwork. Anyway, on a recent episode Alton Brown cautioned one of the contestants, “Watch out, you’re about to put a garnish on that plate that is bigger than the food.” And, as we continue to think of your blog as a meal, that is the exact same caution I want to give you.

Your blog’s design shouldn’t distract or overwhelm your content. If your design is so busy/cluttered/overwhelming/eye-catching (and I don’t mean that last one in a good way) that it is difficult to focus on the actual content of your posts, then your design is doing the exact OPPOSITE of what it should be doing. A few examples of some easy ways to overwhelm your blog with “garnish”:
– music that starts playing as soon as you load the page (trust me, a huge % of people will leave right away)
– busy/jarring/dark/overwhelming backgrounds
– lots of random font color/size changes throughout your writing
– so many sidebars, each full of ads and widgets, than your content is slimmed down to a tiny sliver
– etc.

“Garnishes” should be tasteful, and should be the supporting actors – not upstaging the lead role.

On to tip 2!

2 ‣‣‣ White space is your friend

White space can make a huuuuuge difference on your blog. Imagine the difference in looking at a busy/cluttered blog, where your eyes narrow as you try to find your way through all the busy-ness to find the content … vs. a blog where your face relaxes when you look at it, the content itself catches your eye, and you are drawn into reading. The amount of white space is often directly related to making the difference between these two. And, as was mentioned earlier, it comes back to the difference between distracting and enhancing. Which blog are you going to linger on longer?

Always remember that the part of your blog that you want people to really take note of and remember is your content. It’s the heart and soul of your blog. Give the eye space to relax. Don’t crowd your blog. White space in the background, white space around text, around pictures, around design elements – it helps to let these things really stand out on the page. Now, there is definitely a spectrum of how much white space you may choose to have on your blog. I’m going to put a few screenshots below of blogs that use white space well to make sure they don’t detract from their content. (You can click any image to be taken to their blog). Each has it’s own unique style and branding, but note the common thread of white space:

Bearing in mind the importance of white space, think carefully about backgrounds. I would encourage you to do one of the following to help highlight your posts:
1 – Have no background (white space only)
2 – Have a background that includes a lot of white + one neutral (like mine)
3 – Have a background that uses color only very subtly (probably best for blogs with a muted palette)

Now, my fellow bright color lovers, don’t despair. This does not mean you are doomed to a boring blog. It just means there are probably better ways to show those bright colors than in your background. In fact, those colors will jump off the page best if you stick with no background. Obviously there are blogs that have designs that don’t follow any of these guidelines. But the thing is … it’s a lot easier to come up with a good design that highlights your content following these. And it’s a lot easier to create a design that competes and overshadows your content if you don’t follow these.

For instance, on Lori’s blog, In My Kitchen, In My Life, which is the “guinea pig” example for this series as we go through and redesign her blog, she has a dark blue kind of marbled background. Observe, below, the difference it makes simply by removing the background, and how much more the gorgeous photo in her post jumps off the page:

See how much more the content of the post catches your eye in the on with the white background? Now, you may be saying, “But a white background looks boring!” Fear not! There are many, many ways to put interest in your design — ways that won’t compete with your content the way a busy background easily can. We’ll be getting into those in future posts. :)

On to tip 3!

3 ‣‣‣ Do your own thing – don’t copy someone else’s style.

I want to mention this one specifically here since I just showed some screenshots of others’ blogs. The key to a good blog design is not in finding a blog you like by someone else and trying to mimic their style. Remember that the goal of your design is to highlight YOUR content. Their blog is designed to highlight their content. You wouldn’t want to copy someone else’s posts and claim them as your own – so don’t copy someone else’s design either. And anyway, knock-offs just aren’t as good. Your final product will be so much better if you discover your own style rather than trying to mimic someone else’s. Ok, ’nuff said on that.

4 ‣‣‣ Limit your choices: colors, fonts, mediums

It’s a really good idea to limit your design choices. Now, keep in mind, this is limiting your design, not limiting your posts! If you want to have photos in one post, and your paintings in the next, that is fine. But your design itself should have choice limits. I recommend the following limits in your design choices:

‣ Fonts: Up to three: one serif, one sans-serif, and one script. (Serif means a font with those little extra lines that poke out on the end of the letters. Sans-serif means the letters don’t have those extra details. Script means it’s more like handwriting/novelty fonts… examples are below.)

One more note on fonts. Just because a font is free, does not necessarily mean it is free for commercial use. Make sure you have the proper licence for the fonts you use. For example, Kimberley Gershwein has a lot of fun fonts available here on dafont – they are free downloads for personal use, but for commercial use you must purchase the license. Happily, it is just $5! One of the fonts that is going to be a part of Lori’s branding is by Kimberley. So make sure you have the proper license on your fonts.

‣ Colors: Up to three. (You can get away with a little more if you’re counting black/white, or if you have multiple shades of the same color.)

‣ Mediums: Choose one main medium for your design. (Again, this is for design, not for post content. If you’re going to have a photography banner, don’t have buttons that are pen and ink illustrations. Or if you want watercolor paint sidebar images, use that in your banner as well. Have one major medium you’re using in your design, rather than mixing and matching. By the way, mixed media counts as one medium. For instance, collage of vintage images and graphic design. Just make sure you make the mixture consistent throughout your graphics.)

These limits will help to keep your look branded, recognizable and unique – as well as giving a clean look to allow your content to stand out.

On to tip 5!

5 ‣‣‣ You’re not trying to appeal to everyone

I’ll be honest. My FlourishCafe creative biz & blog are never going to catch on with a huge following in the teen goth skater guy community. Yeah, surprise, surprise, huh? I remember when I first launched … I was also designing some jewelry and accessories at that time. I went to a downtown park with some friends to do a photo shoot of a scarf-wrap that I had made. While we were taking the photos some goth/skater guys walked by and called out something about my “ghetto scarf”. And while it never feels great to have something you’ve made ridiculed by others – it really didn’t both me. Why? They weren’t my target audience. Frankly, I would have been disturbed if those teen guys had wanted to wear my ruffled and be-ribonned scarf. I wasn’t trying to appeal to them. So the fact that my product didn’t appeal to them was no big cause for concern.

The same is true for your blog. You’re trying to reach out to your target audience. If that target audience is middle aged women who are interested in yoga, then don’t worry whether 20-something men who play hockey will love your site. This applies to your content, to your design, to everything. Now, I’m not talking about being rude or bashing other audiences on your blog – I’m just saying that you should write and design your blog for YOUR target audience … and if it’s not someone else’s cup of tea, don’t worry about it, they are the target audience somewhere else. If your readership isn’t particularly trendy, don’t worry about having to change your blog’s color scheme to fit Pantone’s color guidelines each season. If your readership isn’t into cats, then maybe don’t put LOLCats all over your blog. If your readership is on a tight budget, don’t worry whether millionaires will find your money saving tips useful.

Now, some things apply to practically all target audiences – like the ability to read/see your content, which is why tips like having plenty of white space and not overwhelming with garnish are fairly universal. But many options, like which colors to choose, what style to go for, etc. will depend on your taste, and your target audience. If you just try to broadly appeal to everyone you won’t be as successful at getting in touch with that niche target audience that you want. Look back at your branding printable and read your description of your target audience. Think about them in your blog’s design, and in your posts. In fact, a good way to come up with valuable content is to think about the problems your target audience faces – and offer solutions in your posts. Is your target audience knitters? Offer tips on keeping yarn organized. Is you target audience gamers? Review your favorite little-known games and tell people where they can find them. Is your target audience creative women? Offer them tips on how to re-design their blogs. (Wait, that’s what I’m doing!;) Because in the end, a blog is about the reader, not about the writer. Yes, be authentic and be yourself. But it’s the difference between blogging about how hungry you felt at work today vs. blogging a recipe you made that really hit the spot after a long day at work. Both are “about” you, but one is for you, and one is for your readership. Think about your readers, both in your content and in your design, and don’t worry about whether it appeals to everyone else.

Ok, are you ready to finally start making some design decisions??? Here we go!

6 ‣‣‣ Make decisions that fit your branding statement

I’ve designed a little worksheet to help you keep track of your design choices – in particular, your fonts, your colors and your medium. I tried to keep the worksheet simple and plain to not interfere with your own design process. Unlike printables, which I have offered before, this one is a jpeg to be used in your image editting software, so you can type with different fonts, and get your exact colors and such, rather than hand writing it. I tell you what, it is SO handy to have a file with your specific hues saved so that you don’t have to try to find “that blue” on the color wheel each time.

I put a place to write out your branding statement, which you crafted from the first part of this series (if you haven’t seen that yet, it’s an important step! You can click here to go back to that post) because all of your choices should reflect your branding statement. Look back at your branding printable, at the colors that resonated with you, the answers you gave, and start there to make your design choices. For instance, looking at Lori’s answers from her branding printable, here is the sheet I filled out for her blog, In My Kitchen, In My Life, which I am redesigning in this series:

Do you start to get a flavor for her site, looking at that? Her serif font is more classical looking, it almost reminds me of columns. Her script font looks like what you might see in a neatly hand-written letter. I think this fits her branding statement “classic and cultured done simply and down to earth” well. As for her medium – I decided not to illustrate her blog, like I illustrated mine, because that sketchy almost-cartoonish feel of my illustrations definitely doesn’t fit her branding statement. As I looked back through her posts, I saw that she had lots of great photos. Some of them I believe she took herself, and some of them her son, who is a budding photographer, took. I started compiling these photos, and fixing up the lighting in my photo editting software – and the colors for her blog that she had mentioned just jumped right out at me! You can see the images, though small, at the bottom of the worksheet. Since she has so many nice photos that reflect her style so well, I thought it would be good continue that and use photography as the medium for her blog. And on the colors … yeah, you can see I cheated a little and used four instead of three. This is because the navy blue is so close to black, and as I mentioned black and white can be “givens”. In general, though, I recommend sticking with 3 colors.

So, here is your own design board to fill out. Make sure you put your branding statement at the top – and have fun playing around to decide on your new design choices! Just right-click the image below and save it to your computer so you can edit it.

I hope that these tips and worksheet have been helpful for you!
I’d be very curious to hear about some of your design choices.
Leave any questions, comments or thoughts below, I love to hear from you!

You can also check out the rest of the posts from this series, here:
Part 1: Discover your branding with “The Drawing Board” Printable
Part 2: WordPress vs. Blogger
Part 3: Design Tips + Design Worksheet (That’s today’s post!)
Part 4: Themes, Coding and Stylesheets
Part 5: Making your own graphics
Part 6: 7 Blog Layout Tips to Engage your Reader
Part 7: Blog Page: The Must-haves and the Panache
Part 8: 25 WordPress Tips
Part 9: The Big Reveal
Part 10: 7 Ways to Promote and Market Your Blog

DIY Blog Design: Where to blog? And how to begin?

Hey everyone! First of all, thanks soooooooo much to all of you who commented on last week’s post about blog branding! It is hugely helpful to me as we move forward in this weekly series to know what is working and what people find useful, and how the process is going for you! (Plus, it’s just a lot of fun to hear from you. Comments = candy for a blogger.)

Also, before we get into the meat of today’s post, I want to tap into the collective blogging minds that are reading this and ask you a question — do you have any ideas for fun blogging quotes?? I’ve been working on making some new typography prints for my shop .. usually I use reeeeally old quotes that are in the public domain (like Jane Austen’s, etc.), but obviously there are no old quotes about blogging! So I’ve been making up my own quotes (like the one above), but I thought it would be so great to find out if any of you have quote ideas about blogs/blogging – to be turned into prints! If I use your idea, I will credit you for the quote in description, and give you a discount for my shop. :)

So while you mull that over, let’s jump into today’s post. We started off last week by starting to get a feel for branding, to get a bit of a roadmap so we know what we’re going for in each of our own sites. This week we’re going to start jumping into some of the getting-it-done basics of the beginning – where should I be blogging?

These are common questions for bloggers –
Which blogging platform should I choose – Blogger, WordPress…?
Do I need my own domain – and is having a domain the same as having hosting?
And how would I get set up if I DO want that??
And what is the air-speed velocity of an unladen swallow?????
Ok, maybe not that last one, but we’ll be getting to the other questions in today’s post. And the nice thing is … whichever route you take on these questions, it doesn’t have to be too difficult. And bonus points if you got the reference of that last question.

So first question, Blogger vs WordPress:

So, where should you have your blog? Blogger or WordPress? Now, I’ll say upfront – these are not the only two options. There are also options like TypePad or Tumblr, etc. … but TypePad costs more money then either Blogger or WordPress, and Tumblr tends to be more about photos/sharing others’ posts, than writing/commenting, which is the essence of most blogs we’re dealing with in this series. Also, I’d say that Blogger (aka BlogSpot) and WordPress are probably the two most popular blogging platforms, so I think it makes sense to just look at these. But by all means, if you have another platform that you are absolute sold on that you think others should know about, please tell us about it in the comments for your fellow bloggers to see! :)

So which one? It’s a head-to-head BATTLE! Ok .. well … not really. There is no one right answer on this for everyone, it largely depends on your goals and desires in blogging. Personally, I have blogged on both Blogger and WordPress and definitely prefer WordPress – and if you’re going through this series because you’re serious about growing and branding your blog, then I would highly encourage you to consider WordPress. But if you’re more wanting to blog very casually and only want a free version, then Blogger might be better for you.

But one thing I want to point out – in talking about WordPress, I am referring to WordPress.org NOT WordPress.com. WordPress is always free, but on WordPress.org you use WordPress on your own domain/hosting which would look like yourblogname.com, and which you purchase elsewhere — whereas on WordPress.com, they host your blog and it would look like yourblogname.wordpress.com. Also the WordPress.com version does not offer limitless customization, does not have unlimited storage, and has rules against having ads on your blog. Some of those can be added on if you pay for them – but in that case, you might as well be using WordPress.org because your hosting would probably cost less. I think if you’re going to use a free version, I think you might as well be at Blogger. So in the comparison here, it is between Blogger and WordPress.org.

Here’s my visual chart of the pros and cons, and while certainly not an exhaustive list, it hits what I see as the major points:

I think the two biggest factors are the ability to customize, and the ease with which people can comment on a blog.

On commenting …. comments are a HUGE part of blogging. You want your readers to be able to interact with you as easily as possible. Most people who visit your blog won’t leave a comment – but of those who DO choose to leave a comment, you don’t want to make it difficult for them. It is very common for people starting to comment to end up not leaving their comments because of CAPTCHA. (CAPTCHA is that spam catcher thing that makes you type in the hard to read squiggly letters to be able to leave a comment.) For one thing, it is another step, and not always an easy step, that can easily cause people to choose to skip commenting — I hear people talking about this often on Twitter, it’s a pretty common reaction to CAPTCHA. Or sometimes it is accidental. I’m less likely to leave a comment on a CAPTCHA blog, but even when I do, I can’t tell you how many times later I’m closing my tabs and find a comment that failed to go through due to CAPTCHA mishap. Also, besides CAPTCHA issues, to leave a comment on a Blogger blog you have to choose an account type to comment with – and not everyone fits those account types (including myself), which again makes commenting more difficult for people reading your blog, even if they want to comment. To comment on WordPress, however, you simply comment with your name, email and site, if desired, and don’t need to jump through CAPTCHA hoops. If your blog is fairly small you may not need any spam guards – but if you do need a spam filter, you can use Akismet on WordPress. It’s a few dollars a month, and it does an excellent job – this is what a I use, but that small amount is worth it to me to make commenting as easy as possible for my readers.

Besides commenting, there is also the difference in customization. On Blogger you are limited to templates and certain amounts of personalizing, which can lead to many sites looking much the same. There are ways to get in there and personalize to some extent, and there are even way to use a custom domain, which you would need to purchase elsewhere. But in the end, you are limited on Blogger in ways that you are not limited on WordPress. The sky is the limit to design and brand your blog exactly as you choose.

Lori, who has the blog In My Kitchen, In My Life, which I am redesigning as a demonstration in this series, has been on Blogger, but decided she wanted to move to WordPress and that is what sparked this entire series. A move from Blogger to WordPress can be the perfect opportunity to redesign your blog. And one thing that is indicative of the value of WordPress – there tend to be a LOT more people who move from Blogger to WordPress than vice versa.

Ok, so let’s say you do want to move to WordPress. What’s all this hosting/domain stuff?

The domain of Lori’s new blog is InMyKitchenInMyLife.com. The domain of my blog is TheFlourishingAbode.com. It’s what becomes the address of your site. Hosting, on the other hand, is the background storage and capability to make your website available on the web. You can have a domain – but without hosting you can’t set up and run your blog on it. Domains cost about $10 per year. Hosting costs from about $5 to $15 per month. I personally use BlueHost.com, where I can host an unlimited number of domains per month for about $5 per month, and I’ve been very impressed with their customer service. And there are lots of other sites where you can purchase hosting as well — but one way or another, if you’re going to use self-hosted WordPress, you’ll need to get both domain and hosting. Having your own domain and hosting both helps your site look more professional (as opposed to a .blogspot.com or whatever being added on the end) and gives you greater control over the workings of your site.

So let’s say you want to get hosting and a domain for your blog, and set up WordPress. How do you DO that??

This will vary some, depending on which hosting company you use. But it is not difficult to set up. If you go with BlueHost, which I recommend, they have excellent customer support to help you through the process, including live chat assistance if you need it. You just click on the “sign up” button, enter the domain you wish to buy, and they walk you through the process of purchasing the domain and the hosting you need. Once you’ve purchased and verified your account, this means you have hosting, but not that you have WordPress on your site yet – it has to be installed. As we mentioned before though, WordPress itself is free, so there’s no extra cost.

One reason I like BlueHost is that they make it very easy for you to install WordPress. In the “help” section of BlueHost, you can search for how to install WordPress, and they actually have a video showing click-by-click how to do it. And I’m sure any hosting company offers helps/how-to’s. But just to give you an idea of how easy it is … on BlueHost, you go to your Control Panel (or cPanel, the “hub” page where you manage your hosted sites), and click Simple Scripts, then select WordPress, then click “install”, then select the domain you want to put it on – and it installs it and gives you your log-on info. Easy-peasy. Then you can use the log-in information to get into your WordPress dashboard. Once you sign in, you’ll be at your dashboard, which you can think of as “back stage” for your blog. Here’s a screenshot of the dashboard and just a little roadmap of the basics of what-to-find-where in WordPress:

So now you are on WordPress! If you’ve been blogging somewhere else, that blog is not interrupted at this point. For instance, I’m working on Lori’s new WordPress blog at her new domain – but her blogger blog, at InMyKitchenInMyLife.blogspot.com, is still completely operational, uninterrupted, and not connected to this new blog yet. The actual transfer from Blogger to WordPress will be one of the last steps in the series – not until the new site is ready. Only then will we transfer over her Blogger blog, and set it up so that any one visiting her Blogger blog automatically gets redirected to her new WordPress blog. And that is a good thing to have this in-between time – because that gives you the chance to fix up, design, and get your new blog ready before making the transfer.

I hope this post has been helpful for you to get your bearings on where you want to blog, the perks to WordPress, and that getting set up is not too difficult at all! Next Friday, I’ll be sharing some design tips, Lord willing.

Don’t forget to let me know in the comments if you have any blog quote ideas! I think it is so fun to have inspiring images and such around you in your creative work area, even if it is just a corner of your apartment (like me!). Here’s another one I’ve come up with so far:

So, where do you blog? Leave your thoughts and comments below, I love to hear from you!

You can check out the rest of the posts this series, here:
Part 1: Discover your branding with “The Drawing Board” Printable
Part 2: WordPress vs. Blogger (That is today’s post!)
Part 3: Design Tips + Design Worksheet
Part 4: Themes, Coding and Stylesheets
Part 5: Making your own graphics
Part 6: 7 Blog Layout Tips to Engage your Reader
Part 7: Blog Page: The Must-haves and the Panache
Part 8: 25 WordPress Tips
Part 9: The Big Reveal
Part 10: 7 Ways to Promote and Market Your Blog

DIY Blog Design: The Drawing Board Printable!

I’m soooo excited! This is the beginning of the DIY blog design makeover series (which I’ve really been looking forward to!) where I’ll be taking one person’s blog and doing a 10-part complete redesign, makeover and transfer to WordPress — and giving tutorials and tips, as a graphic designer, on how to do your own blog makeover as well. I hope that any of you who are bloggers as well will find it helpful- at the end of this post there is a free printable worksheet, as pictured above, which I have made to help you start down this road. And I have to say I am very excited about the project myself – this type of thing is my cup of tea!

So that you know what to expect, in today’s post here is what we’ll cover:
– introducing the blog I will be redesigning
– meat and potatoes vs. garnish and plating
– what branding is
– my free Branding 101 printable and tips on how to use it to establish your own branding.

‣ ‣ ‣ Meet Lori

The lovely blog I’ll be reworking is by a reader and dear friend of mine, Lori, and it is called “In My Kitchen, In My Life“. I’ve known Lori for years- she taught me Bible classes as a child, cooking classes in high school, and has been a great source for advice now that I am a married woman – and I’m tickled to get to work on her design. Her blog is perfect for this type of makeover, because she has a distinct voice in her posts, and writes highly valuable content for her audience (I definitely recommend checking it out!) – but her blog’s design, while not bad, could be doing a lot more to highlight her content and give her better features, which is why she volunteered for me to use her blog. Here is a screen shot of her blog as it is currently:

‣ ‣ ‣ Meat and potatoes vs. plating and garnish

Lori’s blog is an excellent example of having what’s really important in a blog: great content. The content of your posts is the core and essence of your blog. It’s the meat and potatoes, the entree. The design, on the other hand, is the plating and the garnish. You can have the most beautiful plating and garnish – but if the real substance of the food is missing, the plating and garnish won’t make up for that. However, once you do have the meat and potatoes, the plating and garnish can make a big difference in the presentation and how your content is received. A delicious meal can be a delicious meal even on a paper plate – but it can also be taken up to the next level by being served on beautiful plating with tasteful garnishing. As they say, “content is king” and we will be addressing content somewhat in this series, but largely it will be about taking the great content you have, like Lori does on her blog, and presenting it in the best possible light – adding that next level of plating and garnish.

‣ ‣ ‣ What is branding?

(And do I need it, even if my blog is not a business?)

So we’re going to be starting at the “drawing board”: establishing your blog’s branding, which personally I find can be a really fun project. Now, you may think of branding as just being connected to businesses and shops and so forth, and your blog may or may not be a business blog. Or, like I used to think, you might think that branding just means a logo. But the concept of branding can certainly apply to blogs whether they are businesses or not, and is much broader than a logo. Blog branding is the unique style and experience that your readers will have and see in all aspects of what you are offering. Here is one way to see branding in general … imagine you are at the mall and are planning to buy a white t-shirt there. You could buy a white t-shirt at any number of places in the mall – but it’s going to be a different person who chooses to buy the shirt from Coldwater Creek as opposed to American Eagle, or from Hot Topic – and this is because even though the white t-shirts might not vary that greatly, the branding extends beyond just the simple items themselves, but covers the entire experience from going there, to buying the item, to how you feel about the item – and those different types of branding appeal to different people. The same is true for your blog. Your blog branding covers the entire experience of someone coming on your site, not just the content itself, and applies whether you have a business blog or not, because even if you’re not selling anything, you’re still trying to win the eye of your target readership. The branding you want to have on your blog will impact all of your design choices in a makeover, and branding will vary widely from blog to blog depending on why you are blogging, your target audience, and your own style and personality. So to start out this series I’ve made a branding questionnaire printable to help walk you through how to narrow down to what you want that branding on your blog to be.

‣ ‣ ‣ Branding 101 Printable & How-To Tips

As we move forward in this series (which will continue here on Fridays) a lot of the things we will be doing in future posts will be based on the answers you give to questions on this printable. I sent these questions to Lori ahead of time so that I could base her blog’s design on her answers. These questions don’t really require very long answers, and for the most part are pretty straightforward, but there are a few that I wanted to give some additional explanation for here.

The first section is just the basics, and things that you probably already have established: your blog name, tagline, etc. One question on there, though, that I want to point out is “Why do you blog?” You don’t really need to get very deep on this answer unless you want to – this is largely to establish the purpose for your blog. Is it to promote your business? Is it to offer advice or support on a certain topic? Is it to get feedback on your writing skills? The one answer I would avoid putting here is anything along the lines of “for fun” or “for a creative outlet”, because that doesn’t shed any light on why you are writing on a publicly viewable website as opposed to a personal journal at home. This question has to do with why you a seeking an audience for your writing – you want to be upfront with your audience with what they can expect. If it’s a business related blog, you want to make that clear in your design so your readers aren’t taken aback or surprised when you start talking about selling to them. Or if you are wanting build a online support community with your blog, you want make sure your design offers easy ways to join and participate. And so forth, depending on why you are blogging.

The rest of the questions of the 2-page printable are what I call “The Brass Tacks”. They are questions to help you think through and define what kind of style and look you want to go for on your blog, and help lead up to the last question: to come up with a branding and design statement. What is a branding and design statement, you ask? It is not a tagline or something that describes your blog to other people, it is simply a succinct phrase that describes the feel you want in your branding and design, for your own use as a guideline while you design your blog. It doesn’t have to make a lot of sense to other people, as long as it is crystal clear in your own mind – but it should be short. As an example, my own branding statement that encompasses all of my sites (my blog, my shop, my website, etc.) is “cozy urban cafe”. That may or may not make perfect sense to you as you look at my sites – for instance, urban style can mean a more hip-hop and grafitti type style, but I mean it more in a downtown kind of way – but in my own mind it is clear, and as a result, all of my sites have a similar feel that reflects my original design goals.

If you’re easily able to answer the questions asking for just a couple specific style terms and such, you’ll probably have a fairly easy time coming up with your branding statement. But if, as you’re trying to answer the style and adjective questions, you can’t think of how to describe it, try imagining your blog was an actual physical location, like a shop or a house, and see if that helps you describe the look you want. Even then, though, it may feel a little nebulous or scattered. In helping people with blog design in the past, I think this is one of the things that people have a lot of trouble with – defining exactly what they want on their blog. When Lori gave me her answers, they were a little more general than the questions asked for, which I was actually glad to see, because I think this is common issue and gave me the opportunity to demonstrate (since I’m the one doing the designing in this case) on how to take these general types of ideas and narrow down to a branding and design statement.

Here were Lori’s answers to the two questions that asked for a few style terms and adjectives:
“This is where I just get overwhelmed. Is there such a thing as the modern side of Lands’ End clothing meets Italian Renaissance art meets old books meets straw garden hat and good hand tools meets artful cheese plate? That’s my style. Good luck.”
“Ai, yai, yai… Pick for me, please! Ok, one of those great looking rooms where the furniture is very comfy, very functional, with few useless objects except a very few of sentimental value which are also lovely to look at — like my pottery bowl of river rocks picked up from a Swiss alpine stream and my basket of postcards from our travels and field trips.”

Her answers really made me smile – I think this feeling of “this-meets-this-meets-this … what is that?” is very common. So, if you’re in this boat, know you’re not alone! I can understand why it seems overwhelming – it would be very difficult to design anything trying to juggle all these different aspects. But here is what I did to filter Lori’s description down to a single style description, and I hope you’ll find the process can be fun, not daunting.

The first step is that you want to think about what the different aspects have in common – what ties them together. Personally, I went and found pictures of the things she mentioned in her description … a piece of Italian Renaissance art, some old books, hand tools, artisinal cheese plate, etc., and lined them all up to be able to make some visual comparisons. Another way to look at this came up as I was explaining to Tim the process of narrowing down to the similarities; a light bulb turned on in his head and he said, “Yeah, it’s like finding the common denominator of the different styles!”, and he started kind of mind-mapping attributes of the different items to find common ground. I thought that was a interesting way to think of it – especially if you’re more of an abstract/math brained person like Tim. Or the visual comparison might work better for you if you are more artsy-brained, like me. But in whatever method works best for you, try to think of what the common cord is that ties the different elements together.

Secondly, you might think I’m going to say find what is different between the elements- but that’s not quite the case. It would be a pretty endless list! Instead, ask yourself, “How do these things comment on each other?” In other words, why didn’t Lori answer with JUST the Italian Renaissance for her look? What is it about garden tools that fills something that was missing in the Italian Renaissance? What is it about Lands’ End that fills a style need missing in having old books alone? Contrast to try to find how and why these different pieces comment on each other. You may find that some aspects are actually very overlapping, where as some introduce a whole missing, but vital, piece of the puzzle.

After going through this process, here is the design statement I came up with from Lori’s description:
“Classic and cultured, done simply and down to earth.”

I feel that encompasses what she was trying to portray in her descriptions. Now the last (but very important)
step in crafting your design statement is this: once you have your design statement, forget about all those nebulous descriptions. Now, I don’t mean forget about the other questions you answered on the printable, we’ll still be using a lot of those answers in the future. But those fuzzy nebulous thoughts of Renaissance-meets-cheese-plate-meets-gardening-tools — let those go. You want to design and plan you blog look based on your branding statement. If you try to design with all of those other things in mind, you’re going to end up with some parts of your blog looking like the Renaissance, and some parts looking like garden tools, but it’s not going to all tie together. Your branding statement should encompass everything you need from those nebulous thoughts, anyway. If you feel you can’t let go of those because it feels like something will be missing, then that is probably a sign that your branding statement is not complete. Once you have a branding statement finished, it will make your job of designing SO much easier in the rest of the process.

I hope this has been helpful! You can get the free printable by clicking the photo, below.
Let me know how it goes answering these questions – and if you are having trouble narrowing down to a design statement, talk about it in the comments below, and let’s see if we can help each other out! :)

Please leave your thoughts and comments below – I love to hear from you!

You can check out the rest of the posts in the series here:
Part 1: Discover your branding with “The Drawing Board” Printable (That is today’s post!)
Part 2: WordPress vs. Blogger
Part 3: Design Tips + Design Worksheet
Part 4: Themes, Coding and Stylesheets
Part 5: Making your own graphics
Part 6: 7 Blog Layout Tips to Engage your Reader
Part 7: Blog Page: The Must-haves and the Panache
Part 8: 25 WordPress Tips
Part 9: The Big Reveal
Part 10: 7 Ways to Promote and Market Your Blog

DIY Metal Fire Pit Tutorial- Hack Challenge Finale

Well, it’s the last week of the upcycling hack-challenge! The project for this week is an idea that Tim heard of a while back, and we were hoping to get to do at some point in the series, and luckily we found out a couple days ago that we would be able to get our hands on an old metal basin from a washing machine – just in time! :) These metal basins make excellent fire pits because of the holes all over them, which allow in plenty of air and help keep a fire going strong with very little effort. So here is a tutorial of how Tim converted one into a fire pit!

Here’s a note from Tim: If you want to try this yourself you can find a wash tub from a large appliance repair store (we got ours from a local Maytag store that let us have it for free) or try your luck at a junk yard. The spray paint, the legs and their hardware cost < 25$.

Take a metal basin from an old broken washing machine – it may be rusty on the bottom, as you can see on this one. But the first step is to fix the top edge, which can be sharp and ragged. Bend down the edge all the way around, and then crimp down the edge underneath to finish.

Then, you’ll need to remove the center piece, because it juts up in the middle of the basin. Turn over the basin, and carefully cut around the center.

Cut six equal lengths of perforated angled bar, for the legs. Three will be attached directly to the sides of the basin, and the other three will bolt onto those, to give you some flexibility in adjusting the height. Tim chose a three-legged and adjustable height design to make it more stable if the ground is uneven. Measure around the basin, and divide in thirds (Tim actually found on this particular basin that the number of holes going around it were divisible by three, which made it easy to find the thirds.) Mark and drill holes on the side of the basin to fit the bolts, and then attach.

Spray the outside with paint that is high heat resistant and helps prevent rust- I chose a copper color, and I really like how it turned out!

The holes all over the basin help to draw in plenty of air and help keep a roaring fire!

Unfortunately, with the hot and dry weather we’ve been having, there is a burn ban right now, and so we weren’t able to actually light a fire in it to photograph for this post – I put a lamp inside it for the photo above, to give a little idea of how the light shines around it, because it is one of the things I love about this fire pit. But here is a photo which a friend of Tim’s sent over, who also has a fire pit made from a washing machine basin:

As always, use safe practices when working with fires.

Well, I hope you’ve enjoyed all the hack-a-week challenge posts – and that you’ll be sticking around for the new challenge which starts next week – all about doing your own blog design makeover!

Have any ideas for future challenges?
Leave your thoughts and comments below, I love to hear from you!

Well, since I’m bad at clues- here’s the answer!

So, last week I tried to post some clues to see if anyone could guess what the next weekly challenge would be … buuuuut apparently I’m pretty bad at clues, haha! But the hack-challenge ends this week and next week is the start of the new challenge … so instead we’ll just skip to the announcement. :) It’s one that was suggested by one of you when I asked for challenge ideas a while back – and I’m very excited about it!


It’s a DIY blog redesign series! Basically, as a graphic designer I will be demonstrating how to do a complete blog makeove by taking a reader’s blog, overhauling it, and each week showing tips, how-to’s and instructions to also be able to conduct your own blog redesign. We’ll start from scratch on how to establish the look and branding you want to go for on your blog, and work all the way through to setting up or transferring a blog to WordPress, designing your blog to highlight rather than distract from your content, create a layout to encourage reader interaction, tools that can help boost your blog, and more. I’ll be posting each Friday for the 10 part series, Lord willing – it starts July 6th, and I’m so excited! If you’re a blogger, be sure to subscribe so that you won’t miss out on all the blog design tips.

UPDATE: Here are the posts in the series…
Part 1: Discover your branding with “The Drawing Board” Printable
Part 2: WordPress vs. Blogger
Part 3: Design Tips + Design Worksheet
Part 4: Themes, Coding and Stylesheets
Part 5: Making your own graphics
Part 6: 7 Blog Layout Tips to Engage your Reader
Part 7: Blog Page: The Must-haves and the Panache
Part 8: 25 WordPress Tips
Part 9: The Big Reveal
Part 10: 7 Ways to Promote and Market Your Blog

Until then, though, if you haven’t already gotten it, here is my free blog planner printable. I hope you’ll find it useful in organizing your blog posts! Just click the image below to open the PDF file.

Do you have a blog? Tell me a little about your blog in the comments below, and if you have any particular design questions you would like to see covered in the series, I’d love to hear them!

4 Ways to Upcycle and Display Postcards: Hack 7!


I love to travel – and I love to collect postcards from the places I go. They’re small, low-cost and lovely .. perfect to be able to collect some from each destination. However, most of my postcards live in a photo album and for this week’s upcycling hack challenge, I thought it would be fun to come up with some interesting and unique ways to upcycle and display postcards. And you only need one item for all of them: an embroidery hoop! Well … and your postcards, too, of course.

Use the screw to loosen the outer band of a 12 inch wide embroidery hoop, and stand your postcards in the space between the bands. Once you have your postcards lined up in a pleasing way, tighten the outer screw to hold the postcards in place.

Pretty spiffy looking, eh? The first idea to display the postcards is just this easy, with the hoop standing on it’s side:

But another idea is to lay it on its base and to let it double as place is disguise storage. Sometimes there are items, like a modem or router, that you need to have out but you don’t really want to have visible. Set the postcard hoop on a shelf, on top of the fridge, etc. and just place whatever items you want to keep out of sight inside the hoop!

The third idea is to make a centerpiece out of your postcards! Put candles in the middle (just not too close to the paper postcards) and enjoy the glow of the places you’ve visited.

It might be neat to use for wedding table centerpieces, and have postcards from places that are special to the couple. You could even have guests each take a postcard and write a bit of marriage advice on it, and then put it back in the centerpiece. If you’re worried about the flame, one reader suggested battery operated tea lights – great idea!

Or, for the last idea, if you’re feeling more ambitious, line multiple embroidery hoops of different sizes with postcards, and hang them at staggered heights to create a chandelier effect.

I hope you liked these simple ideas on how to upcycle an embroidery hoop and display your postcards.
And I’d love to hear – how do you display your postcards? Or do you collect something else from your travels?
Leave your thoughts and comments below, I love to hear from you!

Can you guess??

So, the Hack-a-Week challenge only has this week and next week left and it will be finished – wow, 8 weeks can go by so fast! Anyway, for the hack challenge, I had you vote and choose what the challenge would be. But for the next challenge, I’ve already gotten a new challenge lined up – and I’m very excited about it! Plus, I am thinking that it is something that a lot of people will find helpful. But … since we have a little time before it starts, I thought it would be fun to play a little guessing game. I’ll give you a few clues below, and I’ll be curious to see if you can guess what the next challenge will be! :)

Clue #1: It involves having one reader as a volunteer in the challenge.

Clue #2: It will be a series of tutorials on something that many of you are involved in doing.

Clue #3: It is something I enjoy … and the fact that I enjoy it probably makes me a geek … and I am fine with that. :)

Clue #4: It is a project that you don’t necessarily need any physical items to do. (It would be possible to use a camera in the project, but you wouldn’t have to necessarily. The camera picture is just there to look mysterious and question-marky)

Clue #5: It is a makeover of some sort.

Leave your thoughts and guesses below! I’ll be officially announcing the answer next week, Lord willing!