How to optimise images for web
September 5, 2021
When it comes to your website, images are more than just decoration — they play a vital role in user experience and search engine optimisation (SEO). Properly optimising your images helps your site load faster, improves your SEO, and makes your content easier for visitors (and Google) to understand.
Why Images Matter for Your Website and SEO
Images make your content more engaging and break up large blocks of text, making your website easier to read. They can also help explain concepts, showcase products, or provide evidence (like photos from a project or event).
Whether you’re showing a product, demonstrating a process, or adding visual appeal, images make your site more engaging and easier to understand. Search engines also use images to help determine what your page is about, so properly optimising them can help improve your website’s visibility.
Optimising your images for web
1. Choose the Right Image Format
There are several common image file types, each suited for different purposes:
- JPEG: Great for photos and detailed images. Offers good quality with smaller file sizes.
- PNG: Ideal for images with transparent backgrounds (like logos), though file sizes tend to be larger.
- WebP: A modern format that offers high quality with smaller file sizes, making it a great all-round option if your website supports it.
- SVG: Best for simple graphics, logos, and icons that need to scale without losing quality.
- AVIF (AV1 Image File): Achieves a better compression quality than WebP.
Pro Tip: Avoid using GIFs unless absolutely necessary, as they are large files that can slow down your website.
2. Give Images Meaningful File Names
Don’t upload images with names like “IMG12345.jpg.” Instead, use clear, descriptive names such as “chocolate-cake.jpg.” This helps search engines understand your content and improves your chances of appearing in image search results.
3. Resize Images to the Correct Dimensions
Uploading huge images and relying on your website to resize them slows down your page. Resize images to the actual size you need before uploading them.
Example: If your website displays images at 800×600 pixels, there’s no need to upload a 4000×3000 pixel image.
For WordPress users, WordPress automatically creates smaller versions of images, but it’s still good practice to resize before uploading.
4. Compress Images to Reduce File Size
Compression reduces the file size without noticeable quality loss. This helps your pages load faster, which is important for both user experience and SEO.
Tools like TinyPNG, ImageOptim, JPEGmini, and Kraken.io can compress your images before you upload them. If you use WordPress, plugins like Smush can automatically compress images after uploading.
5. Add Helpful Captions (Where Appropriate)
Captions can help visitors quickly understand the context of an image. They’re not necessary for every image (like logos or background images), but they can enhance the user experience and support your content.
6. Use Alt Text for Every Image
Alt text (alternative text) describes the image for search engines and visitors who may be using screen readers. This is important for accessibility and SEO.
When writing alt text:
- Be descriptive and clear.
- Use relevant keywords naturally (but don’t stuff them).
- Keep it short and relevant.
In WordPress, you can add alt text directly when uploading or editing images.
7. Skip Title Text (In Most Cases)
Title text is the small tooltip that appears when you hover over an image. It’s not reliable for accessibility, and search engines mostly ignore it. Focus on alt text instead.
8. Consider Using a CDN (Content Delivery Network)
A CDN stores copies of your website’s files (including images) on servers around the world, delivering them from the server closest to your visitor. This can significantly speed up page load times, especially for visitors far from your main server.
Many website hosts offer built-in CDN services, so check with your hosting provider before purchasing a separate CDN service.
Final Thoughts
Well-optimised images improve your website’s speed, SEO, and user experience. By choosing the right file format, resizing and compressing your images, and adding meaningful file names and alt text, you’ll make your website faster, more accessible, and easier for search engines to understand.
Taking the time to do it right means better rankings, happier visitors, and a website that performs at its best.