Most marketing department folks and organizational stakeholders are always hoping for optimum exposure from their websites, always looking at the scorecard and website traffic reports hoping that the page views, duration per page visit, and other metrics are showing improvement and growth. The typical well-oiled and traditional Search Engine Optimization (SEO) pursuit may seem to be chugging along as planned, but one of the most overlooked items for optimization on a website is the graphic part - made up of images, logos, icons, buttons, and graphics. This article will review the best practices for image SEO, including the types of metadata, image file naming conventions, keywords, alt image tags, and captions.
Targeting your SEO to specific audiences other than search engines include social networking and people. And lastly, several online tools and a plugin are provided that can assist you with reviewing how your website stacks up with image SEO.
All the right images
Just because you have an image on a web page does not mean it is always effective or even pertains to the focus or subject matter. While textual content titles and headlines are the first item most visitors see on your webpage, any associated images are the "eye candy" that pushes the content to the forefront. By this time you might be wondering about the blood cell image with the "Image SEO" text, and you might ask what an image of blood cells has to do with the subject at hand? Good question! Blood cells are an integral part of the human anatomy, but most people don't go around thinking about their blood cells every day. And just like blood cells, most web development folks and organizational stakeholders for that matter, don't pay much attention to the images they arrange on their web pages, but images are an integral part of the web page body that is often ignored.
If your web development team does not include a graphic artist or you just don't have the time or budget to create your own images, you can always find stock images online; just make sure you abide by the licensing requirements.
Don't forget about your icons, logos, and banners on your web pages. Often these types of images get lost in the fray as part of a template, sidebar, or widget within a Content Management System (CMS), and they only get touched when major look and feel or redesign projects are implemented. How many pages on your website do you have Twitter, Facebook, or Google+ icons/logos? Make sure you pay attention to those images also, and others like Stumble Upon, Delicious, LinkedIn, Tumbler, Digg, Google Reader, among others.
Get your image metadata
Following best practices for file naming conventions, keywords and alt tags, surrounding textual content, image captions, and image titles will help promote your images in search results.
When you viewed the image of the red blood cells above, you mostly likely instantaneously identified the subject, but no search engine or crawler spider is going to identify it more accurately than the human interface does.
The International Press Telecommunications Council (IPTC) Photo Metadata serves to describe and administrate photographs and to provide the most relevant rights related information, making visual content easily accessible by human language terms or machine readable codes. The IPTC provides a set of three standards which are the ITPC Core, ITPC Extensions, and the Information Interchange Model .
So what we need to do as web masters and developers is to help the search engine crawler by optimizing metadata with keywords and alternate text.
Image SEO best practices
Keyword image file names
Use relevant keywords for image file names, keep the file name to five words or less, and use a hyphen (-) between words without spaces. Typical files names for stock photos might be like "stock_photo-034543-med-400px image.jpg", note that this image file name has no relevance at all to the content except that the image is stock, is medium sized at 400 pixels, and it also uses a combination of underscore and hyphen, and has more than five words. A better file name example would be something like "red-blood-cells-image.jpg". Notice that the image file name is four words separated by hyphens with no spaces between. Other keywords that might fit this image depending on the associated content on the web page could be terms such as anatomy, biology, healthcare, hematology, microscopic, or plasma.
Image file types:
The best practice for image file types or image URLs are BMP, GIF, JPEG, and PNG.
Make sure each image has an alternate (alt) text included within the image tag, use descriptive keywords such as the examples above that pertain to the image content, and limit the alt text to five words separated by commas. An example would be <img src="i/red-blood-cells-image.jpg" alt="red, blood, cells, image, human" />.
Image directory consolidation
Maintain all images in the same sub-directory to keep them consistent within your website. Having images in multiple directories makes them harder to be found by search engines. I know this is easier said than done, especially if your website has multiple sub-topics with their own areas or directories, or on multiple web servers for that matter, but consolidate your images as much as possible to help in other ways as well.
Image anchor textAny images that are linked from anchor text should be specifically set to incorporate the same keyword best practices. How many times have you seen a web page that has the following phrase, "Click to see the image of..." or some such variant? A better image anchor text would be something like "Click to view the image of red blood cells."
Surrounding textual content
Image placement on the web page is another important consideration and this can include caption text as well. Make sure your images are placed near the textual content which is relevant to the image itself, and ensure that the same keywords used in the alt text are sprinkled within and around the neighboring paragraphs. Of course, the keywords should have already been picked out from the original content in the first place; we just want to make sure that the same keywords are used consistently across all relevant content types.
Social networking image optimization
Want more of your images to show up on Facebook, or Digg? Each has its own image guidelines, but for the most part you always want to start with a stellar image to give your readers a reason to share them with all their peeps.
Use clear images with high resolution and details, also those with people's faces will capture more eye attraction, and make sure the image is relevant to the content on the page - remember consistency.
Image SEO Tools
I've listed several tools that can assist you with reviewing your image alt text and link analysis including a WordPress plugin that assists with SEO friendly images.
- Image ALT Text Tool - Created by Patrick Sexton, who has been helping webmasters with the Google Webmaster Guidelines, this tool examines the images on your web page and tells you how well they are being "seen" by search engines like Google.
- Image SEO Tool - A similar alternative to the alt text tool above, however, this tool will show the image in questions as it examines the images on your web page and will tell you how well they are being "seen" by search engines.
- Image & Link Analyzer - This tool allows you to check webpages and images for size, alt text, header checks, image file path, the native size of the image file in pixels (not the display size specified in the tag), and other properties and attributes.
- SEO Friendly Images - The WordPress optimization plugin which automatically updates all images with proper ALT and TITLE attributes. If your images do not have ALT and TITLE already set, SEO Friendly Images will add them according the options you set. Additionally this makes the post W3C/xHTML valid as well.
If you are a stakeholder within your organization or part of the web marketing team then it's time you reviewed your image SEO to see if your website needs an image overhaul. If you are a web developer how well has image SEO been implemented within your organization?
Ryan has performed in a broad range of technology support roles for electric-generation utilities, including nuclear power plants, and for the telecommunications industry. He has worked in web development for the restaurant industry and the Federal government.