What is Alt Text?

Alt text stands as one of the most misunderstood elements in web design and digital marketing. This HTML attribute provides a text alternative for images when they cannot be displayed or accessed, serving both people who use screen readers and search engines that cannot interpret visual content. The technical term “alternative text” or its shortened form “alt text” might sound simple, but its implementation requires careful thought about accessibility and search optimisation. Getting it right means making your website accessible to millions of users whilst simultaneously improving your visibility in search results.

Writing alt text descriptions for website images demonstrates best practices for accessibility

 

The origins of alt text trace back to the early days of the web when slow internet connections meant images often failed to load. Users needed to know what they were missing, so the alt attribute was born. Today, with broadband and 5G connections, its purpose has shifted from compensating for technical limitations to addressing human needs. Approximately 2.2 billion people worldwide live with some form of vision impairment, and many rely on screen readers that convert text to speech or braille. Without properly written alt text, these users encounter images as blank spaces or generic filenames like “IMG_345.jpg” that offer no context or meaning.

Search engines face a similar challenge. Google’s image recognition technology has improved dramatically over the past decade, but it still cannot fully understand the context, purpose or meaning of every image on every website. Alt text provides the information that algorithms need to index images correctly and understand how they relate to the surrounding content. This makes alt text both an accessibility requirement under laws like the Americans with Disabilities Act and the UK Equality Act, and a valuable SEO tool that can drive traffic from image search results.

The Requirement for Descriptive Alt Text on All Images

Screen readers announce alt text to users who cannot see images, replacing the visual experience with an auditory one. When someone visits your product page using a screen reader, they hear your heading, your body copy and then the alt text for each product image. If that alt text reads “Blue cotton t-shirt with round neck and short sleeves, front view” the user understands exactly what they’re looking at. If it reads “image” or “product_photo” they learn nothing useful and may abandon your site out of frustration.

The quality of your alt text directly impacts how many people can use your website effectively. Imagine browsing an online store where you can hear the product descriptions but the images are described only as “photo” or not described at all. You would struggle to make informed purchasing decisions or even navigate the site properly. This is the daily reality for millions of screen reader users encountering poorly implemented alt text. Beyond legal compliance, providing good alt text is simply good business because it expands your potential customer base and demonstrates that you care about all users regardless of their abilities.

Alt text also functions as a fallback when images fail to load due to slow connections, broken links or server issues. In these situations, browsers display the alt text in place of the missing image, giving users context about what should have appeared. This proves particularly valuable on mobile devices where connection speeds vary and users often browse on limited data plans. A well-written alt text attribute means your content remains understandable even when technical problems arise.

Optimising Search Rankings Through Descriptive Text

Google processes billions of image searches every month, and alt text plays a central role in determining which images appear for which queries. When you search for “red leather handbag” Google examines not just the images themselves but also the alt text, surrounding content, filename and page context to determine relevance. Images with descriptive, accurate alt text have a better chance of ranking prominently in image search results than those without.

The relationship between alt text and SEO extends beyond image search. Google uses alt text as part of its overall assessment of page content and topic relevance. An article about sustainable gardening techniques gains authority when its images include alt text like “raised bed garden with companion planted tomatoes and marigolds” rather than generic descriptions. The keywords in your alt text help search engines understand what your page covers and who might find it useful, contributing to your rankings in regular web search as well as image search.

Writing alt text purely for SEO without considering users is a mistake that often backfires. Google’s algorithms have grown sophisticated enough to recognise keyword stuffing and irrelevant alt text that exists only to manipulate rankings. Alt text reading “blue shoes blue trainers blue sneakers buy blue footwear online cheap blue shoes” serves no-one well because it provides no actual description for screen reader users and looks manipulative to search engines. The most effective approach treats alt text as descriptive copy that happens to include relevant keywords naturally, rather than as a keyword repository.

What Makes Alt Text Effective for Users and Search Engines

