If you’re adding images to your website, you might think you can put any picture on there and it will fit perfectly. That’s not always the case, though. Chances are, the photo you’re posting is a large image, thus a large file.
Posting a large file like that can cause problems for your website when it comes to how fast it loads. It might not seem like posting an image that is 1MB or higher would cause an issue. This can make your site difficult to load. You might have fast internet so it’s not an issue for you.
But what about your customers? How do you know what internet they use? More importantly, how do you know they’re not looking at your website on their phone?
The average website on a desktop takes 2.5 seconds to load, but on a mobile device, it takes 8.6 seconds. The optimal time for your website to load, regardless of device, is no more than four seconds. If it takes longer than that, images could be one of those issues. If you have large images on your site, then you should consider scaling them.
Resizing Your Images
The easiest way to resize your images is to do it on your own. Thankfully, there are a lot of tools you can use that can help with that.
One of the best tools is Adobe’s Photoshop. You can load your photo in Photoshop, click on Image at the top, and click on Image Size.
When resizing your image, you need to think of it like dimensions, or pixels. What should you resize it to? It depends on the use of the image.
Whether you’re setting it as a background image, a blog image, or a logo, you have options.
- A background image should be set at 1920 x 1080 pixels
- A hero image (a front page photo or graphic seen at the top of the page) should be set at 1280 x 720 pixels.
- A blog image should be 1200 x 630 pixels
- A logo should be 250 x 100 (rectangle) or 100 x 100 (square)
Changing the File Type
If you’re using a JPEG file or even one that is TIFF or BMP, then you’re going to have slow-loading images. That’s where you need to think about converting your image file to a format like WebP.
A WebP image is better compressed compared to a JPEG one. It’s a smaller file, but you won’t lose quality in the image. One study found that the WebP image file size can be as much as 34% smaller than a JPEG one. Save space on your server by converting the image to a smaller type of file.
Alternatives to Photoshop
Not everyone has access to Photoshop or even wants to pay for Photoshop. The good news is there are some good alternatives.
- The GNU Image Manipulator Program (GIMP) is a free and open-source image and graphics editor. It works as well as Photoshop and there is no shortage of tutorials to help you use it. GIMP makes it easy to resize your images.
- You don’t need to download software to resize your images for the web either. Depending on your OS system, you should have a good option regardless. If you’re using Windows, you can use MS Paint to resize your images.
- Meanwhile, if you’re using a Mac, you can resize your image using Preview. Both options are simple to use.
- There are also online options that you can consider. For example, Adobe offers a free Photo Resizer on their website. All you need to do is upload your JPG or PNG image, type in the dimensions or scale your image by a percentage, and then save the photo.
- Another tool you can use to resize your images is Canva. If you use it online, you can crop and resize the image.
Should I use my CMS to resize my image?
The short answer to that question is no. It’s better if you resize your images before you upload it, even on WordPress. Large images can take up a lot of space on your server. That can be a pain for your user and a pain for you. Server space does come at a premium. Why pay for extra storage when you don’t have it?
Contact Webster If You Need Help With Optimizing Your Website’s Images
If you need to improve the speed of your website, then reach out to Webster Digital Marketing today.
