<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=763991110377089&amp;ev=PageView&amp;noscript=1">
8-Image-Optimization-Must-Dos-McGibbon-670x341.png

The 8 Things You Need To Do For Every Image on Your WordPress Website

Dec 15, 2015 / by Melissa McGibbon

Adding an image to your website is not as simple as just uploading and clicking the publish button. Of course, that is an option--you can do it the lazy way--but if you want a perfectly optimized website and favored search results, there are a few things you need to do to make sure that the images are optimized before you publish them. You may find it tedious and annoying, and time consuming, but taking the time to do this right will be worth it when you see your A+ grade on Google and Bing Webmaster Tools and are rewarded with stellar search rankings.

Edit

If you don’t own an Adobe Photoshop license, don’t worry, there are plenty of free online photo editing tools that can help you get the job done. Using high quality photos on your website is as important as using proper grammar.

These websites offer free tools that make it easy to crop, resize, and edit your images:

Compress

Large image files take up a lot of valuable space on your website and will slow down your site speed and hinder its performance considerably. Before you upload any image to your site, compress it. In Adobe Photoshop, select “compress for web” before saving the file. You can also achieve similar results using some of the free image compression tools available online. Site speed is a ranking factor so the faster the better.

Results vary, but in one test, Adobe Photoshop reduced a 236 KB image to 108.1KB, while TinyPNG reduced the same file from 236KB to 110.4KB. So, Adobe Photoshop does perform slightly better, but you can get pretty close using other programs.

File Name

Once you have readied the image for uploading, make sure to name it properly. Search engines use file names to identify and index results so this is a really important step. If you name a file with a bunch of letters and numbers that doesn’t give search engines any information about what the image portrays. However, if the file has a specific name such as, “Eiffel Tower Sunrise” then it can be categorized and indexed, whereas naming the file something like, “Paris” doesn’t describe the image very well. Use keywords in the file name to boost your search results. Be sure to use hyphens in the file name to separate words.

This: Eiffel-Tower-Sunrise-Copyright-Melissa-McGibbon

Not This: ParisET7845781-4

URL

When you upload your edited, compressed, properly named image to your website, WordPress will show the attachment details in a box on the right side of the Insert Media page showing the automatically generated permalink URL based on the file name, this is essentially the web address of the image. You can’t change this once it’s uploaded so if you forgot to change the file name before uploading your file, you’ll have to delete the image and reupload the newly named image.

Image-Description-Box-Example.png

Image Title Attribute

The image title box is right below the URL box. Here, you can name the image whatever you like. This title should complement the Alt Text Attribute, but not repeat it. Though, Google primarily uses the Alt Text Attribute to determine information about an image file, it’s helpful to add additional relevant information about the image in the Title box. Something short and specific will do.

Caption

Adding a caption is not necessary for SEO purposes, but may be helpful for user experience. The content in this box will display on the front end of the site while the Alt and Title Attributes will not.

Alt Text Attribute

The “Alt” is short for alternative. Search engines refer to the alt text when trying to determine information about the image--a textual representation of the image content. The best use of an Alt Text box is to provide a word pairing for the image. Specificity helps here, too. This is a very important element for SEO because it provides a description that lends to search results. Don’t use the same content for the Alt Text and Title Text or Description fields. They each need to be unique. This is the content that will appear if a browser is unable to display the image.

This: View of Eiffel Tower at sunrise from Place du Trocadero

Not This: Eiffel Tower in A.M.

Description

The description information will be displayed on the attachment page of your image. In this field, you can be as descriptive as you like, such as telling the story behind the image or what kind of camera you used to take the photograph. You can add links in the description field. Again, don’t just copy and paste the information from the Title or Alt Attributes.

After you do one or two of these, you’ll start to appreciate why web developers are worth every penny. On that note, if you don’t want to take the time and energy to properly optimize all of the images on your site, we’re at your service.

Click here for more information about our Web Development Services.

 

  New Call-to-action

Topics: SEO Web Development Blog

Melissa McGibbon

Written by Melissa McGibbon

Melissa McGibbon is an award-winning journalist and a digital marketing expert. She is usually in search of adventure--or a cute puppy.

Let us improve your online marketing results

We have increased traffic, leads, and sales for well-known companies—including Dell, Mrs Fields Cookies, Hotels.com and H&R Block.

Plus for hundreds of local smaller companies like dentists, plumbers, dermatologists, etc.

Find out how to work with us  

Subscribe to Email Updates