Since Google is a search engine for images as well, it has image publishing guidelines to consider and follow. However, naming images for better search engine rankings is a science rather than an art.

Naming Your Images

Google image publishing guidelines states

my-new-black-kitten.jpg is a lot more informative than IMG00023.JPG. Descriptive file names can also be useful to users: If we’re unable to find suitable text in the page on which we found the image, we’ll use the file name as the image’s snippet in our search results

Above example clearly reveals that Google can and when appropriate will use the image file name when all other information is missing. So make Google’s job easier by naming your images intelligently.

Throughout the years, after optimizing thousands of images, I found that the best way to begin is to visualize a blind citizen has just landed on your web page, and since they will be using assistive technologies to understand what the image that they can’t see is about.

What Words Can You Use?

That’s where you begin optimizing your images, by giving them short but informative file names using keywords.

Images in HTML by w3.org

Google may be the search engine people rely on to find answers everyday, however, w3.org web standards is the standard internet is built upon. Meaning, Google is just a search engine, and there are many other search engines like Bing and Yandex, and all the technology built on internet follows set of guidelines outlined by w3 consortium.

Images Defined in Hypertext Markup Language

As we can see in the sample image above, we have the <img tag which marks the beginning of the HTML image, and the SRC attribute defines the source (location) of an image. And you can in fact place your images on your web page with just this information. But if we leave it at that, then we will definitely miss out, because we can take advantage of other information we can place which Google can understand as well.

ALT Attributes is Text

This is where you place alternative information regarding the image you are using. But I’d like to draw your attention to the point “information regarding the image”. Because almost all information regarding image optimization suggests that ALT attribute is there for you to place your important keywords only. Mentality like that is call spamming, instead, understand that HTML image ALT attribute is there for you to give text alternative about the image itself. Let’s take look:

Image name by itself doesn’t make much sense, but when you use ALT attribute it does.

Can You Provide Additional Information?

Yes we can by using an image title attribute, because although its non-essential information, nonetheless, it is useful, so whenever you can place title attribute for images, then do so. Once again, visualize the blind citizen example when creating image title attributes, because by using the title attributes the images can really be visualized by everyone including search engines like Google.

How About Faster Loading Web Pages?

I don’t know if this is suitable for your current website images, but you can set the image width and image height in the img tag itself.

However, if your website is mobile friendly and uses responsive design, then you can define width and or height declarations through CSS like this:

img {

height: auto;

width:100%;

max-width: 720px;

}

Images are part of all modern websites in 2016, not only do they allow you to increase your conversion rates by conveying visual messages for your products and services value. They also tell search engines like Google more about your website because search engine’s job is to figure out what your content is all about.

Additional Resources