Why Web Developers Tend to Ruin Your Great Headshot

The Light Committee - Favicon

By The Light Committee

If you manage a website yourself or work with a web developer, you probably understand, or soon will, the importance of optimizing image sizes. For search engine optimization (SEO), it can be a critical factor to getting your website to rank better. This is because large images slow down website performance and supposedly, Google will penalize your rankings for it. But over-optimization can ruin images, which isn’t good for headshots or image quality in general.

woman doctor headshot pasadena ca
This headshot is much larger than most sizes you’ll see on the average website. Did it slow down the page load for you?

If you work with a web developer, they seemingly fall on the side of optimizing images to the point of degrading quality. But some people pay hundreds of dollars for their high quality headshots only to have a web developer remove the high quality. It doesn’t have to be this way.

More on Why Web Developers Compress Your Headshot

If we’re being honest, if it were not for SEO, web developers or SEO managers probably would not take the time to compress images on your website. In this case, we’re specifically focused on headshots. Your headshot can be a large file of several MB. This is because your photographer probably wants to give you the highest quality file. But to your web developer or SEO manager, quality be damned because it’s about page load speed instead.

The faster they can get your web page to load, the more likely it is to rank higher. But there are at least a couple of faults with this. First, the page that has your headshots on it is not likely as mission critical as other pages like your home page, products or services pages, your contact page, and others. These pages get way more visitors and are much bigger influencers on your overall website ranking.

In addition, how long someone spends on your web page is a rank factor too. If you have low quality headshots, people will spend less time than if you had great quality headshots. Good images demand an eye’s attention. If a page is supposed to be about the images, then the images should shine. So, if you have a page where you showcase headshots of team members, that is probably not where you want to over-optimize image compression. Instead, optimize more on pages visitors are likely to land on first.

Besides, there is a capability known as lazy loading. This is where images not shown on the screen do not load until a viewer requests them by scrolling to them. This capability is supposed to help the speed of your website by only using resources that the viewer is seeing at the moment.

examples of what image compression for SEO can do to a headshot
A more compressed version of the above headshot – from around 122 KB to 98 KB. Can you tell a difference in quality?
examples of what image compression for SEO can do to a headshot
Sized at 400x500 pixels, even this headshot is larger than most web developers will post. But at 55 KB in size, it is a smaller file size and yet far better quality than most headshots I see get posted by web developers.

Why Over-Compressing Can and Should Be Avoided

The first reason over-compressing should be avoided is because people pay good money to get the best headshot. Headshots are important as they are proven to subconsciously influence a person into doing business with you. This includes the level of quality in a headshot and not just whether you’re smiling or not. Headshots are an important marketing tool too. A headshot is not where you over-compress, just as you don’t want to with product images.

Besides, it is not really critical to compress an image to the point of degrading quality. It will not shape performance ranking that much more and there are free tools to test and ensure web page performance so you don’t over-do it.

We already mentioned lazy loading capabilities as a method to avoid the need to over-compress. Caching can also be used, especially if you have national or international reach. There are website caching services so images can be served to someone local to them instead of from wherever your host is.

Here is an example. Let’s say your web host is in Los Angeles and your website sits on a server there. But you have potential customers in Chicago, New York, and London. So, in theory when people in these far away cities try to access your website, they will load more slowly the farther away it is. With a caching service, they have servers locally in Chicago, New York, London, and more. They store a recent copy of your website here so people in these locations don’t have to fetch your site all the way from Los Angeles. This includes the images on your site. So, instead of over-compressing, consider a caching service.

Examples of What Over-Compressing an Image Can Do

Here are examples of image compressions.

examples of what image compression for SEO can do to a headshot
This headshot is 400x400 pixels and compressed to be 60 KB, a very reasonable file size, especially for a headshot.
examples of what image compression for SEO can do to a headshot
Same size but more compression so the file size is now around 43 KB. Can you tell if quality has degraded?
examples of what image compression for SEO can do to a headshot
And now more compression, to 30 KB. Look carefully and you can start to tell it is degraded.
examples of what image compression for SEO can do to a headshot
Often, images compressed by caching services or plugins, or by web developers, can start to look blurry, like this 25 KB image of the same dimensions.
examples of what image compression for SEO can do to a headshot
This last one is compressed to just 8 KB in size but it is paying for it. Compare the quality to the first one and you’ll see it doesn’t stand up to it. This is unnecessary when 60 KB is perfectly reasonable, even with 10 or 20 headshots on a page (with best practices like lazy loading).

Assuming you are on a decent Internet connection and not on an LTE phone in the Himalayas, did any of the above images load any more slowly than another? So, why sacrifice quality.

What You Can Do to Avoid Your Web Developer Over-Compressing Your Headshot

Ask your web developer what size requirements they have (dimensions in pixels). When you do, you can also ask them what crop factor they want, like 8×10, 5×7 or 1×1. You can share this information with your photographer. A knowledgeable photographer might be able to size and compress the image better than your web developer, saving the quality. Also ask your web developer if there is a file size they are trying to stay under (for example, 100 KB). Again, provide this information to your photographer.

Another important note is that some caching services and technologies have built-in compression for images. So, now your web developer and your caching service have double compressed your images.

Furthermore, caching services can do a terrible job of it, again because they are there to optimize for speed too not image quality. If you can, keep control of your image compression instead of relying on your cache technology to do this. There are usually options to cache without compressing images so you can do that yourself.

Keeping image quality on a website should be more important to web developers. But they are pressured to improve speed results by the powers that be in search technology. It’s unfortunate that search technology companies don’t consider that for certain pages image is everything and that these pages should not be penalized as a result. It’s like having the Mona Lisa in a museum being covered by a tarp because the museum manager decided it takes too long for people to see it.