Image File Sizes For Website Explained

Image File Sizes For Website Explained

The best websites are the ones that include lots of eye-catching graphics, beautiful pictures, and useful infographics. A picture is worth a thousand words; therefore, you want to make sure that you’re including lots of images on your site. But if you have too many images, you may notice that your site is slow to load. This is often because your Image File Sizes are too large and after hundreds of images, it’s slowing down your website.

NEXTFLY wants you to have a beautiful website without worrying about your load times. Loading times can affect your SEO, as well as your customer engagement. Think about the last time you were on a website that took too long to load. You probably didn’t stay on it too long, you went to find a website you did not have to wait for. It’s time to make sure that isn’t happening to your website too! Contact NEXTFLY to learn more about optimizing your website to improve performance.

The Downside of Better Quality Images

Most smartphones these days take incredible pictures. They’re much sharper and clearer than they used to be. Or maybe your business hired a professional photographer to take pictures for your site. The images you get back are going to be very high-quality, which means large file sizes. You want these images to bring your site to life, but if they’re slowing down your load times to the point where visitors can’t see them, then you’ve wasted your money.

Professional pictures and even smartphone pictures leave a very large digital footprint. Remember when your phone would run out of space? You knew the best way to make more space was to delete some old pictures off of your phone. The same is true for your website. Image File Sizes are usually very big and can take up the server space that your website relies on to run. If you are replacing lots of images on your website, it’s good practice to purge the old ones to keep your site running quickly.

Take Smaller Bytes

File sizes are measured in bytes. A byte is the smallest increment of data on a computer. A Kilobyte (KB) is 1,024 bytes. Computers measure data in binary, base 2, instead of a decimal base system like base 10. So bytes don’t quite line up with the metric system, but it’s not far off.

Computer storage and memory is often measured in megabytes. A megabyte (MB) is 1,024KB or 1,048,576 bytes (1,024 x 1,024). A gigabyte is 1,024 MB or 1,073,741,824 bytes (1,024 x 1,024 x 1,024). You can see how this adds up pretty quickly.

So when your Image File Sizes are thousands of megabytes large of data, you’re in trouble. For example, at NEXTFLY, if you sign up for hosting, our most basic type of website, you’ll be guaranteed at least 250 MB of space. So if you have 10 pictures that are 5 MB each, that’s 50MB/250MB taken up right away. And you probably want more than 10 pictures, plus any additional plugins and functions your website needs will require space as well.

Now if you could get these pictures smaller than an MB, they would take up a lot less space and you still have space for all your functions to run properly. When uploading images, aim for images around 500KB in size.

Use Compression Tools To Help With Your Image File Sizes

How can you have large images on your website without slowing it down? The answer is compression. Compression shrinks your file sizes without sacrificing quality, depending on how much you compress the image.

Many devices automatically compress images. For example, when you text a picture or upload pictures from Facebook, they are compressed in some way so that you’re not eating all the data on Facebook’s servers. Let’s see a real example of compression.

Here is a picture I took of my dog with my smartphone. It is 4.1MB. It is a high-quality picture, you can see a lot of details and all of my dog’s freckles. But how can we compress our images ourselves? Well first, what are the dimensions of your image? Smartphones tend to create large image files. This picture of my dog is 3024 px  tall × 4032px wide.

The Image File Size is: 4.1MB
Original 4.1MB picture
This Image File Has been compressed to 434KB
Compressed 434KB Picture

Now I love my dog, but I don’t need a picture of her this big for my website. Even banners only need to be uploaded at approximately 1920 px tall. When your image is uploaded to WordPress, it will be compressed to the size that best fits your site. So I’m going to open up this image in Photoshop (or a free image editing software like Canva) and make it smaller. I shrunk it down and cropped it to 1734 x 2311px and that alone is going to do wonders for my Image File Sizes.

After I make my image smaller, I’m going to compress the image using ImageOptim. Image Optim is one of the many free online compression tools you can find. Image Alpha is also great for .png images. This image is a jpeg so I’m just going to use ImageOptim to compress the file.

Now, after resizing and compression, the picture of my dog is 434KB. Let’s do some math. We went from a 4.1MB file (or 4,126,838 bytes) to a 434KB file (or 431,352 bytes), a difference of 3,695,486 Byes or 3.5MB. See if you can tell the difference?

Contact Nextfly To Help Make Your Site Run Efficiently

Want to showcase lots of images on your site without sacrificing your website space? Contact NEXTFLY today to learn about how to make your site run faster and look better! We’ve got the Image File Sizes solutions that will keep your site looking amazing.

Ready To Get Started?

What services are you interested in?(Required)