Alt Text: What It Is and How to Write It

You've spent hours choosing the perfect images for your website. Your hero shot looks professional. Your product photos are crisp. But here's the uncomfortable truth: to Google and screen readers, those images are invisible unless you've written Alt Text for them.

This isn't a nice-to-have. Alt Text is one of the lowest-hanging SEO opportunities most micro-businesses completely miss. Without it, search engines can't "see" your images, people using screen readers can't understand your content, and you're leaving easy ranking improvements on the table.

The good news? Writing effective Alt Text takes about 30 minutes for your most important images, and the formula is straightforward once you understand it.

What You'll Have When Done:

10 images on your website correctly tagged with Alt Text, improving both SEO and accessibility.

Time Needed: 30 minutes

Difficulty: Beginner

Prerequisites:

Functioning website access; core keywords identified

In this guide:

• Quick Start (5 Minutes)
• Complete Step-by-Step Guide
• Troubleshooting

---

Quick Start (5 Minutes)

Before You Start, Make Sure You Have:

• ☐ Completed website setup (Layer 2 of the Blueprint)
• ☐ Identified core keywords (keyword research)
• ☐ Access to your website image editing controls (CMS)
• ☐ Completed title tags and meta descriptions (this builds on those on-page SEO fundamentals)

NetNav Integration: Before you dive in, you need to know which images are already missing Alt Text. Manually auditing your site for missing tags is time-consuming, but NetNav's core audit checks every image file on your site in under 60 seconds, highlighting exactly where you need to focus your 30 minutes.

The 5-Step Quick Method

Step 1: Identify Your 10 Most Important Images

Open your website and list the images that matter most: your logo, hero image, main product shots, team photos, or key service illustrations. Skip decorative elements like background patterns for now.

Step 2: Review Your Primary Keyword List

Pull up the primary keywords you identified earlier. You'll use these naturally where they genuinely describe the image content.

Step 3: Use the Alt Text Formula

