Image Insights: A Return to Fundamentals

female legs hanging out of car window with 'Image Insights' superimposed

A lot has been made in recent weeks among SEO circles of Google’s prioritisation of correct markup on image tags – both from an accessibility standpoint and search optimisation.

Jennifer Slegg, author of Google Panda’s guide and writer at SEMPost, said “people are neglecting image search)”. While undoubtedly true, the timing of this tweet coming not long after Google’s 20th Anniversary announcements of updates to image search to provide greater context in search results).

 
 

Announcements such as these are always interesting - Google rarely shows their working – causing SEO sites to scramble to decipher their meaning, how best to help our readers, demonstrate authority on a topic and, ultimately, how will this affect our clients’ rankings?

Google's refusal to show their working causes SEO sites to scramble to decipher their effect on rankings

All this is well and good, the undoubtedly useful help they provide are great for SEOs wanting to stay ahead of the curve. Such SEOs needing to maintain such a level of up-to-date knowledge are usually monitory huge sites with thousands of pages contains 10s of thousands of products.

Furthermore, not only are these sites huge, they are also competitive, meaning that the site as well as the SEO staying abreast of the very bleeding edge of Google’s algorithm can allow them to shave precious SERP space from less agile competitors.

Implementing such updates will (hopefully) produce marginal gains, sharpen the edges of organic visibility and claw a site a few places up the rankings.

The reality however, is rarely so agile, such sites are invariably bogged down with the cobwebs of legacy systems enacted by long departed tech leads.

This, combined with the fact actually implementing the changes is usually left to engineers and developers, leaving many SEOs with only periphery access make such updates, result in little in the short term. That is, beyond exasperating those responsible for the organic potential of a company. Many more updates will come and go by the time lots of larger companies get a chance to enact these changes.

Many more Google updates will come and go before larger companies can enact these changes

So, if these updates to Google’s image policy mainly resonate with those SEOs with frustratingly little potential to act, and most people’s websites are still finding their footing in a competitive search environment - what can be done? If your company is still battling to consolidate non-brand terms in short and long tail queries, how can Google’s updates be leveraged properly?

The answer is a return to the fundamentals.

SEO at its most fundamental

Implementing the very cutting edge of search tactics when the rest of your site doesn’t conform to even basic image standards will be a thankless task. It’s no good taking the blowtorch to flambé a crème brûlée before you’ve even used the cream.

It’s no good taking the blowtorch to flambé a crème brûlée before you’ve even used the cream.

Despite Google’s forays in recent years into, shall we say less than savoury, areas of business, its fundamental mission has always been to simply find what users are looking for. And the simple answer to that is if your site isn’t making that easy, then you are relying on lots of other contextually subjective means of determining a site’s potential to position you over your competitors.

