Image optimisation

This top image shows the image after the optimisation this was achieved by changing the dimensions of of the image which drastically changed the KBs of the image 

I did this to reduce image size so that it would be easier for the website to load the images and that is the reason for optimising them as it helps the site load a lot quicker.


The reason we do this is to reduce the stress on the clients server as if the images aren't optimized they could make the serever slower meaning and overall slow website and the reason we do this for the end user is because it will reduce the load time if there internet connection is slow and make it easier for them to access the site.


This image shows the PNG before 


to make this image have a smaller size i reduced the width and hight and because of this is made the image a smaller size and the reason i did this is so that when a user visits the site they won't need a good internet connection to load the images making the image smaller reduces the size but not the quality.




Although the image was already a small size I further reduced it so it would get smaller and this is beneficial so that the image won't make the site slow down, although to make this effective I would have to optimise all images on the site. because I have optimised the images it will compel more users to stay on the site because they can access it with a very weak internet connection as the images are only a few hundred in KB in size on average.


The way I reduced the image size of this image is by making it black and white by using the grayscale feature in the image settings and this dramatically reduced the image size from 152kb to only 80kb
by adding greyscale it make the size smaller this is because images with colours are lot bigger due to their complexities.

I made the image smaller to reduce the file size this is beneficial to the website as it makes easier to load the image 
I had to make the image a lot smaller for this image as it is a very big and detailed image so I made it smaller by making the width 900px from 1600px this also kept the detail of the image.


Comments