Need help with DIY blog design?
In this post, I discuss designing your blog elements in the event that you cannot hire a designer or plan to do it yourself. We’re talking about basic design elements like logos, headers, featured images, Pins, etc.
While we’ve already touched on establishing a style for branding in other posts, this chapter is going to focus on step-by-step instructions for low or no-cost DIY blog design.
And yes, I know – this is a fitness blog. But since I get a lot of questions about how to start a blog, I figured a little more help can’t hurt. 🙂
Let’s jump in!
DIY Blog Design – Headers & Logos
Before we talk about designing a header, I want to be sure to clarify as much as possible.
What’s the difference between a header and a logo?
This is something I didn’t understand as a design rookie back when I started blogging. I’ll try to explain it as best as I can. Your header is an area at the top of your site. It is not your logo.
However, your logo can be housed in your header. Moreover, some people design entire headers that feature a logo and sometimes other things. I hope that makes sense as you embark on your DIY blog design journey.
Here’s an example of my fitness blog logo versus my header including the logo:
Header content with logo included:
As you can see, they can look like very different things! The second image is something that can take up a large amount of space, and that particular one is not something I use anymore.
Compared to before, I now have a very simple menu featuring my logo/blog name instead of an elaborate header. However, many pre-built website themes will include space for a full header instead of just a logo.
Related Reading: How to Start A Weight Loss Blog – The Ultimate Guide
But since you can customize your blog, you can do whichever you want!
*You might want a header if you want to feature a slogan or tagline with your logo.
How to DIY Your Logo Or Header
Now let’s talk about how to DIY a logo or header. I’m going to break this down in several steps, because that’s what I needed when I was a new blogger.
I have personally used several free and paid programs for graphic design, and I have always preferred PicMonkey, so that’s what this tutorial will feature. If you’re going to go right ahead hire someone to make a logo for you, just skip this section.
Step 1: Decide on Your Style
The attitude of your logo is important. This is where you need to consider the audience that you defined earlier on. I looked at a lot of niche-related logos when I was getting ready to make my logo.
I wanted it to convey “strong” yet “feminine” and that’s how I ended up with the logo I have today. (For my fitness blog, I made my own “Ironwild Fitness” lettering with a custom font from Creative Market, but I paid to have my final logo made with 99designs.
The pink lettering you see was made by me for my header and the logo was made and I later edited it in PicMonkey to be the color I wanted.)
So ask yourself: What am I going for? Bold? Modern? Traditional? Feminine?That’s all you need to do for your first step.
Step 2: Consider Your Theme/Blog Layout
Some themes have nice fonts you can use for your header, and some themes are highly customizable. However, most themes have specific sizes allowed for headers and logos. So try to find out what sizes you need before getting started.
It’s always safe to make a large version of your logo and you can always scale it down later if you need.
Important: Always save a logo with a transparent background (in Canva) or as a PNG file (in most other programs) so that you don’t have a white background when you try to add your logo to things.
Step 3: Consider Fonts & Colors
This is important as you start your DIY blog design. From a marketing perspective, we know that different colors reflect different themes and feelings.
Consider this when you choose your colors, as what you choose might have a negative (or inadvertent) effect on your readers. Here are the general color associations:
Step 4: Get Ready to Make Your Logo
You can play around with drawing out your logo ideas on paper if you want, but I like to open up PicMonkey and just start playing around.
PicMonkey is a great design tool and photo editor that I use for EVERY blog image I create. (I find it easier to use than Canva.) I personally use PicMonkey for every blog post, pin, featured image, logo, etc. that I make, so I find paying the $7.99 per month totally worth it.
There is a free trial that’s actually pretty good though.
You will probably want to open up PicMonkey and just start playing around with the options and features first, then I will show you how I make my own logos specifically with PicMonkey. (Go for it!)
How to Use PicMonkey for Your DIY Logo Design
Once you’ve finished the steps above, you’re ready to do some DIY logo design. So let’s break down how I personally do it in PicMonkey.
Step 1: Click “Design”
On the PicMonkey homepage, click “Design” (with the snowflake thing). You will be prompted to choose a from templates, a blank canvas, or custom size.
This is where knowing what your theme needs comes in handy. You should at least know if you’re doing something square, rectangle, etc. (If you don’t know – no worries, you can always crop things down later. Just go with the default if this is the case. Either blank canvas or custom size – I always go with custom.)
Step 2: Get Crafty!
You can use your custom fonts (from wherever as long as they are on your computer) in PicMonkey, or you can use their own. Like I mentioned, I get my fonts and other design elements from Creative Market.
You may or may not have a logo idea that is heavy with words, but there are lots of fonts to choose from even in the free version of PicMonkey. There are also tons of little icons and illustrations, plus your typical editing tools. This is the fun part.
Step 3: Change Canvas Color
This is important! If you want to be able to put your logo anywhere (on Pins, T-shirts, Facebook headers, etc.) it’s important to change the type of file to a PNG. This makes the background of your logo invisible.
If you don’t want a white box behind everything, MAKE SURE YOU DO THIS.
A white background might be fine for things where your background is going to be white anyway (like on some web pages) but it’s not great for everything. Trust me and do it or you’ll be mad later.
Here’s how to do it in PicMonkey:
- Go to “Basic Edits” on the left-hand side.
- Click “Canvas Color.”
- Check the box that says, “Transparent Canvas.”
This will take your logo from this;
Then, when you save it, it will look like this (a PNG file);
Step 4: Save or Export
PicMonkey is kind of cool in that you can either download things to your computer, or you can save them in your “hub.” This is just like your cloud and it works like Dropbox, only it will have all of your DIY logo designs.
That’s handy if you want to stop and come back to edit things later or if you want to save space on your computer. Anyway, when you’re all done, this is where you’ll want to choose your sizes and name your file.
Since this is for your logo, I will always suggest choosing THE BIGGEST file size unless you want it to look fuzzy when you go to put it on your blog.
3 Pointers for Great DIY Blog Design
- Keep it simple – not too many frills, not too many fonts. Think of all the biggest brands out there. They all have super simple logos (Nike, Adidas, McDonald’s, etc.).
- Choose no more than three colors – to help with branding yourself, plus it’s just too much to do more, trust me.
- Check for readability – across any device your logo might be seen on.
One more thing.
You should ask yourself the following questions before going “live” with your DIY logo design:
- Can my logo grow with me if I keep my blog for a long time?
- Can my logo be seen easily on a mobile device?
- Do the aspects of my logo align with the overall attitude I want to relay in an emotional/psychological sense? (i.e. the color red is associated with negativity)