In the last post, I covered how to write a blog post. Now, it is time to learn how to create blog graphics that make people want to read your post. I promise, this is not difficult and only requires a computer and the internet. And if you are a blogger, you should already have those. 😉
All of the resources I will include in this post are absolutely free and I personally use them, but I am NOT affiliated with them. That means that I won’t receive anything for referring you. I am recommending these resources because I love them and think you will too.
Why Do You Need to Create Blog Graphics for Your Blog?
So, you might be asking the question above. The answer is very simple: Graphics sell your post! It is the same for books and magazines. Would you read National Geographic if it didn’t have those beautiful, award-winning pictures? Would you notice a book on a book shelf if it didn’t stand out in some way?
You need to create blog graphics in order for your posts to stand out. Pinterest is a great example of the power of graphics. On Pinterest, you pin images to “boards” for reference or to share.
SEO is like your credit score. If you’re starting from scratch, your score won’t be very high. With SEO, it also takes time for Google to determine that your website is high quality. Until then, no matter how awesome your posts are, you won’t get much traffic from Google.
Pinterest is the way to go when you promote a new blog. All it takes is for one high-profile pinner to share your pin and BOOM! Your traffic will explode. Since Pinterest is an image based search engine, it is important to create blog graphics that are eye catching and effective marketing. So, how do you do that?
Types of Graphics
You have four basic types of blog graphics for posts. There are title images (known as your featured image on WordPress), content supporting images, Pinterest images, and social media graphics.
This is the first image that your readers will see when they visit your blog post. It should be eye catching and the message clear. These images are typically simple, but convey a clear message.
Usually a stock photo or original photo is used to create this graphic. Often, an overlay is then applied and its transparency adjusted enough to see the image behind it. It is important when you create blog graphics that you leave enough opacity in the overlay so that the text stands out.
To create this type of image, you will need to understand the image sizes recommended for your WordPress theme. Many themes will automatically adjust to your graphic, but some don’t. I learned this the hard way when I changed my theme on my other blog, One Day to Tomorrow. None of my images fit!
The cool thing is that you can usually find the recommended image size for your theme by visiting the theme’s website. I use ColorMag by ThemeGrill. On their website, I was able to find this chart to help me choose the size of my images.
For my website, I should create an 800 x 445 pixel featured image. Make note of your recommended image size. You will need it later.
Content Supporting Images
The screenshot graphic above is a perfect example of an image that supports the content of a post. When you create blog graphics, you want to add this type of graphic to break up the text and add clarity to your content. Stock photography, infographics, and screenshots all work well as supporting images.
Pinterest or pinnable images may or may not be visible in a post. I usually embed my images and hide them using a small amount of CSS code. I will show you how to accomplish this at the end of this post. It really isn’t as difficult as it sounds.
Pinterest images can be a compilation of several images or an infographic, but must be portrait orientation. When you create blog graphics for Pinterest, the recommended size 735 x 1102 pixels. Make note of this number also. You will use it when you create your graphics later in this post.
Social Media Images
There are different recommended sizes for different social media platforms. I generally use a Twitter size of 1024 x 512 pixels to create all of my social media images. I use the same design as my featured image to create continuity in my posts.
These images work great for use on Facebook, Twitter, and work well in emails. They also don’t take up a lot of room and function well.
I often use stock photography for my graphics. Some of my graphics are original, such as the one of the waterfall on my home page. Other times I will create blog graphics without using any photography at all. Instead, I use shapes and frames within Canva to accomplish this.
Canva has become my favorite graphic design website. It is free and many of the images and designs on the website are also free or inexpensive. I will be showing you how to use Canva to create web graphics for your blog.
Go to Canva.com
Create an account. I wouldn’t recommend that you do this unless I fully support this website. They haven’t spammed me since I joined and the great news is that it is completely free! Simply follow all of the steps until you are signed into your account.
Once you are signed in, you will see the following screen.
I have already created graphics, so my graphics are saved on this page and can be edited, if necessary. At the top, right of the screen you will see a “Use Custom Dimensions” button. Click it.
Remember those image sizes that I told you to make note of? Here is where you will need them.
I am going to create a featured image. My theme recommends featured images be 800 x 445 pixels (or px on Canva). Type in your dimensions and make sure you choose “px” in the drop-down menu, then click the green button that says “Design!”
Play around with the options in the left sidebar. I often visit a stock image website and download images to upload to Canva.
Pixabay is my favorite stock photography site because they have great graphics and you don’t have to deal with legal disclaimers. The images on this website are copyright free and don’t require any special permissions.
Legal Note: Do not use images from Google or any other general website! It is illegal to use most of those images, unless you credit the source and have their permission. It is best to avoid them completely due to federal copyright laws. Instead, use a website like Pixabay or use your own images.
If you need help using Canva, check out this tutorial by Buzzing Creatives. It covers the basics of designing a graphic using Canva. You do not have to use one of Canva’s templates, as shown in the Buzzing Creatives video.
You can create your own using the buttons in the left sidebar. If you choose a picture on Pixabay, you can upload it under the “Uploads” section.
Create Blog Graphics that Stand Out
Go to Pinterest and search for the same keywords you plan to use for your blog post once it is published. This will allow you to look at what your competitors are doing. The following screenshot is the search results page for “create blog graphics,” my keyword for this post.
As you can see, the above images are beautiful and eye catching. They are all slightly feminine and stick to color schemes that are pastel pinks, teals, and purples. There is nothing wrong with this at all. However, you want your post to stand out! Especially so when you are a new blogger.
I have chosen to go with a feminine, but bold pciture and color scheme; black and orange. I used these colors because there was nothing similar to them in my search results. When you are writing about popular content, you need to stand out.
Don’t Go Overboard
Because I am using such bold colors, I am keeping it very simple. I am using black, white, and orange for my text. Stick with only one or two fonts and two or three main colors.
If your post looks like a clown or toddler designed it, it will seem out of place and unprofessional. Remember, simple is best. You don’t even have to use photos at all. You could simply use the Canva “elements” to craft your own unique blog graphic or infographic.
Download Your Graphic
Once you are finished with your design, change the name by clicking to the left of the “Share” button at the top, right of the screen. Next, click “Download” and Choose “JPG” from the drop-down menu and click the green “download” button.
Add Graphics to Your Post
With WordPress, adding media files is easy. The “Set featured image” section of your blog is on the bottom of the right side bar. It will look like the following picture.
Click the blue link that says “Set featured image.” You will be taken to your media editor. Simply upload your graphic. Once it has loaded, in the right side of the editor, you will see “Attachment Details” Scroll down to “Alt Text” and type in your planned keyword.
In the “Description” box, type in the title of your post or post description. If someone pins your image, it will automatically include this description information, which will help with Pinterest keyword searches. Once you have finished, click “Set featured image.”
You should see your image in the Featured Image section of the right sidebar. To preview how this will look once your post is live, scroll back up to the top of the page. In the right sidebar at the top, right corner, there will be a button titled “Preview.” This will allow you to see how your graphics will appear before you publish.
Adding Content Supporting Graphics
Place the cursor where you want the graphic to be, then click on the “Add Media” button. Follow the same process as your Featured Image. You will be able to choose the size and alignment of this image under the “Description” box. This is all preferential. Do what you think looks best.
Adding embedded Pinterest Graphics
This part is a bit more challenging. You start out with your Pinterest graphic the same way that you do with the Content Supporting Graphics. Instead of inserting the graphic(s) into the middle of the post, scroll all of the way to the bottom of your text and hit click the Enter key on your keyboard to drop down a line.
Click “Add Media” and follow the same process as before. When you see the drop-down “Size” box in the “Description” section, choose “Full Size.” Alignment doesn’t matter at this point. Click the blue button to insert the image. Now you will see a huge picture at the bottom of the post. This is good.
The Visual and Text Tabs
At the top, right of your text editor, you will see two tabs, as seen in the image below. I am talking about the area circled in red.
You are currently on the “Visual” tab. Now you need to go to the “Text” tab. This is where you will have to enter the CSS coding to embed and hide your image. You will not see your images on this tab, only the HTML code for the image. I will show you what to look for.
Scroll to the bottom of all of the text. The last thing on this tab should be something that looks like the image below.
This is the image tag. It begins with an “<img” and ends with “/>” For your own understanding the “img” stands for “image.” Enter the following text directly before the “<img”:
Make sure to include everything, including the spaces the pointy brackets. This is an opening tag to edit the visual part of your website. This tag requires a closing tag after the image. After the image tag, enter the following text:
Include the forward slash and pointy brackets here also. Your text should look like the following.
Now, go back to the “Visual” tab. If you entered the code correctly, you will not see your graphics. Next, click “Preview” and review your post is exactly how you want it to look.
You Are Done!
You did it. Now you will have images available to share on Pinterest. Use your social media graphic for your other social media posts and share it with the world.
In the next post in this series, I will discuss how to promote your blog post once it is published.
For updates, exclusive content, and freebies, signup for my email list below. Please comment to this post to share your thoughts and experiences with others. Thanks for reading!