5 Common Mistakes to Avoid When Adding Images to Your Website

We spend a lot of time crafting the perfect pitch in our blog posts and web copies. However, when it comes to visuals, many skimp out and add just about any relevant image available – without getting into the details.

As a result, we manage to turn off and repel the very people we want to engage.

Website images are the anchor and hook of a good website design. According to research, visuals are:

• More effective in communication
• Attracts viewers
• Impact buying decision
• Enhance business reputation

But it will be hard to avail any of the benefits if your images are not optimized according to the user's expectation.

In this guide, I will explore some of the common mistakes marketers make when adding images to their website, along with ways to rectify them.

Mistake #1: Adding 'Huge' images

Image size impacts a website's performance significantly. When we upload very large images, the website speed becomes slow and sluggish. And if your pages take too long to load, you risk losing visitors who don't have the patience to wait.

In fact, most visitors wait only 3 – 5 seconds for a website to load and move on to a competitor if it takes longer.

The Solution:

Ideally, your image size should not be more than 125KB for a website. However, you can test how various images affect website speed to determine the best size according to the page's layout.

Photoshop also has the option "Save for Web and Devices," which helps decrease a photo's size. If you don't have Photoshop, there are several tools on the internet, such as Resizing.app, that you can use to resize image size without worrying about losing quality.

Mistake #2: Adding images that are distorted

Nothing looks strange to a visitor's eye than an image that is improperly stretched or scaled.

However, you simply can't grab any side and stretch to fit the required size when it comes to digital photos. Instead, you need to ensure that you stretch with a ratio of 1 to 1. Anything less will damage the overall integrity of the image.

The Solution: 

Scale the images proportionally using appropriate tools. One of my favorites is the Image Upscaler by StockPhotos. The tool uses machine learning technology to decipher the photos automatically and accurately clears up the image while increasing the size.

Best of all, it has a built-in social media feature that enables you to crop the photos according to the required social media size – giving you the flexibility to use the same image on both website and social media without losing quality.

Mistake #3: Failing to focus on SEO

It may be easy to overlook SEO when it comes to images, but you must include all the details from Google's perspective to help your page rank. For example, most of us are habitual of adding file names by default title. However, file names that include keywords are crucial for image optimization.

Alt Tags are another area that most people forget to include when adding images to their website. Alt Tags serve as an alternative to images when a browser can't correctly render them.

It also helps the visually impaired get a better understanding of what the image is about.

Above all, it can help your website achieve a better ranking when search robots crawl your page. 

The Solution:

Take some time out and craft proper names for your file. Describe the file name and Alt Tag clearly with keywords. But of course, avoid stuffing keywords and only add where appropriate.

Take this picture of a lioness:

I don't recommend using the below filename and Alt Tag

Filename: lioness.jpg

Alt Tag: lioness

An example of a good filename and Alt Tag is for this image is:

Filename: lioness-drinking-water.jpg

Alt Tag: Brown lioness drinking water during day time

Making Alt Tags descriptive would help describe the images to people who are unable to see them. At the same time, it would help you reap the benefits of SEO with a better user experience.

Mistake #4: Not using the Right Image Format

Some people are under the assumption that file extensions don't matter. It is also easy to get confused in the technical acronyms.

But remember that not all image file formats are created equal. Each has its specific use and set of pros and cons. for example:

JPG/JPEG files are primarily used for images and are ideal for rich color photographs and gradient images. However, they compress file sizes that may result in low image quality. Moreover, they are not recommended for images that include text as well.

PNG is another standard file extension that supports high image quality and color representation. Because of their inability to pixelate (like JPEG), they are recommended for charts, logos, graphics, etc.

GIF is widely used in animation. They produce lower quality images than JPEG but are frequently used for simple graphics.

SVG is a vector format that remains sharp and clear regardless of the device you view it on.

The Solution:

Learn the difference between each file extension and save your images according to the use. Doing this will not only display the image correctly but also ensure that you are not losing out on any technicalities in the performance.

Mistake #5: Using a cliché image

If you cannot find the time or resource to create a custom shoot for your website, it is ok to use a stock photo. However, stock photo sites are filled with images that are overused and somewhat generic. If you use one that you have already seen somewhere on the internet, chances are your audience also has.

The Solution:

Look thoroughly. As we said above, it's perfectly ok to use a stock photo on your website. However, look for images that are unique and not overused to death on the internet.

Men in a suit shaking hands or a customer support representative smiling broadly at the camera are just some examples of photos that are cliché and not at all appreciated by the viewers.

Instead, use images with candid shots. Avoid the ones that look unrealistic or posed and go for natural photography. You can also edit the stock photographs according to your website's layout, so they complement your brand – rather than overshadowing it.

Conclusion

You may have heard the saying that a picture is worth a thousand words. But would the same apply to images that are improperly formatted or simply low quality? Definitely not!

Images are an essential asset in marketing, so make sure to take some extra time to select and optimize images that are successful in engaging the viewers. Good luck!