Good alt text describes the content and function of an image concisely, typically in 125 characters or fewer. This length limit stems from how screen readers handle text, with many older assistive technologies cutting off alt text after roughly 125 characters. While modern screen readers can handle longer text, keeping descriptions brief remains good practice because it prevents users from having to listen to lengthy descriptions when they just want to understand page content quickly.

The best alt text answers the question “what information does this image convey?” rather than “what do I see?” For a photo showing someone using a laptop in a coffee shop, poor alt text might read “person with laptop” whilst good alt text might read “freelancer working on MacBook Air in busy cafe.” The second version provides context about the setting and activity that makes the image meaningful. If the image is purely decorative and adds no information, it should have an empty alt attribute so screen readers skip it entirely rather than announcing its presence unnecessarily.

Context determines what details matter in your alt text. A photograph of the Eiffel Tower on a travel blog about Paris landmarks needs different alt text than the same photograph on an architecture website discussing iron lattice construction techniques. The travel blog might use “Eiffel Tower at sunset viewed from Trocadero Gardens” whilst the architecture site might use “Eiffel Tower showing exposed iron lattice framework and arch structure.” Both describe the same image but serve different purposes based on why the image appears on that particular page.

Conveying Visual Purpose Within the Alt Attribute

Images showing people and actions benefit from alt text that describes what is happening rather than just what appears in frame. An e-commerce photo might show a woman wearing a jacket, but effective alt text would specify “woman wearing navy blue quilted parka with faux fur hood, front zipper closed.” This level of detail helps someone using a screen reader understand the product features just as well as someone viewing the image can.

Action and emotion add meaning to alt text when they matter for understanding. A screenshot showing a software interface benefits from descriptions like “dashboard view showing analytics graph with upward trend, green progress indicators and export button” rather than just “software screenshot.” The first version tells users what they would learn from viewing the image, whilst the second provides no useful information about what the screenshot demonstrates.

Alt text should avoid phrases like “image of” or “picture showing” because screen readers already announce that an image is present. Starting your alt text with “photo of three chocolate chip cookies on white plate” is redundant when “three chocolate chip cookies on white plate” communicates the same information more efficiently. Every character counts when working within length constraints, so eliminating unnecessary words makes room for more useful description.

Different Approaches for Decorative Images and Complex Graphics

Not every image on your website needs descriptive alt text. Decorative images that serve purely aesthetic purposes like background patterns, dividing lines or stylistic flourishes should have empty alt attributes rather than forced descriptions. This tells screen readers to ignore these images and prevents users from hearing meaningless descriptions of purely visual design elements. An ornamental border pattern adds visual appeal but conveys no information, so giving it alt text only creates noise for screen reader users.

Complex images like charts, graphs, infographics and diagrams pose special challenges because they contain too much information to describe in 125 characters. For these images, you have several options. You can provide brief alt text that summarises the main point (“bar chart showing quarterly sales growth of 15% across all regions”) and then include a longer text alternative elsewhere on the page that describes the data in detail. HTML5 provides the longdesc attribute for this purpose, though browser and screen reader support varies.

Another approach for complex graphics involves providing the same information in text format below or near the image. If your infographic shows the five stages of customer onboarding, your page text should explain these five stages in words. This benefits all users, not just those using screen readers, because it makes your content accessible to people who process information better through reading than through visual interpretation. It also provides search engines with more textual content to index, improving your SEO beyond what alt text alone could achieve.

Where Alt Text Implementation Commonly Fails

The most common mistake is leaving alt text blank or missing entirely. Content management systems often insert default alt text like “image” or use the filename, resulting in screen readers announcing “Image IMG underscore 4823 dot JPG” which provides no information. WordPress and other platforms make it easy to add alt text when uploading images, yet many website owners skip this step because they do not understand its importance or feel pressed for time.

Keyword stuffing represents another frequent problem. Some SEO practitioners treat alt text as prime real estate for cramming in search terms, producing descriptions like “red dress red cocktail dress red evening dress red formal dress buy red dresses online.” This approach fails both accessibility and SEO goals because it provides no genuine description for users and looks like manipulation to search engines. Google’s algorithms have become adept at identifying and potentially penalising this behaviour.

