5 Helpful Facts About Blog Images
Blog images, pictures and graphics are critical to keep your audience’s attention. They capture readers’ interest, help break up the text and create a more memorable story. Although I couldn’t find the verifiable source, there is a prevailing wisdom that people process images 60,000 times faster than text.
This makes images a “must have” for digital content.
But when not used correctly, graphics on your website can also hurt the page. Here are 5 facts to keep in mind when selecting the right images for your story.
1. Blog Images Must be Relevant to the Content
From feature images to support pictures, you need to share a clear and unified message. Editors use pictures to make the page look appealing. But all too often, these photos have nothing to do with the story.
For example, I recently stumbled across a blog article talking about technology changes in the upcoming year. The featured image was one of hot air balloons at dawn, flying over a dusty plain.
Now, what is the connection between technology and hot air balloons?
The image kept me on the site long enough to look for a connection. But since there wasn’t one… I quickly left. And while I remember the disconnect between the image and the headline, I can’t tell you a single fact from the page.
It destroys a writer’s credibility when the images don’t relate to the story. That disconnect creates emotional discord with the viewer.
A better practice is to choose images that connect to the message.
For example, a nutritionist may find it very effective to use photos of green vegetables when talking about vitamin density of fresh foods.
Images that support the story build the author’s credibility because there is a unity in the message that attracts readers unconsciously.
Good blog images also build on the story in the content and make it more memorable.
2. The Location of Images Matters
Open any blog page today, and the first thing you’ll see is a feature image at the top of the page. Editors do this because the picture’s visual appeal earns viewers’ attention. It makes them curious to read your story.
Once on the page, pictures should be placed carefully throughout. Some sources recommend having a graphic every 300 words. Personally, I feel this may be excessive, depending on the writing. Some messages need more support—others less.
The point to remember is: select enough pictures to engage the visitor without overwhelming the story… especially with irrelevant photos.
When writing for western cultures, people look at a screen from left to right. Because of that, your most important information should be on the left side of the page.
Wherever the image is displayed, position it to support the message without being distracting.
3. Use Captions with Blog Images
Not using captions with pictures is one mistake I see many web publishers make. Sometimes images are self-explanatory—think of all the Twitter and Facebook post screenshots used by news sites. But most of the time, adding a caption to a photo is an extra chance to help readers connect the picture with the story.
And captions can be an extra way to add keywords and phrases if you are thinking about SEO. Search engines don’t use captions specifically in ranking sites. However, they use the words included in the caption to classify the page.
Did you know that captions are read 300% more than body copy in an article?
Old-fashioned newspaper publishers knew that. For some reason, in the transition to the web, writers forget this one key point. So, use captions with images that aren’t obvious.
Consider the picture below from Wikipedia. The block title acts as the caption. In the above snapshot of the essential oils, the caption describes the use of oils in diffusers. The captions make reading easier for your visitor.
4: Image Formats & Size Affect Page Performance
Another mistake inexperienced web publishers make is using the wrong formats and sizes in their blog images. Pictures that are too large bog down page functionality. Slow loading pages and pictures mean visitors leave without reading your information.
JPEG, PMG, GIF, SVG… which format type should you use for your page’s images?
Use JPEGs for Photographs
JPEG stands for “joint photographic experts group” and provides the smallest photo size for your pictures. When you have the option of JPEG or PNG for a photograph, choose JPEG. It offers better coloration with smaller file sizes.
PNG is Best for Graphics & Logos
PNG, or portable network graphics, has fewer color options than JPEG images, but PNGs are easier to manipulate backgrounds to make them transparent. This quality makes them the ideal format for graphics and logos.
Save GIF for Animations
GIF means graphics interchange format. GIFs serve a similar purpose as PNG but can also incorporate animations. GIFs are a heavy-weight format, and you should use them sparingly on your pages. It’s better to choose PNG whenever possible.
If you take pictures or often download them from photo sites, you know that you can easily have large images.
I recommend considering how you want to use the picture and uploading the smallest size for the purpose. It may mean you have more than one version of several photographs. Just make sure you identify that, so you choose the size image you want on the page.
After much research to find the best answers, here is a list of use reasons and the recommended maximum pixel size.
NOTE: This is for online publishing purposes. If you are using the images for printing purposes, you should ask your graphic designer what works best.
Recommended Image Sizes
|Recommended Pixel Size (max)
|150 x 150
|Facebook Profile Image
|180 x 180
|200 x 100
|200 x 200
|Medium Sized Pictures
|300 x 300
|E-Commerce Product Page Image
|800 x 800
|Facebook Cover Photo
|851 x 315
|1024 x 1024
|Headers Image, Banner
|1048 x 250
|Blog Post Image
|1200 x 630
|Facebook Shared Images
|1200 x 630
|1200 x 900
|WordPress Background Images
|1920 x 1080
Choosing the right file format and size and reducing overall page load times can increase conversions by an average of 19%. On mobile devices, a 1-second delay can reduce conversions up to 20%. That makes this a critical element to look at on all your pages.
Metadata is information hidden on your page. It’s in the code and needs to be there, but readers only see it at certain times. Writers easily forget to include this information when writing pages.
Search the web long enough, and you’ll find arguments about why the information is necessary, but here’s what I’ve found to share with you.
Why Include Alternative Text
Alternative text, often shortened to alt text, has 2 primary purposes.
First, when internet users have poor reception, pictures may not load. Computers replace the blog image with the alt text. It’s the writer’s means of communicating that picture when it won’t load.
Second, automated screen readers use alt text to describe the picture to visually impaired customers. HubSpot estimates digital marketing misses 61 million people from lack of accessibility.
The text should be descriptive enough; the visitor knows the value of its meaning.
Most people use this entry to put keywords that make no sense to the reader. Here are three examples of suggested alt text:
1) Photography Human Humanity Men – geralt / Pixabay
2) Cameras Lens Analog Film Vintage – coyot / Pixabay
3) Camera Lens Focus Equipment Petals – Rosy_Photo / Pixabay
They make no sense to a reader who can’t see the picture. I could easily update all three to “Picture of cameras used to create blog images” and have a better description. On a retail page, the alt tag could be: “Bessa-L Voigtlander Camera” to describe the product for sale.
These descriptions help the audience understand the picture’s purpose on the page.
The alt tag is also a principal place to use SEO keywords for your page… as long as it makes sense in the description.
The Hidden Value of the Title Tag
When you upload a photo into your web platform, the title tag defaults to the filename, you end up with title tags that look like woman-2773007_1280 or decorative-2022594. Often the same description is used for both the alt text and title text.
While readers will never see this, search engines use this information to help categorize the page. While it’s not individually an SEO audit element, it helps to use a better description.
My logo has the alt text of “Maggie’s Writing Service Logo” and the title tag of “MWS-Logo-150×150.” I get to use the long form of my business name and the acronym in ways that don’t distract readers from the rest of the page.
In this case, I also used the image size, so I know to use this file for thumbnails only.
The Debatable Value of the Image Description
This field is another background field that site visitors will probably never see. However, if you want another area to add information for SEO purposes, this is a hidden opportunity.
As you can see in my example, I don’t worry about the description much.
When I use it, I add information that is helpful for me when I refer back to the picture. For example, I write my purchase source for the image in case I need that information in the future.
Cautionary Note: Search bots review this information. Unique and useful information will benefit you, but repeating information creates duplicate content and may hurt site credibility in bot-land.
Ideally, you want interesting pictures, images and graphics that support your story.
In doing so, aim for a page size less than 500KB. Most pages end up somewhere between 1.3MB and 2.5MB.
Photo editing programs can help you resize pictures. Most website builders also have plugins available to help you resize your blog images to friendly sizes.
Images aren’t the only coding that affects page size, but they can single-handedly ruin a page size.
What has been your experience with pictures on websites? Share stories in the comments below.