Creating Images for Your Blog the Right Way [Using Canva]

Assume every image you find online is copyrighted.

Wow. That was eye-opening.

No more wondering if you can use that photo from Google Image Search Results, right?

Quick note to all the smart pants out there:

Making changes to a copyrighted image doesn’t give you the right to use it.

Oh and one more thing — fair use doesn’t mean what you think it means.

My “use” certainly is “fair”, my website is non-commercial, I’m linking back to the source and even listing the photographer’s name!

It doesn’t work this way. You can still get sued over something as trivial as using images for a blog post. Stop and think about.

The solution to this is to change the way you search for the images from the start.

Enter the CC0 images.

Your Blog Posts Deserve Better Featured Images

CC0 or Creative Commons Zero means “No Rights Reserved”.

The photographs that are distributed under this license are free from copyright restrictions. You can copy, modify and distribute them even for commercial purposes, without asking permission or giving attribution.

So where do I find CC0 images?

There are a couple of go-to resources, that are curating these kinds of photos. They usually publish N new photos every N days.

Unsplash.com is probably the most popular place to get high-resolution photos. Pictures from there were even used for WordPress 4.0 “what’s new” blog post.

Unsplash example photo

My personal favorite is Gratisography though. I like the style of these guys and they seem to ‘get’ what type of pictures I need. Not the 100th variation of Golden Gate Bridge photo or NY city skyline.

Gratisography example photo

Then there’s StartupStockPhotos, in case you need startup-y photos, featuring MacBook, iPhone, table tennis rackets, coffee, Moleskine notebook and a pen.

Startup Stock Photos example photo

Here’s an insane list of 43 resources with no-attribution, do-whatever-you-want photos. You can use images found there even for commercial use.

Naturally, as you keep discovering more and more of these services, you start wondering if there’s a way to view them all in one dedicated place.

Luckily for you, there are a couple of directories that gather these images in one place and make them a little more easier to consume.

Most notably Stestocks.im and more recently Pexels. If you use one of them, make sure that the license on the image really is CC0 though.

They keep adding new websites to their lists and you can’t be too careful.

Pexels homepage screenshot

These resources are very popular. And I mean it.

You’ll be very likely to see images from there used in multiple blog posts across different industries.

Pick a couple of catalogs that you like, at don’t bother checking out others.

In my experience, you’ll end up using images from 2 or 3 of them and others won’t really fit your needs.

Most importantly, if you want to stay ahead of the curve, you’ll need to modify these images and make them stand out.

How do you modify them? That’s another great question from you, dear reader. Keep them coming!

How to make your blog featured images stand out?

You don’t need mad Photoshop skills to create beautiful images for your blog.

In fact, you don’t need Photoshop at all.

Services like Pixlr provide most of the functionality you’ll ever need for designing your featured images.

The sole mention of Photoshop gives you nightmares? Use a simpler tool, like I do – Canva.

This is actually the tool I’ve used to make images for this and every other post I write.

If you’re anything like me (and I bet you are), you don’t have a clue when it comes to designing good images.

Your first attempt at throwing something together probably looks like this:

very ugly image

That’s certainly how my very first creative looked like.

So much for using pretty background image.

But here’s the good news:

After one full month of using Canva, reading tons of blog posts on mixing colors and combining fonts I’ve come up with a certain framework, that helps me to produce images that I’m not embarrassed to attach to the blog posts I write. Today I’m going to teach you the exact step-by-step framework I’m using.

All your burning questions about making images, including what colors to use, which fonts to combine and how to make the text interesting will be answered.

**Feeling Lazy?** Just click the big button below and download the step-by-step checklist to use every time you create a new image for your blog post. Save 30 days of trial and error I went through. [GIMME!]()
 

Let’s try to create something simple, yet eye-catching.

Here’s an actual image I used for the “All You Need to Know About the Author Platform” article.

Choose only 3-5 areas and work to become an expert in them

Now first of all, I used custom dimensions so that all of the pictures on our blog have the same size. In our case it’s 600 x 300.

Screen Shot 2014-09-16 at 13.37.39

Then once the editor loads, I go straight to the upload section to use the image I found on Unsplash.

Screen Shot 2014-09-16 at 13.39.02

Once the upload is finished, I just click on it and it appears on the canvas.

