How to Add Alt Text to Images in Your Webflow Blog

HomeAboutResourcesContact

Alt text is one of those things that's easy to overlook during a build but makes a genuine difference, both for accessibility and for SEO. Every meaningful image on your site should have it.

I go through this as a standard step on every project before launch. Here's how it works in Webflow and where the common gaps are.

Why alt text matters

Alt text serves two purposes. It describes an image to screen readers, which means visually impaired users understand what's on the page. And it gives search engines context for images that they can't see directly.

Neither of those is optional if you're building a site that's meant to be accessible and rank well.

Adding alt text to images inside rich text fields

For images inside a blog post or rich text block, the process is straightforward.

  1. Open the post in the Webflow Designer
  2. Click on the image inside the rich text block
  3. A small settings icon appears — click it to open the image options
  4. In the alt text field, write a clear description of what the image shows

Write it as a description, not a keyword list. "Architect reviewing floor plans at a desk" is good. "architecture floor plans webflow design agency" is not.

Do this for every image in the post. It takes seconds per image and it's worth doing properly.

Adding alt text to CMS images like blog thumbnails and hero images

Images that sit outside the rich text body, like featured images or hero images, are controlled through CMS fields. These need a slightly different approach.

  1. Go to your Blog Posts or Resources CMS collection and open the collection settings
  2. Add a new Plain Text field and name it something like "Featured Image Alt Text"
  3. Position it just below the image field for clarity
  4. Back in the Designer, select the image element that's bound to the CMS
  5. In Element Settings, find the alt text option and bind it to the new plain text field rather than leaving it static

This makes the alt text dynamic. Each post can have its own description for the image, managed directly from the CMS item without going into the Designer each time.

Repeat this on any collection list that shows blog or resource thumbnails across the site.

What counts as a meaningful image

Not every image needs alt text. Decorative images, background textures, abstract shapes that are purely visual, these don't need describing. Adding alt text to them just adds noise for screen reader users.

Images that do need it include:

  • Photos of people, places or products
  • Screenshots that illustrate a process or result
  • Charts, diagrams or infographics
  • Any image that a sighted user would get information from

If the image was removed and a user would miss something useful, it needs alt text.

A quick audit before you publish

Before launching any site or publishing a batch of blog posts, I do a quick pass to check alt text is in place. The Webflow accessibility checker in the Designer flags images with missing alt text, which makes it straightforward to catch anything you've missed.

It's a small step but it's one of those things that separates a site built carefully from one that just looks good on the surface.

related articles

Traffic
How to Use Webflow MCP and Claude to Write Blog Posts That Rank
Traffic
Why You Should Expand Your Webflow Resource Offering in 2025
Conversion
Why Offering Free Tools Can Skyrocket Your Leads

Got a project in mind?

If you are planning a new website or feel your current one is holding you back, I’d be happy to talk it through. Whether you are an architecture practice, consultancy or finance firm, we can explore what you need your site to do, how it should support your clients and what a realistic project might look like for your team.

Get in touchAbout me

Trinity Church
14A Queen Square
Bath
BA1 2HN

HomeAboutResourcesContact
© Matt Ward 2025
Privacy PolicyCookie Policy