Multilingual Website Design: Multi-Language Websites with hreflang, Localization and Translation Workflows

Updated September 2026 · Written and maintained by the Progression Agency strategy team

Progression Agency provides multilingual website design for companies, institutions and brands that serve customers in more than one language across the United States and worldwide: a URL structure and hreflang setup search engines understand, a translation workflow (WPML, Weglot, Crowdin, Lokalise, Phrase or Webflow Localization) that keeps every language current, localized design for text expansion, right-to-left scripts and regional formats, and a multi-language website your team can run without a developer.

What multilingual website design covers

Multilingual website design is the planning, design and build of a website that serves its content in two or more languages, and often to two or more regions: a US company selling into Latin America and Europe, a school district serving Spanish- and Chinese-speaking families, a hospital system, a tourism board, a SaaS product with customers in a dozen countries, or an ecommerce brand with regional stores. It includes the language and region model, the URL structure, hreflang and canonical rules, the translation workflow and tools, localized design, and the governance that keeps every language current after launch.

The distinction that matters is language versus locale. English for the United States and English for the United Kingdom are one language and two locales, with different spelling, currency, dates and legal text; Spanish for Mexico and Spanish for Spain are the same. A multi-language website design that models only languages cannot serve regional pricing or compliance; one that models locales can. We decide the model at discovery, because everything else depends on it. The search side of the same problem is covered in international SEO and the hreflang guide.

What a multilingual website must get right

The table below is the checklist we build against. Most of the items are invisible to visitors and decisive for search engines and for the team maintaining the site.

URL structure: subdirectory, subdomain or country domain

Subdirectories (example.com/es/, example.com/de/) keep one domain’s authority, one hosting setup and one analytics property, and they are the default we recommend. Subdomains (es.example.com) split authority for little gain. Country-code domains (example.mx, example.de) are the strongest geotargeting signal and the most expensive to run, justified when a company has separate legal entities, stores or teams per country. The choice is made once and is painful to change, so we make it at discovery with the search team.

hreflang, done correctly

hreflang tells search engines which language and region each page version serves. Google’s documentation on localized versions requires that every version list every other version including itself, that codes use ISO language and optional region values, and that an x-default version is named for unmatched users. Most multilingual sites get this wrong through partial translation: a page exists in English and German but hreflang claims French too. We generate hreflang from the content model, so a page only claims the versions that exist and publish.

Human translation, machine translation and review

Machine translation has become good enough to draft, and not good enough to publish unreviewed on the pages that carry the brand, the offer or a legal obligation. Google’s spam policies name text translated by an automated tool without human review as an example of scaled content abuse, so unreviewed machine output is a search risk as well as a brand risk. Our workflow: professional human translation for the home page, product and service pages, pricing, legal and forms; machine translation with in-language review for the long tail; and a glossary and style guide per language so terms stay consistent. The tools (Crowdin, Lokalise, Phrase, Smartling, DeepL with review) fit that workflow.

Localized design, not translated layouts

German runs roughly a third longer than English, Chinese and Japanese are shorter and denser, Arabic and Hebrew read right to left, and Thai and Hindi need fonts with the right glyphs and line heights. A design system that sets width limits, tests every component at 35 percent expansion, mirrors layouts for right-to-left scripts and specifies fonts per script avoids the broken buttons and truncated headings that mark a translated site. Dates, numbers, currencies, addresses and phone formats follow the locale, not the developer’s habits.

Pages and structure for a multilingual website

Platform choices for multilingual websites

WordPress with WPML or Polylang is the most flexible option for a content-led multilingual site: real translated pages, translated metadata and structured data, editor workflow and integration with Crowdin, Lokalise or Phrase. Weglot adds languages to almost any site quickly as a translation layer, with machine drafts and a review dashboard, at a subscription that grows with word count and languages. Webflow Localization gives Webflow sites native locales and translated pages. A custom Next.js or Astro build with a headless CMS (Contentful, Sanity, Storyblok) and an i18n library (next-intl, i18next) suits products and platforms with many markets and app-like interfaces. Shopify handles stores through Markets and its Translate & Adapt app. Compare CMS trade-offs in best headless CMS and headless vs traditional CMS.

Integrations and tools for multilingual sites

Governance after launch

Multilingual sites decay when the English changes and the other languages do not. We set a rule at launch: no page is published in the source language without a translation task created, a translation owner per language, and a monthly report of untranslated and outdated pages. The translation tool enforces the rule; the report makes it visible.

SEO and AI search across languages

Each language is its own search market with its own competitors, keywords and phrasing. A translated keyword is rarely the term people actually search, so we research keywords per language and per region, write titles and descriptions natively, and translate structured data and alt text. AI assistants answer in the language of the question from pages written in that language, so a Spanish page that states the offer plainly is what gets quoted for Spanish questions. Search Console is set up per language and region so rankings are measured where they happen. See international clients and how we work worldwide for the service context.

