Why Your Images Need to be Optimized for the Web

01/17/2023

One of the most important aspects of Google’s algorithm when showing websites is page loading speed. Users today won’t wait more than two seconds for a site to load before moving on to another if it’s not fast enough. So, if you want your site to show up higher in Google’s organic search results, you should prioritize making sure the images you add to your website are well-optimized.

Lossy Versus Lossless Image Compression

When creating or even saving images, the image size will be relatively larger, and larger image files inadvertently slow down your site. So, the best solution is to compress those image files. But there are two ways to compress data in relation to images: lossy and lossless compression. Lossy compression reduces some of the information in an image to reduce the file size while maintaining as much of the image quality as possible (Ex: JPEG image types). Lossless compression reduces the image file size without compromising the image’s overall quality (Ex: PNG image types).

When comparing the two image compression types, it might seem obvious to just use PNGs or lossless compressions, but it’s important to remember that PNGs are larger file sizes when compared to JPEGs. So, even if you compress all the images on your site to PNG images, you might still be slowing your site down more than you need to. While you may want to keep some of those images as PNG image types, you can, more than likely, reduce your image file sizes even further to speed up your site’s overall loading speeds.

How to Optimize Your Images for the Web

What Types of Image Files to Use

1. JPEG, or Joint Photographic Experts Group, image files are best used on images shot with a camera because JPEGs can combine some of those millions of colors by using lossy compression. While it reduces an image’s overall color palette, it’ll still produce an acceptable image for the web.


2. PNG, or Portable Network Graphics, image files are generally recommended for images that utilize a limited number of colors. PNGs are also great for images with transparent backgrounds, so they’re generally used for logo and icon images.


3. SVG, or Scalable Vector Graphics, image files, like the name suggests, allow developers to use vector-based images. SVG image files, unlike PNGs and JPEGs, won’t lose any clarity when resizing them. While this file type works great for images that don’t use a lot of colors, they’re generally just used site logos or backgrounds. We should also mention that some older browsers don’t support SVGs. But all the latest versions of major browsers have basic SVG support.


4. WebP, or Web Picture format, image files were created by Google in 2010 to provide superior lossless and lossy compression. They’re much smaller file sizes compared to the rest, but there’s one catch: Safari doesn’t fully support this file type, which means some iPhone users may not be able to view them.

For more informational videos, check out our "What Is" series on our YouTube channel.

Pacific Software Publishing, Inc. 1404 140th Place N.E., Bellevue, WA 98007

PSPINC Creates Tools For Your Business

Pacific Software Publishing, Inc. is headquartered in Bellevue, Washington and provides domain, web, and email hosting to more than 40,000 companies of all sizes around the world. We design and develop our own software and are committed to helping businesses of all sizes grow and thrive online. For more information you can contact us at 800-232-3989, by email at info@pspinc.com or visit us online at https://www.pspinc.com.