×
Can you tell us why did you rate it this way?
×
Successfully send feedback Your feedback was submitted! Thank you!

Optimize Your Images to Make Your Website Load Faster!

There are a number of reasons why it’s important to optimize the images embedded in your website. First and foremost is user experience as nobody likes a slow loading website! Google has crunched the data on website loading times and user experience and has added this to their many ranking factors. Google wants a good experience for their users, and that means fast loading websites.

Although there are a lot of things you can do to speed up your website, generally, the main culprit are the images used on your website that is causing it to load slow. Running a website design company, I see websites embedding images 1 mb+ in file size all the time. Depending on the style and layout of your website, an image 250kb or less in size should suffice for most scenarios, even full page photos! The smaller the better.

What!? The smaller the better? Well, there is a caveat. The more you compress an image or reduce its quality in order to save on file size, the fuzzier and more unusable it will become. You’ll need to use your own personal judgement to decide just how much of a quality reduction you’re okay with. For example, if you’re a photographer highlighting your work in your portfolio, you probably don’t want low quality images.

Just to make sure you understand file sizes:
1,000KB = 1MB
1,000MB = 1GB

To put this into perspective for you, a photo taken with your smartphone could easily range in file sizes from 100KB to 10MB. That’s one photo!

To view how large an image file is on a Windows machine, follow these steps:

  1. Right click on the image
  2. Click on “Properties” in the menu that opens
  3. Observe “Size” or “Size on disk” to get your file size
view how large an image file is on a Windows machine

Another thing you’ll need to take into account is the actual dimensions of the image as this will drastically affect the file size itself. Whether you’re designing a website, adding photos to a portfolio, or just embedding a photo in an article, you’ll want to be mindful of common computer screen resolutions as well as the HTML code or framework you are working with.

Here are few scenarios with a bit of input:

Scenario 1: You’re creating a portfolio to highlight your photography. You may decide you want a popup when someone clicks on an image to show a higher resolution version. In this case, you’re going to want research common computer screen resolutions and be sure not to go too big, but big enough to accommodate users with above average screen sizes. There are other things you’d probably want to do as well, such as utilizing a Content Delivery Network (CDN) to speed up load times.

Scenario 2: You’re embedding a photo within an article. In this case, you’d most likely start by examining the code or DIVs that the content is in, and then setting the image size to stay within the DIV you are working with. In most scenarios, an image embedded within an article would be no wider than 1,000 pixels and probably more realistic, around 600 pixels in width or less.

To view dimensions on a Windows machine, follow these steps:

  1. Right click on the image
  2. Click on “Properties” in the menu that opens
  3. Click on the “Details” tab in the window
  4. Observe “Dimensions” of the image.
view image dimensions on a Windows machine

In short, to optimize an image, we want to reduce its dimensions to the smallest that suites our needs by scaling and/or cropping. Then we want to save it as a JPG and reduce its quality to a level that we feel is acceptable.

So now that we understand the size an image should be on disk, you’re going to want to run some tests on your website in order to find the images that were not optimized correctly optimized during the design and build.

Watch this video on finding large files on your website and optimizing them using the Image Compressor by SimpleImageResizer.com.


Author:
Nathaniel Seeley
BlueSoft
602-888-9218

Start using Image Compressor

FAQ: Frequently Asked Questions

Why convert image format / type at all?

Because you can pick the format that is right for the content, medium or platform where you use the images. For example, JPG images are generally better at storing digital photography than PNG. But PNG is better at storing vector graphics. WEBP is better for storing photos online.

Why convert image to PDF?

Sometimes you might want to print the documents, and your printer might work better with PDF files than images. That is especially useful when you deal with files containing vector graphics.

Why convert images to WEBP?

Website speed is an important factor when it comes to positioning of your website on the top of the search results. That’s why it is a good idea to use WEBP image format to store your photos for SEO sake. Such images have small file size but retain good quality when converted in comparison to PNG or JPG. And as a plus Google developed the format, which is why it looks favourably at websites that use it!

Why convert HEIC to other image formats (like JPG or PNG)?

HEIC is a great image for storing photos taken by iPhone, because it allows the photos to retain the “Live Photo” feature. But this is not the best format for exporting photos, especially to Android or Windows. That’s why it’s good to convert HEIC to JPG or PNG before sending them to mail or uploading them on a website.

How to convert PNG to JPG or JPG to PNG?

That’s actually quite simple using Simple Image Resizer | Image Converter. That’s because you just need to upload the photo in either JPG or PNG, select the output format and let the tool do it’s job. After that, all you need to do is click download now!

How to convert images on Mac or iOS?

Our tool let’s you convert images or photos on any platform (Mac, iOS, Windows, Android, Chromebook etc.). Just open Simple Image Resizer | Image Converter on your device and upload the photos you want to convert!

How to convert images to jpg on mobile?

It’s very simple, just open Image Converter on your mobile device and upload the images in whatever format you want. Then just select the format for output (JPG) and download the images.

How to convert HEIC to JPG or PNG on Windows PC, Mac, iOS or Android?

Simple Image Resizer | Image Converter Let’s you convert HEIC to either JPG or PNG. Just open the website on your desktop or mobile device, upload the HEIC file and select the output format. After our image converter finishes the job, you can download the image!

How to convert / change format from WEBP to JPG?

It’s quite simple, all you have to do is upload the WEBP file to our Image Converter and select the output file as JPG. Then wait for the conversion to happen and download the file!

How to convert TIFF to JPG?

It’s quite simple, all you have to do is upload the TIFF file to our Image Converter and select the output file as JPG. Then wait for the conversion to happen and download the file!