BusinessHow to Optimize Your Images for Better SEO

How to Optimize Your Images for Better SEO

With the outdated methods of the past, came an equally outdated black hat method known as “cloaking”. This is the practice of feeding the search engine a page scripted to actually read the keyword content of your legitimate page, but at the expense of the visitor. The visitor is then often redirected unknowingly to another page with completely different content. Cloaking is unethical and is more than likely to get your site banned from a search engine. Any search engine can recognize cloaked pages and buried, invisible or even off-screen text. It’s not worth ruining your site’s integrity over.

There is no magic number for keyword density and it is nothing to base the success of your website upon. In fact, repeating any keyword too much can and will have a negative effect on your rankings as it could flag your site as “keyword spamming”. Keyword density is best not thought of in terms of total percentage, but in maintaining keyword balance throughout all on-page text. Guidance as to keyword density varies widely, but a safe target to work around is 5-10% word balance though any recommended or required keyword weighting will vary with individual keyword competition.

This is false.

SEO is a field with a lot of broad assumptions and “rules of thumb” that often turn out to be false. One such rule that has shown to be rather useless is the over-emphasis on keyword density. The general premise with this is that the more keywords that you have in various ways on your site, the higher your ranking will be.

To the vast majority of webmasters, search engine optimization (SEO) is essentially the attempt to have your site get a higher ranking with the various search engines. This is done through a variety of means, all more or less related to the information and structure of your site. Yes, it is manipulation, but it is harmless manipulation that tells the search engines what your website is about and why it belongs at the top of the listings.

Importance of Image Optimization for SEO

For product images, it is a huge aspect to focus on. Can you recall a time when you saw an image online, clicked it, and it took 30 seconds or more to display the image? Neither can anyone else. People and search engines are much less tolerant of slow loading images in this day and age where everyone is accustomed to speed and efficiency. This too is a part of image optimization, and often gets overlooked.

Consumers are growing increasingly aware of the best practices for finding what they want online. A staggering 63% of data is comprised of images according to HTTP archive, the image SEO opportunity is huge.

Search engine spiders can only crawl through text, which leaves only one choice for search engine optimization on images: optimizing the text that surrounds the image. Adding relevant keywords along with descriptive text has always been the best way to make the most of SEO service, and that’s no different when it comes to image optimization. Also, if your images are pinned or reposted elsewhere, often times the description will go with it and it turns into a link back to your site. This will help draw more attention to your site or blog. With more up and coming web opportunities such as Pinterest, the more optimized the images, the better your chances of leveraging these new prospects in image searches.

Benefits of Optimizing Images for SEO

In a nutshell, optimizing images has both the direct and indirect benefit of generating more traffic to your website.

Studies have shown that people often use image searches to find desired websites or research general topics. If your image properly reflects a user’s search criteria, your image will appear in search engine results. When a user finds an image that is similar to what they are searching for, they are likely to visit the site where the image is located. So, optimizing images and ranking highly in Google image searches has the potential to bring a large volume of customers and traffic to your site. This is an untapped market because website owners often overlook image searches when considering SEO initiatives.

Fast forward to today’s online business, and nowadays “location” means search engine results and “positioning” means an attempt to achieve high search engine rankings. In the world of online marketing, having your business easily found by potential customers is crucial. Now, if I were to tell you that there is a new technique to attract an untapped market of consumers who are currently searching for your products, but they can’t find you, would you be interested? Of course, you would be, and optimizing your images can do just that.

In business, there is a popular phrase “location, location, location.” There are two crucial factors of this phrase that internet businesses need to be concerned about. First, you would like for your business to be located in prime areas in order to be easily found by consumers. Secondly, in advertising, location is incredibly important. That old saying is also often cited by retail outlets to illustrate that the positioning of their store is a key factor in the success of the business.

Choosing the Right Image Format

JPEG (Joint Photographic Experts Group) is the best format for photographs. It uses lossy compression to reduce file sizes, which can result in a significant loss of quality, e.g. artifacts and blurring. A good way to avoid too much loss in quality is to zoom into an image at 100% and play with the quality sliders when you save an image in Photoshop. This allows you to see the quality loss and find the best compromise between size and quality. In general, it is best to avoid using JPEGs for decorative images that contain text or line art; the lossy compression can mangle these types of images. JPEGs are best suited for full-color photos and images with smooth transitions between colors. Always save a master copy of an image in a lossless format if you will need to edit/reuse it.

