Prepping your WordPress images might seem overwhelming, but I promise it’s easy. Here is the process that I go through each and every time I get photos or graphics ready for my WordPress site. This works with any website platform, but we’ll focus in on WordPress.
Table of Contents
1. Choose a Format
The first step you’ll take when preparing your WordPress photos is deciding what format and type of photo you’ll need. Typically, a PNG or JPG/JPEG is used, although GIF and WEBP are also possible. Here’s when to use what format.
Use a PNG if…
- it’s a screenshot/graphic/illustration
- you need a transparent background
Use a JPG if…
- the image is a high quality photograph
- you need a smaller file size and for it to load faster
2. Use Appropriate Sizes
I feel like WordPress image sizing is a mystery to a lot of users. Honestly, back when I started on Wordpress, I found it confusing too. There isn’t a set size that you are required to upload, but you’ll typically want to keep things under 2000px wide. The exception to this is if you are adding a fullwidth image/banner. Essentially, you need your photo should be sized at the largest width you need it to appear on your site.
For example, if you have a product preview area that is 1200 pixels wide, and the thumbnails are 300 px wide, then your image needs to be 1200 wide. If you upload anything smaller, then your theme will typically stretch out the photo to make it fit, which often results in fuzzy images. On the other hand, if you just need a small photo for your sidebar, then 2000px wide is overkill.
When you upload a photo, WordPress makes copies of that photo in the following default sizes, and even more if you have ecommerce. That’s why you’ll sometimes see options to select a specific photo size. This essentially allows you to tell your site which version of the photo you need on a specific page. This helps with page loading time and overall page size.
- Thumbnail: 150px square
- Medium: Max width and height of 300px
- Large: Max width and height of 1024px
- Full: The original size of your image
A common error that I see on website speed tests has to do with having images that are too large. A couple large images won’t slow your site down too much, but if you are consistently using photos that are too large, then your speed will definitely take a hit.
If you’d like to learn more, this article goes into depth on the WordPress image sizing topic.
3. Use Specific File Names
Make sure to give your WordPress images specific file names. This not only makes them easier to find, but it’s another opportunity to get your keywords into your posts. It’s worth mentioning that Google doesn’t put as big of an emphasis on titles as it does alt text, but titles are still important. Give your images titles that reflect what the post/page/product content is about, and try to get those keywords in if you can.
In terms of organization, when you are searching for an image months or years later, it’s much easier to find a photo called “Classroom Library Book Labels” rather than “image1234.” Get in the habit of naming your photos right away. There’s also no shame in using numbers at the end of titles if you have multiple photos that show the same thing in a slightly different view.
4. Compress Them
There are plugins that can do this for you, but I’ve started just getting in the habit of making sure they’re compressed before upload. The plugins that I’ve used work well, but I find the best ones wind up requiring an extra fee after time. If you’re okay with paying for a plugin, then Imagify, EWWW Image Optimizer and ShortPixel work well. I currently use Imagify on my site, but it’s mainly because I install it on all of my client sites to optimize their existing photos…. so I just added it to my site too. If you want to do it the free way, like I do now, then here’s a quick tutorial video.
5. Add Alt Text
Finally, adding alt text to your WordPress images is another habit you should get into. It not only aids visually impaired visitors (and others who use screen readers), but it adds another layer to your SEO. Google cannot ‘see’ images, so it uses the information attached to your images… meaning alt text, file name, and the description. I typically just copy my image name into the alt text field, but my images are more pin/blog header style. If I have images that lend themselves to be described a little more, then I add a bit more to the alt text
Want to Optimize Your WordPress Images Even More?
There are some great plugins out there that will help you even further optimize your images, specifically to load more efficiently. I use Imagify with all of my sites, but there are multiple plugins that do the same thing. I like Imagify because I have an unlimited credit license and don’t have to constantly purchase credits to optimize more images. Here are the plugins that I recommend to optimize your WordPress images even more:
Hopefully this list of “must dos” made getting your WordPress images ready feel a little more manageable.
Wondering if you should Hire out for Your website images? Here’s my answer… and the 4 type of photos you can source.
