Image Optimization for Websites

by Apr 1, 2020

By Lauren Lawton Perfors

By Lauren Lawton Perfors

Web Developer

Small business WordPress developer with 10+ years experience in digital marketing, specializing in SEO.

Did you know that 65% of the web’s content are images? Here are a few ways that images contribute to your website’s success:

  • Images are important for SEO. Google prefers to see websites with appealing visuals, and image alt text offers keyword opportunities.
  • Images are a vital part of creating a strong visual for your website visitors.
  • Websites use images to help visitors connect with your audience by portraying the target audience.
  • Bio images humanize a company by visually representing its team members.
  • High-quality product images make the difference between a casual shopper and a buyer converting.
  • Portfolio images showcase examples of digitally represented work.
  • Blog post supporting images can dramatically impact whether a blog post is clicked on and read or passed over in social media feeds.

Images can also have drastic consequences if not sized correctly. They can make a website look clunky and dated. A single oversized image can increase the size of a webpage by 100x, slowing down the entire webpage’s load time in a browser for a visitor. Slow websites are terrible for SEO and can lead to website visitors leaving before the page ever loads. Large images also take up valuable server space, which over time can make your server bloated and can lead to paying more for extra server space, yikes!

Images downloaded or imported off of digital cameras (or smartphones) are often 10-20x larger than they should be on the website. They need to be re-sized and optimized BEFORE uploading them to your website.

Here are some suggestions for keeping images sized appropriately for the website before uploading:

Size:

Size matters and bigger is not better! Producing images with the smallest possible file size without reducing image quality is the aim here.

For background images and any image that is full-width (spans the full-width of the screen/website), aim for:

  • Width: 1920px
  • Size: <300kb

For any other images that are embedded on any post or page, aim for:

  • Width: 750px
  • Size: <100kb

These are guidelines. Once in a while, you’ll have to make an exception for a very vivid image, and that’s ok!

Format:

For the image format, always export as a .jpg unless the image has transparency in it. If the image has transparency, then use .png. Most image editing tools have export options that allow you to declare the width and quality of the image when exporting. That’s where you can optimize the image for the website before uploading it.

Clean:

Finally, when you have time, try to keep your WordPress media library “clean” by clearing out old image files that are no longer being used.

By following these steps, you will enhance site performance and reduce precious storage space.