Filenames and Alternative Text - Optimizing Your Images for Search
Images are great; they can draw the eye, provide additional information, affect one’s mood, and serve to really strengthen a message.
Would your website's content work just as well without any images? This is something you need to keep in mind when trying to optimize your website for search engines.
Search engines dispatch "bots", also referred to as "crawlers", which scour the web in search of websites to index. However, these bots don’t see all the nice visuals the way you and I see them. These bots see your website in code.
So what does an image look like to one of these crawlers? To get an idea, head over to Seo-Browser, input your website URL, click on "I'm not a robot", and hit "simple". You'll see your site the way a search engine bot sees it, and if you look closely you'll notice that your images are replaced by their filenames; that's what your website looks like to a search engine bot.
JPEG vs. PNG - Which Image File Type is Right for Your Site?
There are actually dozen of file formats, but for the sake of simplicity I'll only discuss the two most common image file types you'll see on a typical website.
JPEGs are image file types that make use of lossy compression. In laymen's terms, this means unnecessary information is removed from the image in order to create a smaller file than you could with a PNG. As a general rule of thumb, save real-life photographs as JPEGs.
PNG files use lossless compression which makes them the go-to choice for line drawings, text, and graphics.
The Importance of Image Optimization
These search engine bots are impressive, but they need to rely on several sources of information to make decisions about your website. I won't break it all down on this post, but naturally one of these sources of information are the words you use (the content) and the type of websites that link to you. However, for the purposes of this blog post, I'll just be focusing on the non-visual information you can provide through images.
So what non-visual information can these bots glean from your images? The filenames and the alternative text.
Optimizing Your Image Filenames
Are you planning on uploading some images to your website? Before you do, find these images and take a look at their filenames. Your camera tends to name them with the date of when the image was taken (if you're lucky), but do you think this provides search engines with much information?
As annoying as this might sound, you actually want to change the name of each image into a concise description of the image(s). Don't get fancy!
Use this as a guide:
I named the image above "Santa-Barbara-Mission" and uploaded it to this blog.
If you right-click on the Santa Barbara Mission picture and click on the "open link in new tab" you'll see the web address for this image. Click on the newly opened tab. Then, look up at the URL bar. This should be what it looks like:
Focus on the bolded words "Santa-Barbara-Mission" in the above URL. Everything else in the URL is generated by the blog itself. All I had to do was title the image as "Santa-Barbara-Mission" and upload it to this blog.
You may notice that dashes/hyphens ("-") have been used instead of spaces; this is considered best practices and I would encourage you to name your images in this manner.
Adding Image Alt (Alternative) Text
"Alt" text is another important aspect of not only image optimization for search, but for visually impaired readers. Specialized software allows the visually impaired to navigate websites; when they come across images, the software reads them the alt text of the images.
Unlike an image filename, you shouldn't write your alt text with dashes/hyphens. Instead, just write it as you would a normal sentence.
For example, the alt text for the SB Mission above is: Front view photo of the Santa Barbara Mission
Just like a filename, keep it concise and simple.
To gain a greater depth of understanding of alt text, check out this video by Google's Matt Cutts.
Applying Alt Text on WordPress
Applying alt text to images on a WordPress site is easy. I recommend you go back to your older web pages and blog posts and add alt text to any images.
1. Click on the image you want to edit, you should have a series of buttons pop up; then click on the pencil button (edit button).
2. You should immediately see the "alternative text" field (see image below). Type in your alt text, and if your "Image Title Attribute" field is empty, go ahead and type your alt text in there as well. Click on the image below to get a better idea of where these fields are.
You should now be ready to optimize your images! Let me know if you have any questions in the comments section and I'll be sure to answer them!