Running a successful website in this century involves collaborating with different kinds of professionals.
You have to source your graphics from a designer and send it to a developer and then there are content writers and editors. It is very easy to get lost in the tangled mess.
A very common problem is one that occurs when you source your website graphic from a graphic designer.
Graphic content can be very easily scaled down without loss of quality, but going the other way is often impossible. So graphic designers almost always send their work in the highest resolution possible. As they should.
Now the editor is given this image and since he wants the best quality image on his website, he uses the highest quality available to him. Also, scaling down manually needs a level of tech know how and time.
The website looks all good.
However, with high quality comes a high file size. The end user who is browsing on his mobile device on a cellular data connection is not going to appreciate the time it takes to open a website with all the high quality images.
In my opinion, it is the job of the developer to set up the website anticipating these scenarios.
You cannot expect the author / editor to resize and optimize every image he/she uploads. That’s a lot of work and takes away the joy of writing.
After all, it’s a one time job for the developer.
A website that got thrown into my hands recently, KidsLife.es, was a victim of the above mentioned problem.
Images were too huge and a lot of them were scaled down using CSS. The website took a whooping 56 seconds to fully load!
Action
Most of the optimization process revolved around images.
- I scaled images wherever necessary.
- Compressed huge images into smaller ones without any noticeable change in image quality.
- Also installed necessary plugins to make sure that all images uploaded in the future would be automatically compressed.
- Made some changes to the HTML structure that resulted in a better user experience especially on slower connections.
Results
Here is a brief summary of what I was able to achieve. For a detailed report, please refer to the GTmetrix report that follows.
- Fully loaded time came down to 3.9 seconds from the original 55.9 seconds. This was massive.
- As a result of compressing and scaling down images, total page size came down to 2.99 MB from 8.53 MB when I started.
- PageSpeed grade and YSlow grade improved to acceptable levels.
Before And After
Here is the side by side comparison of the GTmetrix report before optimization and after.
Want Similar Results For Your Website?
You might be leaving money on the table because of a slow website. People are more impatient than ever, especially on mobile devices and a slow website is a death sentence for any online business.
If you have a slow website and you want me to take a look, please get in touch. I will evaluate and let you know what needs to be done and how much it will cost you. You pay only AFTER you see results.
For most websites this wouldn’t take more than a couple of hours and I will be setting up tools that will help your website run efficiently.
Leave a Reply