Best practices for using your WordPress website media library like a pro!

If you have a WordPress website, you’ll be familiar with the media library. It’s the home of all the images, PDFs and other files you’ve uploaded to use on your website. When your website is new and the media library only has a few files, it’s very simple to use – you can easily scroll through and find what you’re looking for. However as time goes on and your site grows and changes, you may find yourself becoming overwhelmed by your behemoth of a media library! Read on to find out how you should be running this part of your website.

Pro Tip 1: Resize your images before you upload

Importing original sized, unedited images to the media library is commonplace. This may not seem like a big deal – after all, if the image uploads successfully and looks good on the page, why would there be a problem?

The problem is not with how the image looks, but the time it takes to load when viewing the site. The larger a file is, the longer it takes to load. So think about this: if all the images uploaded to the library are massive, they will slow down your overall website speed noticeably. A slow loading website isn’t just a frustrating user experience but is also frowned upon by Google. Therefore, taking the time to resize your images is a no-brainer! Some instructions on how to do this are below. Bear in mind that if you don’t have Adobe Photoshop, there are plenty of alternatives such as IrfanView, GIMP, and various online image resizer websites which can be found through Google.

Tips to Reduce File Size

Step 1: Photoshop Export

1. Open the image in Photoshop
2. File > Export
3. Save for Web
4. Adjust the image quality preset (starting at High) until it previews at less than 1 – 2.5MB
5. Click the Save… button
6. Give the image a consistent naming convention

Step 2: Run through Tiny PNG

1. Drag the image into tinypng.com
2. Download the reduced file

Step 3: Upload to WordPress

1. Drag the image into WordPress
2. Give the image a Title, Caption, Alt Text and Description

Tips to Reduce Image Dimensions

We recommend to keep images around 2000 pixels wide or less, but consider if they will be used for a banner or full width image on the site. You don’t want to make them so tiny they become pixelated!

Step 1: Photoshop Export

1. Open the image in Photoshop
2. Image > Image Size…
3. Adjust Width (Photoshop will automatically adjust the Height)
4. Click the Ok button
5. File > Export > Quick Export as PNG
6. Give the image a consistent naming convention

Step 2: Upload WordPress

1. Drag the image into WordPress
2. Give the image a Title, Caption, Alt Text and Description

Pro Tip 2: Use a system to name your images

So, you’ve resized your images and you’re ready to upload? Not so fast! First have a look at how those images are named.

If you’re uploading images of dogs and you’re using overly simplistic file names like “dog1.jpg” “dog2.jpg” and so on, go back to the drawing board. The only thing worse than this is using the random file name the computer suggests, or just typing gibberish. If you get into these bad habits early on, down the track you’ll find it nearly impossible to locate a particular file using the search bar, and you’ll need to scroll through every single image to find the one you want.

We’d also suggest staying away from using spaces in image names, and use underscores or hyphens instead. WordPress converts spaces to display as “%20” which looks messy.

So if you follow these suggestions, instead of “dog.jpg” or “56048zrtw459.jpg” you end up with “black-labrador-running.jpg.” This system is clearer, more descriptive and will save you headaches down the road.

Pro Tip 3: Make sure your image has not already been uploaded

One more thing to check before you go ahead and upload your optimised, clearly named images. Remember to scroll through your library and check for duplicates. Often, just because the image in question isn’t displaying near the most recent files at the top of the library, people can forget that it’s already been uploaded. This usually occurs when the same image is used on different pages on the website, but there’s absolutely no need to upload the image again for every page it appears on! Uploading duplicates achieves nothing except slowing the site down.

If you don’t want to go through and remove duplicate images manually, there are plugins out there which identify and delete them from your library. Just bear in mind that if you automate this process you may end up with some broken image links, so be sure to check each page.

Of course, the easiest way to avoid getting into this mess is not to upload duplicate images in the first place.

Pro Tip 4: Use the “Title” and “Alt Text” fields

This is one of those little things that’s easy to ignore, but if you take the time to do it there will be long-term benefits. The title and alt text of the image can be the same as the file name, or more descriptive – but the most important thing is that you actually put some text in these fields rather than leaving them blank. Ideally, fill out the caption and description fields too. This allows Google to understand what the image is, which means SEO benefits (hooray)!

Google doesn’t just rank the pages on your website, it also includes images and PDFs in search results. So if you have a lot of unique, optimised files using appropriate keywords in these fields, it’s more likely your site will be found on Google. Another benefit to using the “alt text” field is improved accessibility, as it allows users who can’t view images to understand what is in the photo. 

Pro Tip 5: Don’t try to hack the Media Library!

In order to clean up the media library, some web users find they are tempted to install a plugin which allows you to set up a folder structure. As this blog explains, that’s actually a terrible idea. Along with the points raised in the article, this ties back to our point of how important it is to use one image multiple times on the website rather than uploading duplicates. Burying images in folders makes them that much more difficult to find the next time you need them. Instead, use the search function. If the images have been named correctly (following suggestions above) this is the best way to locate a particular file.

In general, using plugins to change how the WordPress core works should be done with serious caution. What works now could break on the next WordPress update – so make sure this is handled by the experts. 

ROME WASN’T BUILT IN A DAY

None of these guidelines are particularly hard to follow, but they can be annoying when you’re in a hurry to get new content up. The most difficult part of keeping your media library organised is getting in the habit of following these guidelines every time you upload a file. If you can commit to these best practices long term, not only will it help you when editing content, but you’ll be rewarded with a speedy, Google-friendly website.