How do you optimize images in WordPress?
Bought a great theme, loaded up the site with all the fancy images… but.. it takes forever for images on your site to load on all those slow mobile devices and lossy internet connection.
I can see your pain!
Well, if you are on WordPress, then worry not, there are a ton of plugins to help you out. Smush it is doing a great job. Install it, and it takes care of all the image compression stuff. So, there you go..
But, hey… wait, don’t you want to know the root of all evil?
The answer is pretty straight forward… Bring the right tool for the job!
Don’t use hammer to bash in the screws.. that is what screwdriver is for. In your case, you need to use a proper image format for your content.
You might have noticed images in jpeg, png, or gif format… and if you know the difference, then go ahead and skip the article.
Still here? Let me explain the difference and usage with examples
You might have a good internet connection, but there is a strong chance that your viewer, who is sitting in the far corner of the world has a poor internet connection.. maybe a broken device as well, who knows.. and it takes forever for him to load your info-graphic or any other image that he visited your site for..
Your goal, is to provide your user the image, as soon as possible and as complete as possible without the loss of any important data.
I am giving you short rule for image formats
- Use JPEG/JPG, if there is no transparency in the image and you don’t care about the quality of the image. Some examples could be: Photography for web transfer, Memes
- Use PNG, if you need to preserve the quality of the image, and if you have transparency in your image. Example usage could be: Logo, High quality product photos, game graphics
- Use Gif, if you need to show some short animation. Examples could be: Product explanation animation, Meme animation etc.
For advanced users, there is another image format:
WebP. Famously used by Facebook to serve all those great images in really fast time. It has a caveat though. It is not yet supported on Safari browsers and it takes a bit of an effort to convert your normal images to webp format.