Optimizing your images

Images are powerful media that many of us use on websites, social media or anywhere around the internet. Especially when it comes to selling online, images have such a big effect on the impression to the outside audience and influence the decision whether to buy or not immensely. So, have you ever wondered if you are doing the best you can to get the maximum effect out of images? Here are a few simple tricks how to optimize your images to get the most out of them.

Images can have such a big influence on the world in the web. Let's work together to get the most out of it for your benefits!

Images can have such a big influence on the world in the web. Let's work together to get the most out of it for your benefits!

Naming images and using alt tags

Whenever you use an image such as for a product or webpage, make sure that you give the image a name that has a logic sense. Avoid foreign letters and symbols in the name, as well as keep the names very simple. We recommend to use the English language for a name and use a minus (-) as a space between words. When your webpage or online store is being ranked in search engines, your images are crawled as well. In this way, you can place keywords in your image's name and add additional content that affects your rankings. 

After optimizing the name of your images, make sure to use alt tags for all of them, too. An alt tag is an HTML attribute of the img tag and is displayed, if your image cannot be rendered by a browser. However, even if your image is correctly shown, these alt tags are crawled by search engines and are another way to place keywords of yours and give a detailed description of the image you are using. You can read more about the alt tag on w3schools. There is also a great article on Google how to use alt tags for your images.

Following these simple tips, be aware not to overdo it. Don't overload your image names and alt tags with a huge amount of keywords. Use them wisely and place them correctly to corresponding images. Also, try not to duplicate your alt tags. If you are showing a product from different angles on different images, add the angle to the images such as using the words front or back.

Using image types

Nowadays, there are several image types to use such as JPG, PNG, GIF or TIFF. We just want to give you a short overview of the differences and which type to use for what.

JPG is one of the most common image type. It is used widely in the internet and the best choice for any photos you want to use on your website or online shop. They show a good quality, even if the image is compressed to a small file size.

PNG's biggest advantage is that it can handle transparency. This is very useful for graphics such as logos or anything else that needs a transparent background. The file size of a PNG is higher for a same-sized image compared to a JPG, but they show a better quality as well. PNG also uses a wider color spectrum, which can be a reason for showing the same image in different colors as a JPG and PNG. This is often the case with images that have been edited.

TIFF is a great format to work on graphics and share across for editing because of their great quality. They are not popular to use on webpages though because of having a big file size, which can lead to a slow loading. GIF on the other hand, has a very small file size and only uses a small color spectrum. It is a great format for black and white icons, buttons or tables.

Image loading and performance

When going through your images, pay attention to how much time they take to be fully loaded on the page. If it takes more than only a few seconds and you start getting nervous, imagine how someone would feel like that is not familiar with your service or products. You can optimize these images by decreasing their size, but the quality of the image should not be compromised too low and show a poor resolution. Another step would be to check, whether this image is a candidate to change the image type to a more appropriate one.

When showing product thumbnails in your online shop, see how long it takes until all of them are loaded on one page. If they take up too much time, a great way to improve your performance is to lower the amount of products on one page and split them up into more pages. For example, if you are showing 20 products on one page, the decreasing of 12 products per page can already improve your site's performance by lowering the loading time of the shown product images.

We hope that we could already help you out with these few simple tricks and feel free to contact us for any more questions or information on this or any other topics!