Who doesn’t love pictures? They amplify text and make things more colorful on your website. Adding a picture or two is a good way of making your content more attractive and palatable for your audience.
However, like written content, it’s important to optimize your images for Orange County SEO. If not optimized correctly, images can affect page load speeds and user experience, which is extremely bad news for both search engines and your audience. So, if your website has a ton of images and you’re worried about optimizing them properly, then you’ve come to the right article.
Here are an Orange County web design company’s top tips for image optimization.
1. Remove Image Cumulative Layout (CLS)
Have you ever loaded a website with slow Internet and gotten annoyed with how much the website was moving as it’s loading? This is referred to as a cumulative layout shift and can be caused by multiple reasons, the most common of which is images. CLS can cause poor user experience, which directly affects your SEO, so it’s best to prevent this from happening.
The best ways to prevent cumulative layout shift is specifying images’ aspect ratios, as well as reserving space for ads and embeds, preloading web fonts, and ensuring the site is mobile-optimized.
2. Resize Your Images
Larger images take up a lot of bandwidth on your website, which makes the page a lot lower to load in turn. This, then, affects your SEO as a slow-loading page affects how well Google indexes your website.
So, when you’re uploading an image to a page, make sure that it’s resized properly. That means uploading a picture in the size you want instead of just resizing it on the website editor (e.g., uploading 640×480 instead of uploading 1980×1080 then resizing to 640×480).
To check for incorrectly-sized images on your website, we highly recommend using Google’s tool, PageSpeed Insights. Here, you can use PageSpeed Insights report > Opportunities > Properly Sizes Images to figure out what needs to be resized.
3. Choose Image Format Carefully
As strange as it may sound, the image file format you choose can also make an impact on your page loading speed. JPG and WebP, for example, are typically smaller at the expense of image quality. On another side of the spectrum, PNGs have excellent image quality but are usually larger than their counterparts.
Take a look at your image on the page. If it’s fairly small, say a thumbnail for an article, then you can probably get away with using a JPG or a WebP. However, if the image is smack-dab in the middle for the world to see in all its glory, then you’ll definitely want it looking good as a PNG.
4. Compress Images
Image compression means decreasing file size while maintaining image quality. This will help save you a lot of space and makes the page load quicker.
Using PageSpeed Insights again, go to the Encode Images Efficiently tab and use it to find images that can be compressed. Then, search for any image compression tool of your choice and start compressing. We recommend free ones like TinyPNG, I Love IMG, and Optimizilla.
5. Cache Images Properly
Caching data refers to storing information like files, images, and other things onto your browser or device. This way, a person can load the website much quicker if they visit again soon. Think of it like ordering your favorite meal at your favorite restaurant—the waitress already knows what you like and won’t bother taking your order anymore!
When you have an HTTP response header on your site, you can indicate how long their browser can cache images. It can be as short or as long as you’d like—if you frequently change your images, for example, it’d be a good idea to set cache response to short. It’s also important to ensure your HTTP or HTTPS is secure to protect your readers from harm.
6. Sequence Image Downloads
Your landing page is the first thing your audience sees when they visit your website. As such, you need to ensure all images they see on the landing page (i.e., hero images > above the fold > just below the fold) load the quickest. This way, your audience can see everything all at once.
All other images can be loaded lazily.
To do this, head to PageSpeed Insights again and click Defer Offscreen Images. Here, you’ll find a list of images on one page that can be loaded after your main images.
Conclusion
These six tips were compiled by an expert web design company in Orange County using Google as a source. You can find Google’s 14-minute video here if you’d like to take a look. Additionally, you can always pass along the task of image optimization to someone who’s well-versed in the matter. Drive Traffic Media is an Orange County SEO expert that can help you with that. Contact us at (949) 800 6990 now!
