Today I will go over the few steps needed to optimize your images for the web. This will be done in 3 steps, using free online tools. Images must be optimized before being uploaded to your website. This improves the performance of your website, the loading times, bandwidth usage. Basically, search engines love you more, and users don’t have to wait a while your 100MB gallery loads.
Resizing images
Most images taken by photographers or bought online these days come in quite a large size. Usually with widths going over 4000px. That’s by far way too much for most website uses. Here is what we recommend based on where you’re using the images:
1- Using images in the header of a page: if the purpose of the image is to cover the page from left to right, we usually recommend a width of 1920 px. Height would really depend on the proportions of the image being used and most picture resizing tools will keep these proportions. You can also crop the images to the desired view.
2- Using images in a gallery: Galleries are a nice way of presenting a group of pictures for an event, a portfolio and much more. We usually suggest an image size of 800 px. That way when the image is opened in a lightbox, it covers a good proportion of the screen.
3- Using images in an online store: product pictures are usually 600px x 600px. Some of the more recent stores have been using image sizes of 1000px x 1000px
Free picture resizing online tool
There are plenty of free online tools on the web. Here is one we’ve gotten good feedback about. PicResize is a simple online tool that allows you to crop, resize and add some effects to your images. Here is a YouTube tutorial on how to use it.
[embedyt] https://www.youtube.com/watch?v=Wg6vkGuQBO8[/embedyt]
Optimizing image file size (compress)
Here we have 2 free online tools that are highly recommended by the community, that will reduce the file size of your images. Tinypng if you are looking to compress .png files and Tinyjpg for jpg files. This step is fairly simple, so we will just jump right into the video tutorial.
[embedyt] https://www.youtube.com/watch?v=ReFbSvkTtBo[/embedyt]
Once you go through these steps to optimize your images, we have a plugin on our sites that will do the final round of optimizing the images.
I hope this article was helpful to you.
