Images are a large part of websites, and just as the rest of the website needs to be optimized, so do the images. It is really easy to maintain images once you get a little system going, and understand what you need to do for each one.

First off, it is important to optimize your images in their entirety. Image file size should always be compressed, while maintaining as much image-quality as possible. You want a small, high-quality image. It is critical to have small file sizes. People do not want to wait for web pages to load. As the speed of our technology increases, our patience decreases. While we become more acclimated to our high-speed capabilities, we expect things to happen faster, and lose patience with things if they are slow. You never want anyone to lose patience with your website.

SEOing ImagesNext, make sure your images are an appropriate size (dimensions on the page). It needs to fit nicely within the content of your site and make sense. Images are going to draw attention to themselves, but you don’t want them standing out like a sore thumb. Make them matter, and look nice.

When uploading your images to your server where your website is, it might be a good idea to organize the images. Never put them in the home directory, there is no need for that. At minimum put them in a folder called “images” that is located in the home directory. Depending on how many different groups and types of images you have, you may want to take it a step further and put them into more folders. On a website about cakes, you might wants folders for wedding cakes, or birthday cakes. Your directory for that will look like this: images/birthday or images/wedding. If you only have one image of each kind of cake, then you probably don’t need to organize them like this, but it’s always a good idea. Besides, chances are you will be adding more pictures of wedding and birthday cakes as you continue to maintain your website. It’s always good to be prepared.

Now, for the official SEO side of the images. Search engines look for text. So, it is essential to search engines that there is text to be found. You want as much information available as possible when engines crawl your site, and this includes images. But images aren’t text, how do we make them visible to search engines? Easy! It’s all in the code.

When you place an image on your website, there is a code that goes with it. Each of these image codes can have different information in them. Each of these bits of information are helpful when engines are crawling your site. With just a basic code like <img src=”image1.jpg”>, your image will appear perfectly normal, but it will be lacking on the informative side for search engines. From that code, we have no idea what kind of image that is. There is no description and no way of knowing anything about it from reading it. If you can’t figure it out by reading the information inside the code, then neither can a search engine (it’s okay if you don’t know HTML to understand the actual code itself, we just want an understanding of the words we put in it).

Let’s pretend our website is about cakes, to keep with the example I used earlier. Cakes are delicious and with many varieties. Surely people will want to go to our website, but they need to find it first. Here are some examples of what can be done to the code to make it more effective:

  • Rename your image with a simple description of what it is. We’re going to say that this image is a birthday cake with a car on it. <img src=”car-birthday-cake.jpg”> See how we can already tell what the image is? This is already much more useful to search engines than “image1”. Be sure to separate your words in your image name—this makes it easier to read by people and machines. Some other examples: “german-chocolate-wedding-cake” “victorian-wedding-cake”, you get the idea.

  • Add a title to your image. <img src=”car-birthday-cake.jpg” title=”Birthday Cake”> The title shows up when you hover your mouse over an image. This is the text that appears with a basic description of who or what is in the picture.

  • And lastly, add some alternative text with an alt tag. <img src=”car-birthday-cake.jpg” title=”Birthday Cake” alt=”Birthday Cake”> The alt text appears when the image isn’t loading for whatever reason. Instead of there being an ugly little X-ed box, it will say “Birthday Cake”.

All of these extra bits of information give search engines much more to go on when they’re crawling around the web. You may eventually find your image by searching for “image”, but just how many people actually type that into a search engine? Not to mention how many images are out there called “image”? People want specifics when they’re searching for particular items, so you should always point them in the right direction and give them what they’re looking for. Optimizing from the start will save you worlds of trouble later on, and give your site a lot more attention by search engines from the get go.