With that in mind, here are two of the most fundamental things to bear in mind for your site’s images.

  1. Include image alt texts and title tags

    W3C – the Internet’s closest thing to an authority – states that an image’s alt tag (or alt – alternative - text) should “play the same function on the page as the image” and “must convey the same meaning as the image)”.

    This means that your alt text should explain what is in the image, including any text it includes, as well as indicate what the image represents.

    Alt text is only one part of the story however, your title tag can be said to be equally important – doubly so if you are using a Content Delivery Network (CDN) which can scramble your image’s URL from a relatively friendly site.com/images/image-name.jpg to an incomprehensible alphanumeric nightmare.

    As Ms Slegg outlined above, we are neglecting image search by not properly annotating our images, primarily through either leaving them blank or crowbarring in keywords we want them to rank for, the title tag provides opportunity to both be compliant and include our title tag keywords.

    For example, on an article titled “Top 10 ISAs of 2019”, there will undoubtedly be some rather bland images of people in suits holding white papers. Valid arguments about image choice aside, the image’s alt text should detail the people in suits, holding the white papers - there is no real reason for the alt text to include the word (acronym) “ISA”. The title tag however, can and should be called “top-10-isas-2019-suits”.

    Google says it “uses the URL path as well as the filename to help it understand your images?hl=en)”. Your CDN may prevent the URL structure from being particularly indicative but the filename should not – and that is your choice.

    Google uses the URL path as well as the filename to help it understand your images

    It speaks volumes that even websites dedicated to covering the new best practices such as those detailed above do not follow even these basic guidelines with the most recent articles on RankRanger) (no title tag), Moz) (no title tag or alt tag), Ahrefs) (no title tag) and SEMRush) (no title tag) all lacking in very basic fundamentals.

    We are fans of virtually all these tools and resources, but SEO can be said to be like the best advice from the most lovelorn friends – do what they say, not what they do.

    Incidentally, this was very easy to check either through the Inspector or the exceptionally handy View Image Info Chrome extension?hl=en).

  2. Optimise for size

    Google said as long as eight years ago) that the length of time your site takes to load – the page speed – is a determining factor in your site’s ranking. You can test this using either the Lighthouse Audit Tool) in Google Chrome or the PageSpeed Tools) as part of Google’s developer tools.

    As images are typically among the largest files on a website, making sure they’re as quick to load as possible is super important.

    Depending on the size of a company, image asset management can be difficult, and it seems most difficult at both ends of the spectrum – larger organisations typically manage extensive asset libraries of high end, large file size photography and operate strict website management policies preventing anyone, such as an SEO concerned with page load time, from making quick changes, while smaller organisations typically lack the time, knowledge or tools to properly optimise.

    Image asset management can be difficult at all companies no matter the size

    In the first instance, getting access to such a system may be a case of buying the right person a coffee and putting your case forward but in both scenarios, knowing how to generate such files is crucial.

    The right dimensions

    First, make sure your images are the right dimensions for the space they’re going, too large and you will waste pointless bandwidth and slow the site down, too small and they will be pixelated and make for poor user experience.

    Common sizes for website imagery include:

    • Social
      • Facebook 1200 x 628px
      • Twitter 1024 x 512 (2:1 aspect ratio)
      • LinkedIn 646x220px
      • Instagram 1080x1080 (1:1 aspect ratio)
    • Advertising
      • Midpage Unit (MPU) 300x250px
      • Banner 900x128px

    You can see more best practices for different image sizes and different social media at Sprout Social).

    Photoshop is our preferred tool for this kind of quick image change but BeFunky) is a relatively easy online free alternative which will allow you to crop to a specific size.

    A lighter file

    Dimensions are only one aspect however, file size is perhaps more important.

    Make your images as small as possible without compromising the quality. Practically all mobile phone cameras produce images of a file size much too high for virtually any website not dedicated to photography – and even then you should first load an optimised image with a link to a full size photo.

    Even if your file is already small enough, still run it through an optimiser

    Aim for images no larger than 120kb in most circumstances, 200kb at the outside for larger, hero images and in the main, the small, product and inline images, should ideally be below 60kb.

    Once you have cropped, both Photoshop and BeFunky allow you to change the quality of the image before saving, Photoshop in the Export > Export As menu, and BeFunky in the Save menu:

     

    Play with the slider, anywhere between 60% and 90% should be enough to bring the image down to a tolerable level, ideally a little larger than the examples laid out above as we will optimise further.

    Once you have exported your image out to an acceptable level, run it through another optimiser such as ImageOptim a free drag and drop programme which will remove meta data and further minimise the file as much as possible. If you can’t install programmes on a work computer, use TinyPNG, an online alternative that does largely the same.

    You should now have an optimised file size, rename it something appropriate for the file – this should be relevant to the page it’s appearing on as well as the image itself e.g. chocolate-cake-recipes-carrot-cake.jpg or 10-best-isa-2019-business-people.png

    Your image should follow the process below, check out the header image above to verify the size and markup.

     

    These two steps should be mandatory to all images – including logos, header images, profile pictures and any other image on page, there is simply no excuse to not create a lightweight, W3C compliant image in all cases.

    Except one.

    Background images cannot contain alt text, and while you should still ensure the file size and filename is done the same, it will be difficult to accrue the SEO value from that particular image. As a result, there is little benefit to be gleamed from using this tactic.

    Some have recommended workarounds such as loading in a transparent image with the equivalent alt text and title tags but this is unlikely to fly with the sophistication of Google’s algorithm and should be avoided wherever possible.

    For more advanced users there are other techniques to consider, particularly the srcset property which allows for specific images for different devices but again, this is more marginal than pure fundamental.

So, while everyone from your competitors to SEO specialists to outright giants of the Internet pursue ever more granular and technical solutions to their image usage, they completely neglect the pure fundamentals of image best practice.

Follow and implement new developments in SEO if you can, but ignore fundamental best practices at your peril.

 

 

Get in touch

If you'd like to talk to us about your image asset management or review your site for best practices, drop us a note below.

 
Name *
Name