The ‘right’ image format is the one that best suits the task at hand. In order to optimize an image for the web, you should start by deciding what the image is for. Will it be used in a print layout, in a PowerPoint presentation, on a website, what is its purpose? All of these factors impact on your choice of file format. Different image file formats are employed for different uses. Some formats are ideal for the web, some are better for the print industry, and others are best for specialized uses, like image maps or CD-ROM interface design. The formats most useful for websites are JPEG, GIF, PNG, and SVG.

Understanding Different Image Formats

GIF, or Graphic Interchangeable Format, is limited to 256 colors. It is best for images using line art with limited colors, like logos or images with text. GIF is also best suited for animation. Simple GIF images have very low file sizes. Like JPEG, GIF can also be “progressive”. GIF is “lossless”, meaning that even opening and re-saving a GIF will not affect the image quality. The feature that makes GIF great for logos and simple images is the ability to define a transparent color. This makes GIF the only image format that can create an image with text or lines that have no background color. Unfortunately, the 256 color limitation makes GIF unsuitable for detailed photographs. Any photograph saved as a GIF will lose much of its quality due to the color reduction.

JPEG, or Joint Photographic Experts Group format, is best for photography and photo-like images. This type of image is “lossy”, meaning that it loses quality every time it is opened and saved. A high quality opening and re-saving will not affect the image, but a low quality opening and re-saving will degrade the image. “Lossy” can be compared to a photocopy of a photocopy, each generation is a degraded version of the original. A high quality JPEG is the smallest file format for photographs. JPEG uses 16.7 million colors and is best suited for the web as it is the most widely supported image format. It can be “progressive”, which displays a low quality image that gradually improves in quality as more of it loads. However, generally a full quality JPEG taking time to load is always preferred to a degraded image “baseline” that never improves. The ability to define the compression level and the large color palette make JPEG best for web use.

Selecting the Appropriate Format for SEO

After understanding the types of image formats, it is quite easy to pick the appropriate one for our purpose. JPEG is to be used for pictures and images with many colours, PNG for images with few colours or transparent images, and GIF only for animations. Now the problem lies in its implementation to our website. The first thing you need to consider is browser compatibility. Even though all the formats are widely accepted, there may be differences in legacy systems. GIF is the most widely supported of the three, so it is usually a safe bet. However, PNG is the newest of the three and its features are being rapidly improved in new browsers, so it may soon be the best choice for all-round use. The transparency support is also a big issue, as in the past the IE browser has not supported this feature in PNG images, although this will not be a problem for current and future users of IE 7. The next step is to think about the use of your image. For decorative images or photographs, the best option may be with JPEG. A high-quality JPEG can be very small in file size, and with the wide support of the format, this makes it the best option for most photographic images. If the image is a diagram of some sort, it would be best saved as a PNG image. This is because the image will be much clearer and in a smaller file size than if it were saved as a JPEG. This also applies to images such as logos and navigation buttons; these are often saved as GIF images but would be best saved as PNG. This method of choosing the best format for the image will help present the image in the best quality and size.

Compressing Images without Compromising Quality

GIF is good for line drawings, text, and iconic art with a limited palette. While compressing a .gif file, it will reduce image quality, but it has an option for animation with a relatively small file size. To reduce file size, GIF format also removes any hidden data or color that is not used. More colors in the pixel will just cause the color to default than PNG. It’s always a good idea to run your image through GIF format and compare its file size to that of the PNG file size. This example shows that PNG is not always the best format to use. Take note when compressing a .gif image, the reduction of file size can severely reduce image quality as its color palette is limited. Dithering can be used to minimize the effect. The PNG format is widely accepted and is the replacement for the GIF format. It is a lossless compression file format, which makes it good for image editing. PNG is good for images with text or graphics and also images with many colors. It’s known as the most widely used lossless image compression format on the Internet. The file size will be larger than a JPEG format with an image of the same dimensions, but you can set your PNG image to 8-bit color, which will greatly reduce the file size. Using a plugin such as PNGOUT will also greatly reduce the file size.

