Skip to main content

Browser Translations Don’t Touch Alt Text


If your site’s multilingual, you need to sort alt text properly. Here’s how.

Saw a post about this and it’s bang on.

When you use browser translation (like Chrome’s built-in translate), it changes the text on screen — but not the alt text behind your images.

That’s because browsers treat alt text as metadata. It’s not in the DOM the same way as visible content, so it gets ignored.

Which means a translated page still has English image descriptions. Not great if someone’s using a screen reader in their own language.

What That Breaks

  • Someone on a translated page using assistive tech hits alt text they can’t understand
  • Image meaning gets lost
  • Content feels disjointed or broken

It’s not a bug. It’s just something devs and content teams often don’t realise.

What You Should Do (CMS or Not)

If you’ve got a proper CMS:

  • Store alt text in your translation files
  • Make sure image fields are translatable
  • Pull in alt text with the rest of your copy per language

If you don’t:

  • Create language-specific includes or partials for images
  • Use a proper i18n setup in your static site generator
  • Keep alt text in your translation JSON, YAML or whatever you use
  • Treat it like any other bit of UI text

Either way, the fix is the same: don’t hardcode it. Don’t treat it like something separate. If your site has alt text in English and everything else in Spanish, something’s off.

How to Test It

  • Load your site
  • Let Chrome auto-translate to another language
  • Turn on NVDA or VoiceOver
  • Tab through and listen

If the page reads fine, but the images are still described in English, you’ve got a gap.

Final Thought

Alt text is part of the content. If you’re translating your site, translate all of it.

Not just what you can see.