• Keyword research per language and region, not translated keyword lists.
• Native titles, descriptions, headings and alt text in every language.
• hreflang generated from the content model, with x-default, so claims match what exists.
• Canonical tags per language version, never pointing every language at the English page.
• Localized structured data, including Organization, Product and LocalBusiness data with regional details.
• Translated sitemaps or a sitemap with hreflang annotations, submitted per property in Search Console.

Language detection and the switcher

Search engines and travelers must be able to reach every version, so we never force a redirect by IP address or browser language. The site may suggest a version with a dismissible banner, remembers the user’s choice, and offers a switcher on every page, labeled in each language’s own name (Deutsch, not German), linking to the same page in the other language rather than to the home page.

How we design and build a multilingual website

1. Discovery: markets and languages, the locale model, existing translations and translators, the CMS, legal and pricing differences by region, and the current site’s traffic by language.
2. Content audit: which pages are translated where, what is outdated, which content should be human-translated, machine-drafted or left in the source language.
3. Structure: URL strategy, hreflang and canonical rules, the language switcher, translated navigation, and the content model that carries language and locale.
4. Design: a design system tested for text expansion, right-to-left layouts, script-appropriate fonts and locale formats.
5. Build: the platform and translation plugin or layer, translation tool integration, hreflang generation, translated metadata and structured data, forms and emails in every language.
6. Translation: glossary and style guide per language, human translation of core pages, machine drafts with review for the long tail, in-language QA.
7. Launch: redirects per language, hreflang validation, Search Console per property, speed checks, analytics by language.
8. After launch: the governance rule, monthly untranslated-page reports, per-language keyword growth and new markets added on the same model.

What multilingual website design costs

Planning figures for US organizations, driven by the number of languages and locales, the amount of content, the platform and the share of human translation. Translation itself is billed per word by language pair and is budgeted separately; as a planning figure, professional human translation runs $0.10-$0.30 per word. Read website development cost for what the build lines contain.

Multilingual website design by organization type

Companies selling into new markets

A locale model with regional pricing, legal text and contact routing; core pages human-translated; a per-market keyword plan; and a sales process that can answer in the language the site invited. Often paired with corporate website design.

Schools, hospitals and public institutions

Languages chosen by the community served, with the critical pages (enrollment, safety, patient information, notices) translated by people and kept current; plain-language writing in every version; accessibility maintained across languages. See school website design and healthcare website design.

SaaS and software products

The marketing site, the app and the docs in the same languages, string files managed in Lokalise, Crowdin or Phrase, continuous localization on each release, and pricing pages per region.

Ecommerce brands

Shopify Markets or a headless commerce build with per-market catalogs, currencies, taxes, shipping and legal text, product names translated by people and descriptions machine-drafted with review.

Tourism, hospitality and travel

Languages chosen by visitor origin, booking flows translated end to end including confirmations, and localized imagery and cultural references. See travel website design and hotel website design.

Nonprofits and membership organizations

A few languages done well: donation and membership flows translated end to end, stories localized rather than translated word for word, and volunteers who review in each language.

What to gather before a multilingual website project starts

• The list of target languages and regions, with the reason for each and the default.
• Existing translations, glossaries, brand names that must not be translated, and the translators or agencies already used.
• Legal, pricing, shipping and compliance differences by region.
• Traffic and revenue by country and language from analytics.
• The CMS in use and its translation capabilities or plugins.
• Which pages must be human-translated, which can be machine-drafted with review, and which stay in the source language.
• Fonts and brand assets with the glyph coverage each script needs.
• Forms, emails, notifications and error strings that users meet.
• The people who will own each language after launch.
• Search Console and analytics access, and any existing hreflang or country domains.

Measuring a multilingual website after launch

• Traffic, leads and revenue by language and region.
• Rankings for per-language keywords in each target country.
• hreflang errors and untranslated pages, reported monthly.
• Language switcher use and the share of users who change language.
• Form completion and checkout rates per language, which reveal untranslated strings.
• Translation turnaround time from source publication to every language live.
• Support inquiries that arrive in a language the site does not serve.
• Page speed per region, including markets far from the hosting location.

Mistakes that break multilingual websites

• Machine translation published without review on the pages that carry the offer, the brand or a legal obligation.
• hreflang that claims versions that do not exist, or omits itself or x-default.
• Canonical tags pointing every language at the English page, so only English ranks.
• Forced redirects by IP that hide versions from crawlers and strand travelers.
• A switcher that sends users to the home page instead of the same page in the other language.
• Flags as language labels: a flag is a country, not a language.
• English strings left in forms, emails, validation and the checkout.
• Layouts that break under German text expansion or Arabic right-to-left reading.
• Translated keyword lists instead of per-language keyword research.
• No owner per language, so every language but English decays within a year.

Translation layer, plugin or custom build: which fits

How Progression Agency builds multilingual websites

We design and build multilingual websites from New York City for companies, institutions and brands across the United States and worldwide: locale models, hreflang and URL strategy, WordPress, Webflow and headless builds, translation tool integration and the governance that keeps every language current, with international SEO and maintenance afterward. Related: corporate website design, the hreflang guide, global marketing agency and website migration services.

Frequently asked questions