Обычно это разруливается на уровне шаблонизатора.
Ты верстаешь как обычно, но в местах, где тебе нужно вставить текст, ты будешь вставлять плейсхолдер.
Потом, в отдельном файле, в зависимости от шаблонизатора, будут перечислены сопоставления плейсхолдер->текст
Шаблонизатор потом уже либо сгенерирует тебе N файлов для разных языков, и тебе нужно будет на стороне веб-сервера разрулить, какие файлы отдавать, либо этим будет заниматься бэкенд, либо фронтовый фреймворк.
Код в итоге будет что-то типа:
index.html:
<div>
<p>{{text}}</p>
</div>
i8n/ru.json:
{
"text": "Привет мир!"
}
i18n/en.json:
{
"text": "Hello world!"
}
i18n/es.json
{
"text": "Hola mundo!"
}
Но если у тебя появляются динамические данные, нужна поддержка right-to-left языков, и вообще нужна адаптация под разные регионы (типа чтобы условный Американец и условный Китаец получали разный UX), то всё будет немного сложнее. Гугли дальше по словам "Интернационализация" и "Локализация"