For each image, write: [What the image shows] + [Why it's there] + [Natural keyword if it fits]

Example:

• ❌ Poor: "image-001.jpg"
• ❌ Keyword stuffing: "plumber emergency plumbing services London plumber near me"
• ✅ Good: "Emergency plumber repairing burst pipe in London kitchen"

Step 4: Enter Alt Text in Your CMS

In WordPress, Squarespace, Wix, or Shopify, click on each image and find the "Alt Text" or "Alternative Text" field. Paste your description. Save.

Step 5: Verify Two Images

Right-click any image on your live page, select "Inspect" or "Inspect Element", and look for `alt="your text here"` in the HTML code. If you see it, you've done it correctly.

You've Completed Quick Start When:

• ✓ You've written Alt Text for 10 key images
• ✓ Each description is under 125 characters
• ✓ You've verified the Alt Text appears in your page's HTML
• ✓ Decorative images have blank Alt Text (`alt=""`)

✅ Completed the quick version? Move on to Internal Linking: Connect Your Pages for SEO or continue below for the detailed walkthrough including how to handle decorative images and avoid common mistakes.

---

Complete Step-by-Step Guide: The Alt Text Formula

Alt Text (alternative text) serves two critical functions: it describes images to people using screen readers, and it tells search engines what your images contain. This makes it both an important foundation of website accessibility and a core SEO element.

Step 1: Understand the Goal (Accessibility First)

Alt Text exists primarily for accessibility. When someone uses a screen reader to navigate your website, the software reads the Alt Text aloud. When an image fails to load, browsers display the Alt Text instead.

This means your Alt Text must be genuinely descriptive, not just keyword-optimized nonsense.

Think about these scenarios:

• A visually impaired user lands on your plumbing services page. Their screen reader announces: "Image: emergency plumber repairing burst pipe in London kitchen." They immediately understand what service you're showing.
• Google's crawler visits the same page. It can't "see" the image, but it reads the Alt Text and understands this page is relevant for emergency plumbing services in London.

[MEDIA:SCREENSHOT:alt-text-example-good-bad]

Caption: Examples of Good, Better, and Poor Alt Text for a specific product image.

The hierarchy of Alt Text quality:

• Poor: Generic filename or keyword stuffing ("plumber plumbing emergency London")
• Good: Accurate description ("plumber fixing pipe")
• Better: Description with context and natural keyword ("emergency plumber repairing burst pipe in London kitchen")

Step 2: Identify Image Types and Priorities

Not all images need descriptive Alt Text. Understanding which images require attention saves you time and improves user experience.

Images that MUST have descriptive Alt Text:

• Product photographs
• Service demonstration images
• Team member photos
• Logos (use your business name)
• Infographics or diagrams
• Before/after images
• Hero images that convey key information

Images that should have BLANK Alt Text (`alt=""`):

• Decorative borders or dividers
• Background patterns
• Spacer images
• Icons that duplicate adjacent text
• Purely aesthetic elements

When choosing the right images for your website, prioritise functional images over decorative ones. Every image with descriptive Alt Text should add information value.

Priority order for your 30-minute session:

• Homepage hero image
• Main product/service images (top 5)
• About page team photos
• Logo
• Key supporting images on your most important pages

Step 3: Apply the 125-Character Rule

Screen readers handle Alt Text best when it's concise. Aim for 125 characters or fewer (about 15-20 words).

The formula: [Subject] + [Action/State] + [Context] + [Natural keyword]

Examples by business type:

Plumber:

• Image: Photo of plumber under sink
• Alt Text: "Licensed plumber installing new kitchen tap in London home"
• Length: 60 characters ✓

Accountant:

• Image: Person reviewing financial documents
• Alt Text: "Small business accountant reviewing tax documents for year-end filing"
• Length: 72 characters ✓

Café:

• Image: Latte with foam art
• Alt Text: "Barista-made flat white with latte art at Brighton seafront café"
• Length: 68 characters ✓

NetNav Integration: Manually tracking every image across dozens of pages is tedious. Use the free NetNav SEO check for any page you update; it instantly verifies if you missed an Alt Tag before you move onto the next page.

What to avoid:

• ❌ Starting with "Image of..." or "Picture of..." (screen readers already announce it's an image)
• ❌ Repeating information from surrounding text word-for-word
• ❌ Writing multiple sentences or paragraphs
• ❌ Using special characters excessively

Step 4: Handle Decorative Images

This is where most people get confused. Decorative images should have empty Alt Text: `alt=""` (not missing Alt Text, but deliberately blank).

Why? Screen readers will skip over images with blank Alt Text, preventing them from announcing irrelevant information like "decorative-border-image-left.png" to users who can't see the page.

[MEDIA:GIF:decorative-image-code]

Caption: Example of HTML showing a blank `alt=""` tag for a purely decorative element.

How to identify decorative images:

Ask yourself: "If I removed this image, would the page lose any information or meaning?"

• If yes → Write descriptive Alt Text
• If no → Use blank Alt Text (`alt=""`)

Common decorative elements:

• Background textures or patterns
• Decorative dividers between sections
• Ornamental borders
• Icons that purely duplicate adjacent text (e.g., a phone icon next to "Call us: 020 1234 5678")

In your CMS: Most platforms let you leave the Alt Text field completely empty, which automatically creates `alt=""`. Some platforms have a checkbox for "This is a decorative image."

Step 5: Natural Keyword Integration

Here's where Alt Text connects to your broader quick SEO optimisation guide strategy. You want to include relevant keywords, but only when they genuinely describe what's in the image.

The test: Would you use this exact description if you were explaining the image to someone over the phone?

Good keyword integration:

• Image shows: Emergency plumber fixing a leak
• Primary keyword: "emergency plumber London"
• Alt Text: "Emergency plumber repairing burst pipe in London kitchen" ✓
• Natural? Yes. The keyword describes what's actually happening in the image.

Bad keyword stuffing:

• Image shows: Same plumber fixing leak
• Alt Text: "Emergency plumber London 24/7 plumbing services plumber near me cheap plumber" ✗
• Natural? No. You're forcing keywords that don't describe the image.

When keywords don't fit naturally:

If your target keyword doesn't accurately describe the image, don't force it. Write accurate Alt Text instead. You have other places to use keywords (title tags, headings, body content).

Example:

• Image: Your team standing outside your office
• Target keyword: "emergency plumber London"
• ❌ Wrong: "Emergency plumber London team outside office"
• ✅ Right: "ABC Plumbing team outside London office in Hackney"

Remember: Alt Text is primarily for accessibility. SEO benefit is secondary. Search engines are sophisticated enough to understand context without keyword stuffing.

Step 6: Implementation in Your CMS

Every major website platform has an Alt Text field. Here's where to find it:

WordPress:

• Go to Media Library or click on an image in your page editor
• Look for "Alternative Text" field in the right sidebar
• Enter your Alt Text
• Click "Update" or "Save"

Squarespace:

• Click on the image block
• Click "Edit" or the pencil icon
• Find "Alt Text" in the design panel
• Enter your text and save

Wix:

• Click the image
• Click "Settings" (gear icon)
• Select "Alt Text" tab
• Enter description and save

Shopify:

• Go to Products or Pages
• Click on an image
• Find "Alt text" field
• Enter description and save

[MEDIA:SCREENSHOT:wordpress-alt-text-field]

Caption: How to locate and fill the Alt Text field in a standard CMS media library (e.g., WordPress/Squarespace).

Bulk editing tip: Most platforms let you edit Alt Text for multiple images at once through the Media Library. This is faster than editing images one-by-one on each page.

For images already on your site: You don't need to re-upload images to add Alt Text. Edit the existing image properties in your media library, and the Alt Text will update everywhere that image appears.

Step 7: Testing and Verification

After adding Alt Text, verify it's working correctly:

Method 1: Browser Developer Tools (Most Reliable)

• Right-click on any image on your live page
• Select "Inspect" or "Inspect Element"
• Look for the `` tag in the HTML
• Verify you see `alt="your description here"`

Method 2: Browser Extensions

Install a free accessibility checker:

• WAVE (Web Accessibility Evaluation Tool)
• axe DevTools
• Accessibility Insights

These tools highlight images missing Alt Text and show you what Alt Text exists.

Method 3: Turn Off Images

In your browser settings, disable images temporarily. Navigate your site. The Alt Text should appear in place of images, and the page should still make sense.

What to check:

• ✓ All functional images have descriptive Alt Text
• ✓ Decorative images have blank Alt Text (`alt=""`)
• ✓ No Alt Text exceeds 125 characters
• ✓ No keyword stuffing
• ✓ Descriptions are accurate and helpful

Common implementation errors:

• Forgetting to save changes in your CMS
• Adding Alt Text to the image caption field instead of the Alt Text field
• Using the image title field instead of Alt Text (they're different)

You can also check for indexing issues in Search Console to see if Google is successfully crawling and understanding your images.

You've Completed This Step When:

• ✓ You've written Alt Text for your 10 most important images
• ✓ Each description is accurate, concise, and under 125 characters
• ✓ You've correctly marked decorative images with blank Alt Text
• ✓ You've verified implementation using browser tools
• ✓ Keywords are included naturally where they genuinely fit

🎉 Completed Alt Text for your essential images? You've significantly improved your website's accessibility and image SEO. This is also part of proper image optimisation alongside compression and file naming. You're ready for Internal Linking: Connect Your Pages for SEO.

---

Troubleshooting

Common Issue 1: Alt Text Not Appearing in HTML

Symptom: You've added Alt Text in your CMS, but when you inspect the HTML, the `alt` attribute is missing or empty.

Fix: You may have edited the image caption or title instead of the Alt Text field. Go back to your media library, find the specific Alt Text field (it's usually labelled "Alternative Text" or "Alt Text"), and re-enter your description. Clear your browser cache and check again.

Common Issue 2: Alt Text Is Too Long

Symptom: Your Alt Text descriptions are 200+ characters, reading like full sentences or paragraphs.

Fix: Edit ruthlessly. Remove filler words. Focus on the essential information: what's in the image and why it matters. If you genuinely need more context, put that information in the surrounding page text instead, not in Alt Text.

Common Issue 3: Keyword Stuffing Penalties

Symptom: You've included multiple keywords in every Alt Text, and your rankings have dropped or you've received a manual action warning in Search Console.

Fix: Rewrite all Alt Text to be genuinely descriptive. Remove forced keywords. Use your primary keyword in Alt Text only 2-3 times across your entire site, and only where it naturally describes the image content. Remember: accessibility first, SEO second.

---

What's Next

You've completed a critical accessibility and SEO task that most micro-businesses overlook entirely. Your images are now working for you, not against you.

Your next Blueprint action: Internal Linking: Connect Your Pages for SEO

Now that your individual pages are optimised (title tags, meta descriptions, Alt Text), it's time to connect them strategically. Internal linking helps search engines understand your site structure and spreads ranking power across your most important pages.

---

Go Deeper

Want to expand your technical knowledge beyond this core action?

• The Ultimate Small Business Website Audit Guide (2024 Action Checklist) – For a full, multi-point checklist covering all aspects of website health, including images, see our comprehensive Audit Guide.
• Technical SEO Fundamentals – If you're comfortable delving into advanced topics, this guide covers the technical elements of image SEO and page indexing.
• SEO Myths and the Reality – For a reality check on common misconceptions about image tags and SEO weight, consult our SEO Myths guide.

---

Other Get Found Guides

Continue building your search visibility with these related Blueprint actions:

• Get Your Business on Google Maps
• Create a Content Calendar in 30 Minutes
• Should You Blog? (Honest Answer)
• How Do I Rank My Local Business in Google?
• Local SEO Starter Guide
• 10 Simple SEO Fixes You Can Do Yourself

---

Final Thought

You've completed the essential Alt Text action, significantly boosting your website's accessibility and image SEO. NetNav can audit your entire site across 9 pillars in 60 seconds — see what other foundational SEO checks are needed now you're optimised for images.

Alt Text is one of those rare tasks where a small time investment (30 minutes) creates lasting value for both human visitors and search engines. You've done the work. Now your images are finally visible to everyone who matters.