Improve accessibility with more control over image alt text

<p>As part of our <a href="<https://webflow.com/blog/accessibility-at-webflow>">continued work</a> to make Webflow-built sites more accessible, we’ve made updates to how you can create, manage, and customize image alt text on your site.&nbsp;</p><p>Here’s a quick list of these updates, with more details on each below:</p><ul><li><strong>Set default image alt text directly in the asset manager</strong> to ensure they have descriptive alt text when added to your site</li><li><strong>Set images as “decorative”</strong> to specify they are not meant to be semantically “read” by screen readers</li><li><strong>Override default alt text per image instance</strong> for an extra level of control</li></ul><h2>Setting default image alt text in asset manager</h2><figure class="w-richtext-figure-type-image w-richtext-align-fullwidth" style="max-width:1000px" data-rt-type="image" data-rt-align="fullwidth" data-rt-max-width="1000px"><div><img src="<https://cdn.prod.website-files.com/64f9399ca7d13575ff21a675/64f9399ca7d13575ff21d278UZKP271NOSYoIFu69T2MC8ORi1YatTZIxRpHZKRCzLj527E-oi5GD2QboOYacAxOcNcJnnFdHbW7XJLYRqQIFtY62f7JMgk6hlZLJP7SPIrMeU-zCtzvBKhgPiDH91Oy1ezgAg.gif>" alt="Set default image alt tags directly in the asset manager."></div><figcaption>Set default image alt text directly in the asset manager.</figcaption></figure><p>Before these updates, you’d need to set image alt text each time you placed an image on your site. But since that process can get repetitive if an image appears across multiple pages, we added image alt text controls directly to the asset manager so you can set default descriptive alt text upfront.</p><p>Once these default image alt texts are set, they’ll automatically be added for an image when you place it on your site</p><h2>Setting images as decorative</h2><figure class="w-richtext-figure-type-image w-richtext-align-fullwidth" style="max-width:1600px" data-rt-type="image" data-rt-align="fullwidth" data-rt-max-width="1600px"><div><img src="<https://cdn.prod.website-files.com/64f9399ca7d13575ff21a675/64f9399ca7d13575ff21d2a3IasmGx7pkhs6ro1Ch4vZ0Wy8Ix8yKbU7bNgX75INgPI-U0BFYa0k9LYRFlu1QjF2MSJi1SDb86W0aV0fLNiyWzbwzxTab3cg4s1g-YQepHJsv9Jg8K4MvXFWbpIJWeh6HZ-5V.png>" alt="Set default image alt tags directly in the asset manager."></div><figcaption>Set default image alt tags directly in the asset manager.</figcaption></figure><p>As part of this update, we also added a new option to specify images as <a href="<https://www.w3.org/WAI/tutorials/images/decorative/>">decorative</a>, meaning they don’t add information to the content of the page. Images set as decorative will have an empty alt tag, and therefore be ignored by screen readers.</p><p>You can set images as decorative in the asset manager directly, or in the settings for each instance of an image as you place it on your site.</p><h2>Overriding default image alt text&nbsp;</h2><figure class="w-richtext-figure-type-image w-richtext-align-fullwidth" style="max-width:1200px" data-rt-type="image" data-rt-align="fullwidth" data-rt-max-width="1200px"><div><img src="<https://cdn.prod.website-files.com/64f9399ca7d13575ff21a675/64f9399ca7d13575ff21d277ZnbmFegzigIBWXIoUo1ZPPief8gJQ9sZpjGocj6nlegZ4uhbcd6px-MSCB6gxIXo-QH0NVVWXF6r6LJL6asJcCG5uJMBss2oQzqeA8WYZR6ja5IBRi3keaN8q0sZiagcCGW4v3.gif>"></div><figcaption>Override default alt tag text for each image from their settings.</figcaption></figure><p>Finally, to ensure you have complete control over alt text for each image, you can override the default values you’ve set in the asset manager on each image via their settings.</p><h2>What’s ahead</h2><p>We’re still working on updates to how alt text is handled for images within CMS collections, and will be sharing updates as we make progress on that front.&nbsp;<br></p>