Screen Shot 2014-09-16 at 13.40.42

Don’t pay any attention to the ‘Add new pages’ functionality, you don’t need it to create a single image.

What you need to do instead is select the image and stretch so it covers all the canvas.

Screen Shot 2014-09-16 at 13.42.18

It’ll look something like this.

What you want to do next is press ‘filter’ on the menu that appears once you click on your image.

Screen Shot 2014-09-16 at 13.42.57

Epic, Festive and Street are the three filters that I like the best.

Play with the filters a little bit, then go straight to the ‘blur’ setting and change it to anything from +7 to +30. This way the container and the text you’ll add next will look more natural.

Screen Shot 2014-09-16 at 13.45.01

Now to add the shape, you need to go to the ‘search’ section of the menu and choose the ‘Shapes’ group. Makes sense, right?

Screen Shot 2014-09-16 at 13.49.46

Here you’ll find a lot of shapes you can use and most of them are free. This time I’ll use the circle with a border.

Screen Shot 2014-09-16 at 13.50.44

Once you click on it, it will instantly appear on top of your image.

Screen Shot 2014-09-16 at 13.52.39

Right now it doesn’t look very good as you can’t see anything behind the shape.

That’s why we need to adjust the transparency setting. This time I’m going to set it to ’20’, but you can play with the slider.

Screen Shot 2014-09-16 at 15.10.44

Now the colors. I don’t like how orange looks, so I’m going to change it. I love using FlatUIColors as a starting point. I’m going to use Peter River for the inner circle and darker Belize Hole for the outer circle.

Screen Shot 2014-09-16 at 16.28.26

This looks much better.

Screen Shot 2014-09-16 at 15.20.27

But misses one important component – text. Let’s go ahead and fix that.

Switching to the ‘Text’ tab in the menu on the left reveals three different options for text as well as some pre-made bits that you can use.

Screen Shot 2014-09-16 at 15.23.02

This time let’s just go ahead with the “Add Text” option.

The actual process of picking the words that would go on the picture is an art in itself. It’ll come naturally to you once you create an image or ten..

Getting back to our example. If you just try to copy-paste the text, you’re going to get something crazy looking as this.

Screen Shot 2014-09-16 at 15.28.02

What you want to do instead of using one box for all the text is create a separate text box for every line. This way you’ll be able to adjust the size of the font and make sure everything looks tip top.

Screen Shot 2014-09-16 at 15.31.22

White looks good on almost everything.

Screen Shot 2014-09-16 at 15.32.07As far as fonts go, I discovered that combination of Raleway Thin and Raleway Heavy works pretty good. And when you need to spice it up with a font that looks like handwriting, Satisfy fits nicely.

Screen Shot 2014-09-16 at 15.35.39

Now to add some visual separator between the two parts of the circle. Go back to search and look for the different kinds of lines.

Screen Shot 2014-09-16 at 15.36.38

Once again, when you first add the line to the image, it’ll look out of place.

Screen Shot 2014-09-16 at 15.55.56

It’s your job to make it fit in and pick the right color too.

While you’re at it, you can change the transparency setting from 100 to something like 50.

Screen Shot 2014-09-16 at 15.59.46

Now if you look closely, you’ll notice that there’s one difference in the way the text looks in the initial picture and our recreation.

The first line is not made up of capital letters only.

Screen Shot 2014-09-16 at 16.01.34

Luckily, this can be changed with one click of a button.

Choose only 3-5 areas and work to become an expert in them

That’s it. Download the image.

Screen Shot 2014-09-16 at 16.06.43

Now you have an image ready to be inserted into your blog post.

Don’t forget to set proper title and alt tags for all images you use in your blog posts.

Take note that sometimes Canva can misread the size of your text box. This will lead to some of your text not fitting inside your picture.

Always check that the image is ok when you download it.

And even if it’s not, you can always do something as radical as taking a screenshot of your picture the way it looks in the editor.

Learning how to use Canva or any similar tool certainly takes some time, but once you get the gist of it, you’ll never look back.

Over to You

How do you create images for your blog? Do you have any questions about using Canva? Let me know in the comments section below.

P.S. Click the big button below to download the step-by-step checklist to use every time you create a new image for your blog post. Save more than 30 days of trial and error I went through. GIMME!