When it comes to squeezing your images without compromising quality to help your website run faster, you have three main options: the Graphics Interchange Format (GIF), Portable Network Graphics (PNG), and Joint Photographic Experts Group (JPEG) formats are all “lossy” and “lossless” image compression. The main difference between the formats is “lossy” and “lossless” compression.

Optimizing Image File Names and Alt Text

The final tip is the use of human interaction. In a study on Google Image Labeler, it was found that Google relies on human layman interpretation and association of images to search terms through crowdsourcing. Use of images that has a universally common interpretation will generate more visitors from different locations and diverse backgrounds, simply because the image is so easily related to the content in any language or culture. The use of an oversimplified image with many meanings may not be effective if the image has a large amount of varied search interpretations. This too will increase traffic of the image from search engines.

The ALT attribute is used in HTML and XHTML documents to specify the content of the image file. This is displayed when the cursor is placed over the image and is also used by text-only and screen reader browsers such as Lynx and JAWS. Writing good ALT text is writing a function and context for the image. This increases the usability and user-friendliness of the webpage. A common and recurring mistake is the replication of the file name or the use of a file name as the ALT tag. This is no progress from having no ALT attribute. As with file naming, ALT text should be descriptive and relevant to the image content. ALT text also has a useful function of improving search engine optimization of the image. Yahoo has published information on image optimization, mention is made that the combination of image file name + image ALT tag is more powerful than using one or the other. This is when the two should be very consistent with each other in content. ALT text can also be used to a large extent in the context of a bulleted list of links in a site map or other content linking pages within the website. This is where an excessive amount of text links and no real written content is deemed. An image will fill it with an image containing a link and simply the URL if the ALT text is left blank.

One of the easiest and most effective ways to optimize images and improve the search engine optimization (SEO) of a website is by altering the file names and adding alternative text. The file name should be descriptive and related to the content and what the image represents. For example, instead of a file being named “DSC0005.jpg,” if the image is of a red apple, the file name should be something like “red_apple.jpg”. The use of an underscore is also favored, as search engines do not recognize a space. This increases the searchability of the image and therefore the content on the webpage. This leads to an increase of visitors from the image results page. A file name “red_apple.jpg” can only be accessed from a search engine. This is due to the URL being a direct link to the image. This is very effective. It is important to consider the weight of an image. As more search engines provide an ‘image search’ function, it is still very important to keep the image under the maximum file size recommended for search engine optimization. This ensures that your image will rank well in regular website content in addition to ranking in image searches. It is important to be concise and selective with words with the file name and maintain relevance of content and file name.

Using Descriptive File Names

Step two involves using hyphens (-) instead of underscores (_) in your image file names. Search engines treat hyphens as a space, while they consider an underscore to be joining two words together. This means that “Rottweiler-dog.jpg” will be read as “Rottweiler dog” while the image named “Rottweiler_dog.jpg” will be read as “Rottweilerdog”. In terms of optimizing your images for search engines, you will gain much benefit by following the correct method and using hyphens in place of spaces. This is due to the fact that search queries containing more than one keyword provide more targeted results. By using hyphens in your image file names, you allow your images to be found by search queries that match the subject matter of your image, as opposed to simply being found in a broad search of a single keyword.

When trying to understand image optimization, a good place to start is on the file name. Many people will begin to upload images to their website from their digital camera or a similar device. A file name such as “DC00123.jpg” does nothing to contribute to your search engine optimization endeavors. A file name such as “childplayingfootball.jpg” is much more beneficial. Try to use filenames that best describe the subject matter of the photo or image. For example, if your photo is of a Rottweiler dog, a file name of “Rottweiler-dog.jpg” is a much better choice than an image with a generic name such as “dog2.jpg”. In this instance, a good file name is short, to the point and uses relevant keywords, all of which benefit the cause of search engine optimization.

Incorporating Relevant Keywords in File Names

File names play an important part in image SEO. Image file names inform Google and other search engines what the image is about. The way different images are ranked is through sorting and assessment. Your file name tells Google what the subject of the image is. Google then cross-references this with the content of the page to ensure the image is relevant. Using relevant keywords that you are targeting for your page is advisable when naming your image files. For instance, if you are trying to make an image as a link to a best practices SEO document, naming that image “seo_best_practices.jpg” instead of “image1.jpg” will give it a small relevance edge in comparison to the other pages of the document. This increases the chances of your image showing up on Google Image Search, which can lead to an increase of visitors from the image to the actual content.

