Image Optimisation
Images are typically 40 to 50% of a webpage's total file size. They are also the element most commonly responsible for slow page loads - which directly affects both rankings and user behaviour. Getting image optimisation right is one of the most impactful technical improvements you can make, and it is also one of the most neglected. According to SE Ranking, 36% of websites still upload oversized images that slow their pages down.
Image optimisation affects SEO in two distinct ways: it speeds up your pages, which improves Core Web Vitals scores and reduces bounce rates; and it gives Google the context it needs to understand what your images contain, which improves your visibility in standard search results and Google Images.
Alt text
Alt text is the written description of an image stored in the HTML code. It serves two purposes simultaneously: it helps screen readers describe images to visually impaired users, and it tells Google what the image shows.
According to Google's own Search Central documentation, Google uses alt text along with computer vision algorithms and the contents of the page to understand the subject matter of an image. This means alt text is a direct signal - not just a best-practice recommendation. A page full of images with empty or generic alt attributes is a page full of content Google cannot fully understand.
How to write good alt text:
- Describe what is in the image accurately and specifically - "screenshot of Ahrefs Keywords Explorer showing a keyword difficulty score of 32" is better than "Ahrefs tool screenshot"
- Include your primary keyword where it fits naturally - do not force it into every alt attribute
- Keep it under 125 characters
- For purely decorative images that add no information, use an empty alt attribute (
alt="") rather than describing the decoration - Never stuff alt text with keyword lists - Google's documentation explicitly identifies this as a spam signal
File names
Before uploading an image, rename the file. Google cannot see the image itself - it reads the filename as a signal. A file named IMG_083422.jpg tells Google nothing. A file named ecommerce-seo-keyword-research-screenshot.jpg provides direct context.
Use lowercase letters, hyphens to separate words (not underscores or spaces), and include the relevant keyword where it makes natural sense. Keep filenames concise and accurate to what the image actually shows.
File format and compression
WebP is the recommended format for most web images. It delivers images that are typically 25 to 35% smaller than JPEG at equivalent visual quality, and is supported by all modern browsers. Where you are serving photographs or complex images, WebP is the default choice - convert them in your browser with my free JPG to WebP and PNG to WebP converters. PNG remains appropriate for images requiring transparency. SVG is best for logos and simple graphics that need to scale cleanly.
Target a file size under 200 KB for most images. My free, in-browser image compressor shrinks JPG, PNG and WebP without visible quality loss, and nothing you drop in is ever uploaded. Most WordPress and Shopify setups can also automate this via plugin.
Page speed matters in direct, measurable ways. Research cited by SearchX found that when page load time increases from one second to three seconds, bounce rates increase by 32%. Images are the primary driver of page weight and therefore the primary lever for load time improvement. Compressing your images is one of the fastest ways to move your Core Web Vitals scores, specifically Largest Contentful Paint, which measures how long the largest visible element takes to load.
Lazy loading
Lazy loading defers the loading of images that are below the visible fold until the user scrolls toward them. This dramatically improves initial page load time because the browser does not need to fetch every image on the page before rendering what the user can see.
Implementation is straightforward - add loading="lazy" to any <img> tag that appears below the fold. Do not apply lazy loading to hero images or any image visible on initial load, as this will delay their loading and hurt your LCP score rather than help it.
Quick audit checklist
When reviewing images on your site's most important pages:
- Every informative image has descriptive, keyword-relevant alt text
- File names describe the image content, not camera-generated codes
- Images are served in WebP format where possible
- No image exceeds 200 KB without a strong reason
- Below-fold images have
loading="lazy"applied - Hero and above-fold images do not have lazy loading
With image optimisation complete, the on-page SEO chapter is done. The next chapter covers technical SEO - the infrastructure that makes everything else work.
Next: Technical SEO overview