Generic or vague alt text like “team photo” or “product image” wastes an opportunity to provide meaningful information. If your ‘about’ page includes a team photo, alt text reading “photo of company team” tells users nothing they could not infer from context. Alt text reading “Cloud Solutions team of eight people standing in office lobby, with company logo visible on wall behind them” gives screen reader users actual information about what the photo shows and who appears in it.

Technical Implementation Across Different Platforms

WordPress makes adding alt text straightforward through the media library interface. When you upload an image, you see fields for title, alt text, caption and description. The alt text field is what matters for accessibility and SEO. You can also edit alt text for existing images by opening the media library, clicking on an image and updating the alternative text field. Many WordPress SEO plugins provide reminders or warnings when images lack alt text, helping site owners maintain better practices.

E-commerce platforms like Shopify and WooCommerce provide dedicated fields for product image alt text. Product images particularly benefit from descriptive alt text because they serve a functional purpose in helping customers understand what they might purchase. Generic alt text like “product photo” fails spectacularly here, whilst detailed descriptions like “stainless steel water bottle with bamboo lid and protective silicone sleeve, 750ml capacity” help all users understand the product features and help search engines match your products to relevant queries.

Building Alt Text Into Your Content Workflow

Making alt text a standard part of your content creation process prevents it from being forgotten or treated as an afterthought. When briefing photographers or graphic designers, include alt text as a deliverable along with the images themselves. The person creating the image often has the best understanding of what it shows and why it matters, making them well-suited to write effective descriptions.

Conducting regular accessibility audits helps identify images lacking proper alt text. Free tools like WAVE and browser extensions like axe DevTools can scan your website and flag images with missing or problematic alt text. These audits reveal patterns in how your team handles images and where training or process improvements might help. A site with thousands of images might discover that blog posts generally have good alt text whilst product pages do not, suggesting that different teams need different levels of support.

Training content creators and marketing teams about alt text importance produces better long-term results than trying to fix alt text problems after publication. A 30-minute workshop covering accessibility basics, screen reader demonstrations and alt text best practices can transform how your team thinks about images. Once people understand that real users depend on alt text to access content, they tend to take the task more seriously than when it seems like an abstract SEO or compliance checkbox.

We’ve spent nearly two decades mastering professional graphic design and web development, learning what it takes to create accessible, search-optimised websites that function beautifully for all visitors. Operating from our primary hub in Horley, Surrey, with further offices in Peckham and Hampstead across London, we’re positioned to support businesses throughout the region. If you’re looking for accessibility audits or search optimisation, we can help you build digital experiences that reach every user. Contact us to discover how we can improve your website’s accessibility and search performance.

TL;DR Version

Alt text is the HTML attribute that provides descriptive text for images to ensure content accessibility for screen readers and contextual indexing for search engines

Services A-Z

Analytics & Performance Tracking
Branding & Visual Identity
Content Management System (CMS) Development
Competitor Analysis
Conversion Rate Optimisation (CRO)
Copywriting and Content Creation
Customer Journey Mapping
Data Analysis & Reporting
Digital Brochure Design
Digital Strategy Consultation
E-commerce Development
Email Marketing
Fractional Marketing Support

Generative Engine Optimisation (GEO)
Graphic Design
Infographic Design
Landing Page Design
Lead Generation Strategy
Logo Design
Marketing Collateral Design
Marketing Planning & Execution
Mobile Responsiveness Optimisation
Motion Graphics & Marketing
Off-Page SEO
On-Page SEO
PPC Advertising & Management
Presentation Design
Ruby on Rails Development

Search Engine Optimisation (SEO)
SEO Audits
Shopify Online Store Support
Site Speed Optimisation
Social Media Ad Management
Technical SEO
Video Editing
Voiceover Services
Web Analytics Setup & Optimisation
Website Design & Development
Website Maintenance & Support
WooCommerce Setup
WordPress Website Design & Development
WordPress Maintenance & Support