Writing Informative and Keyword-rich Alt Text

Images should have their alt text and file name use keywords, so they’re able to rank in the search engines. Alt text is one of the most important factors in driving traffic to your website when using image SEO. It increases its keyword relevancy with the page’s content, and as such, the more relevant an image is to the content, the better it can contribute to the page’s rankings for specific keywords. It is important to write alt text that describes the image and is also contextually relevant to the page’s content. Simply loading keywords into the alt attribute to try and boost the page’s ranking is known as “keyword stuffing,” which is a negative behavior. Keyword stuffing is not a good practice to drive traffic to your website from search engines. It is best to ensure that both the file name and the alt text are relevant to the image and page content.

Image Size and Dimensions

Image size and dimensions are very important when considering the optimization of your images for your web page. There are several reasons for this. Large, high-resolution images can slow down your website’s load time. While search engines do not penalize slower websites in their rankings, the load time of a website is definitely a consideration in the ranking process. Slower websites also do not hold visitors as well. To keep your audience on your website, page load time should be low. Large images also use up more bandwidth when being downloaded from a website server. This is a consideration if your website is reaching a large number of visitors and is using budget web hosting. Using the appropriate image dimensions for the space in which the image will be used also goes a long way for saving load time and bandwidth. This can be shown with the following graphical example. High-resolution images are often larger than required, so their dimensions can be reduced without significantly affecting load time or image appearance. This will save bandwidth and reduce load time. Remember that it’s not always necessary to resize an image. If an image is being used for a thumbnail, it’s best to have a small version of the image saved rather than the large version being resized by a browser.

Resizing Images for Web Optimization

On the other hand, a low-quality image may have small dimensions and a tiny file size. This would load fast, but the poor image quality would also have a negative impact. We need to find a good balance between image quality and fast load times. A general rule of thumb is to use image dimensions that are no larger than the maximum size allowed for image search (1024×768 pixels) and to limit file size to 50 kilobytes.

The dimensions of an image define the width and height of an image, measured in pixels. File size, on the other hand, is the amount of space an image file takes up on your hard drive, measured in bytes. High-resolution images tend to have larger dimensions and file sizes. While they may look incredible in print, displaying these images on a webpage could significantly slow down load times. A slow-loading website can lead to a poor user experience and can negatively impact SEO.

When it comes to web optimization, size does matter. Resizing images to the correct dimensions is crucial to ensure image quality and fast page load times. There are two types of image “size” to consider: the dimension (width and height) and the size in bytes (file size). At first, they may sound like the same thing, but they are actually very different.

Finding the Optimal Image Dimensions for SEO

SEO will benefit from quicker loading pages and images, as download times are considered in search engine algorithms. If you know the maximum display dimensions of the image on your website, a very good way of reducing the file size is to scale the image to these dimensions before uploading to your site. For example, if the image will only ever be displayed at 500 x 500px, scaling the image to these dimensions can reduce the file size by up to 5 times in some cases. This means the image will take considerably less time to download and will be more beneficial to your SEO.

When trying to find the optimal image dimensions for SEO benefit, you should try and find a middle ground between file size and image display size. The current “best practice” for web image display is to use CSS to scale images to the required display dimensions. This method, however, does not affect the amount of time a large image takes to download – it simply displays the image at a smaller size. With mobile internet usage increasing, it is important to make sure your images are optimized for display on mobile devices.

Using Responsive Images for Mobile Optimization

In today’s world, the internet is no longer limited to our personal computer devices, with the boom of tablets and smartphone technology in recent years. Since Google’s reveal of mobile friendliness as a ranking signal, mobile optimization has been a hot topic in the SEO world. According to a study performed by Stone Temple Consulting, mobile devices now make up approximately 57% of all internet traffic. These numbers show a need for SEOs to shift their focus on optimizing content for both mobile and PC devices, and its importance grows as time goes on. This leads us to an SEO elephant in the room when it comes to image optimization. How do we create image content that is appealing and visible on high-resolution displays, but also small in file size and optimized for quick load times on low-end mobile devices? The answer may be simpler than you think, and actually lie in recent advancements in web development technology. We are going to show you how it’s possible to serve high-resolution image files to PC devices, while also displaying smaller optimized versions of those images on mobile devices; this is known as responsive images.

Latest article