Media Translation: How to Translate Images, Videos and PDFs on Your Website

Summarize this post with: 9 min read

ChatGPT Perplexity Grok Google AI

You translate the images on a website in two layers. First, translate the text that belongs to each image (alt text, title attributes, captions and the file name). Second, for any image with words or culture-specific content baked into it, create a localized version and serve that file only on the matching language version of the page. Videos and PDFs follow the same rule: translate what describes them, and swap the file itself when the content is language-bound.

Key takeaways

• Alt text is the part Google reads. Google calls it “the most important attribute when it comes to providing more metadata for an image” (Google Search Central), so an untranslated alt attribute is a missed ranking signal in every language.
• Only images with text, prices, local references or people-and-culture cues need a separate file. Decorative images and product photos usually don’t.
• Swap files per language by URL instead of overlaying text with CSS tricks. Each language page should reference its own image file.
• Google recommends translating file names too when you localize images.
• The fastest way to avoid most of this work is to stop putting text inside images on new designs.

Why media translation matters

Visitors notice when the words are translated and the pictures aren’t. A French pricing page that shows an English “Buy now” banner, or a German landing page with a screenshot full of English UI, reads as half-finished.

The commercial case for doing it properly comes from how people shop. In CSA Research’s 2020 “Can’t Read, Won’t Buy” survey of 8,709 consumers in 29 countries, 76% of online shoppers said they prefer to buy products with information in their native language, and 40% said they will never buy from websites in other languages (CSA Research, July 2020). An infographic, a size chart or a “how it works” diagram is product information too.

There is also a search reason. Image search and the images inside regular results are matched against the words around them. An English alt text on a Spanish page gives Google an English description for a page meant for Spanish searchers.

What counts as “media” on a website

Step 1: Audit the images that actually carry language

Start with a crawl or a quick manual pass of your top pages in the languages you already offer. Ask three questions about each image:

1. Is there text in the pixels? Banners, buttons drawn as images, charts with labels, screenshots.
2. Is there a local reference? Prices in a currency, phone numbers, addresses, date formats, measurement units, seasonal themes (a snowy “holiday” banner means July in Australia).
3. Does the image depend on culture? Hand gestures, clothing, food, colours with strong local meaning, or people who don’t reflect the market you are addressing.

If the answer is “no” all three times, the image only needs its text attributes translated. Everything else goes on a localization list, sorted by traffic.

Step 2: Translate the words attached to every image

This applies to every image, including the ones you keep:

• Write the alt text in the target language. Don’t machine-translate a keyword list; follow the same rule Google gives for English and write a short, specific description (Google).
• Translate title attributes and captions. Captions are visible body text, so they should be translated with the rest of the page.
• Translate file names. Google’s guidance is direct: “If you localize your images, remember to also translate the filenames, keeping in mind the URL encoding guidelines if you’re using non-latin or special characters” (Google). zapatillas-running-rojas.jpg tells a Spanish-language index more than red-running-shoes.jpg.
• If product or article markup references an image, the name and description around it should be in the page’s language as well.

Step 3: Create localized versions of text-heavy images

For images on your localization list:

1. Get the source files. Recreating a banner from the layered design file (Figma, Photoshop, Canva) is far quicker and cleaner than editing a flattened JPG.
2. Translate the text first, then design. Send the strings to your translator or run them through your translation tool, review them, and only then place them in the design. Expect the text to be longer; German and French headlines regularly need more room than English, so leave space or shrink the type.
3. Check right-to-left layouts. For Arabic or Hebrew, mirror directional elements (arrows, progress steps, the reading order of a before-and-after image).
4. Export with a clear naming pattern, for example pricing-banner-de.webp, pricing-banner-fr.webp, and keep the same dimensions as the original so the layout doesn’t jump.
5. Keep a register of which images have localized versions, so that when the English banner changes, the other languages are updated too.

When you redesign, make the problem smaller: put headlines in live HTML text over a background image instead of inside it. Live text is translated with the rest of the page and needs no extra files.

Step 4: Serve the right file on each language version

The localized file only helps if each language page points to it. How you do that depends on the stack:

• With separate pages per language (a multilingual CMS setup), upload the localized image in each language’s page or media field.
• With a translation layer or plugin, use its media replacement feature so the src of the image changes on the translated page while the original page keeps the original file.
• In custom code, store image references in your localized resource files, the same way you store strings.

Whichever route you use, check the rendered HTML of the translated page and confirm the <img src> and the alt attribute have both changed.

Videos and PDFs

For video, subtitles are the cheapest and most searchable option; YouTube and most video players accept a subtitle file per language. For marketing videos with a lot of on-screen text or a voice-over, a separate localized cut is better, and the translated page should then embed that version instead of the original.

A PDF brochure or manual is a separate document, so translate it as a document and upload the translated file. The link on each language version of the page should point to that language’s PDF. If you handle a lot of documents, a document translation service that keeps the layout will save manual formatting.

How ConveyThis handles images, video and PDFs

With ConveyThis, the text around your media is handled automatically: when a page is translated, the alt, title and placeholder attributes are translated along with the visible text, so every image gets a description in each language without extra work.

For files that need a local version, you enable media translation once and then swap files per language:

1. In your ConveyThis dashboard, open Settings → Show more options and, in the General section, turn on the media options you need: images, video and PDF.
2. Open the page in the visual editor, switch to the target language and click the pen icon on the image (or PDF) you want to replace.
3. Enter the URL of the localized file, ideally with the same dimensions as the original, and save.

Image replacement works for regular <img> tags and for background images set inline on an element. Video replacement covers self-hosted <video> sources and embedded YouTube players, so the Spanish page can play the Spanish cut. The step-by-step guides with screenshots are in the help centre: translate images and media and change a media file in a translated version.

Because each language lives on its own URL with hreflang tags, the translated alt text and localized files are what Google indexes for that language. See all ConveyThis features, or how the visual editor fits into a translation review workflow.

A quick media translation checklist

• Alt text, title attributes and captions translated on every language version
• Localized file names for localized images
• Text-heavy images, screenshots and banners recreated per language, starting with your highest-traffic pages
• Prices, units, dates and phone numbers in images match the target market
• RTL versions mirrored where direction matters
• Videos subtitled or replaced; PDFs translated and linked per language
• A register of localized assets so updates reach every language

For the wider picture of adapting content to each market, including tone, examples and offers, read our guide to building a content localization strategy.

Frequently asked questions

Does Google read text inside images? Don’t count on it for ranking. Google’s image guidance centres on alt text, file names and the text placed near the image, so put the words that matter in those places and in the page’s HTML.

Should I translate alt text for decorative images? Decorative images should have an empty alt="" in every language, so there is nothing to translate. Every meaningful image needs a translated description.

Can machine translation handle image text? It can translate the strings, but someone still has to place them back into the design and check the fit. Review short, visible strings like buttons and headlines by hand.

Next step

Create a ConveyThis account, translate your site, then use the visual editor to swap the images and PDFs that need a local version. Compare plans when you add more languages.