In our last blog we talked about 4 reasons why image optimisation for web is so important. This time we’re diving straight into the how. Let’s get started!

1. Choosing the right file type

When considering image optimisation for web there are three different file types you’re likely to come across: JPG, PNG and GIF. Each of these file types will have better applications in specific situations so it’s important to know their strengths and weaknesses.

JPGs

JPGs (or JPEGs) are the old faithful when it comes to images for web. They’re the go to file type for photographs, product images, hero and homepage banners. When optimising JPG images for web, you can save them as low quality through to high quality. This means you have a greater level of flexibility to find the perfect balance between file size and quality of the image.

PNGs

Another popular file format, PNGs have a much more limited colour palette than JPGs. This means they’re not the best option when it comes to photographs and complex images. Where they do shine is in the way they handle transparency. Because of this, PNGs are often used for logos.

GIFs

Similarly to PNG, GIFs have a limited colour range and they also aren’t the highest quality so their use is quite limited. What they are good for is animation.

2. Always reduce the size of your files

One vital factor in image optimisation for web is file size. This is because the size of your images can have such a huge impact on your website speed—and website speed directly affects your revenue. Research found that if Amazon’s site loaded one second slower, they would risk losing $1.6 billion in sales. We can’t underplay the importance of a fast website.

There are a few ways you can reduce the size of your files to ensure the best image optimisation for web. One is by selecting ‘save for web’ within Adobe Photoshop. If you’re not a photoshop whizz, there are a number of free tools available to help you such as Canva, PicMonkey and PIXLR. Better yet, just send your images through to us and we’ll handle it all for you!
[elementor-template id=”4456″]

3. Don’t forget to optimise your thumbnail images for web

Thumbnails are often the silent killer—they’re so tiny, you don’t think they would make much difference but they do. Make your thumbnail images as small as possible and don’t be afraid to compromise quality a little here.

4. Name your images

Another important point in image optimisation for web is naming your images. While it might be more efficient to load your images in with the file name set by your camera, this isn’t going to help you in the long run. Not only can it become difficult to find your image if it’s lost in a long list of IMAGE01.jpg type file names but naming your images can actually help with SEO. Using relevant keywords will help your images show up in a Google search and since this links through to your website, it increases your chances of getting more traffic.

5. Alt attribute is important

Some people say that alt attribution is the number one priority when it comes to image optimisation for web. This is the words that show up if a browser can’t render an image properly and it adds to your SEO value. So carefully choose the words for your alt attribution.