When it comes to having a fast loading website, optimising your images before uploading them to the site makes a huge difference.
Most newbie bloggers and web owners tend to simply upload their image files onto their website without noticing how big they actually are in file size. As a result, it makes their website load slower...and we all know that a slow site means you'll be unpopular with Google and your site visitors.
So what is image optimisation?
It is the process of making your files smaller without reducing the overall image quality. It might sound technical and laborious, but it's actually a simple process.
To fix this dilemma, we've created a step-by-step process to optimise your images for web without losing quality and detail. Here is our non-negotiable "rule" that we use here in Design Diva!
Step 1. Image dimensions:
Before anything else, you need to take note of the image dimensions you should be using. Take a look at our notes below:
- For banner or header images approx 1500px wide is plenty but if you want to take Retina displays into account, go for 2560px.
- For large images (similar width to a full line of text on website), and images you want to show off in a lightbox view, the image size should be 800px wide.
- For smaller blog post images, image size should be a maximum of 500px on the wide side.
- For images with a transparent background, you'll need to use the .png file format.
- For general photos and graphics, use the .jpg file format.
Step 2. Image file size:
The next step is the optimisation... and to make it the easiest way possible, we use some FREE online tools...
- Images need to be optimised for web - we use www.tinypng.com or www.tinyjpg.com
- After adjusting the dimensions as described above, simply drag your images onto the tinyjpg or tinypng webpage
- Download the optimised images once processed
- Compare the quality of downloaded images - they should look no different!
- If the quality does look diminished try www.shortpixel.com/online-image-compression as an option...we love this one as well!
Step 3. Optimise for Web:
- Be SEO-friendly!
- Images need a relevant descriptive file name for search engine optimisation. You'd be surprised how many people may find your site through an image search!
Step 4. Upload to your website!
- For extra SEO juice, once uploaded, add alt-text and description to your images.
- Also...while you're there...why not do an image audit!..remove unused and duplicate images, and replace all images that have not been previously optimised.
This whole process may sound like a chore....but it is necessary....and it actually just takes a few minutes once you make a habit of the process.
Now that you've optimised your images for web, expect these incredible results!
- Faster loading speed
- Improved SEO performance
- Reduced cost of website backup storage
- More web visitors thanks to better organic reach
Grab the PDF here for easy reference (instant download)
Do you know if your website images are optimised or not? Let's book your FREE web health check today!
How's Your Website Looking?
Old?...broken?...hacked?...Don't know where to start?
Book a Free Website Health Check
Don't have a website yet? Book a Strategy Call!