Koʻp tilli interfeyslar va lokalizatsiya

1) Qonunning

1. Til skin emas. Matnlar, formatlar, yozuv yo’nalishlari, rasmlar, yuridik bloklar va hatto navigatsiya ham o’zgarib bormoqda.
2. Avval kalitlar, keyin matnlar. Semantik kalitlar va parametrlarni tuzing - tarjimalar keyinroq keladi.
3. Psevdolokalizatsiya - chiqishdan oldin. Toshqinlarni, «qattiq tikilgan» satrlarni va yashirin anglikizmlarni ushlang.
4. Folbeklar bashorat qilinishi mumkin.’ru-UA → ru → en’. Hech qanday «jim» muvaffaqiyatsizliklar yo’q.
5. Xavfsizlik. Sanitayzasiz DOMga tarjimadan HTML yoʻq; pleysholderlar faqat pozitsionnыe/nomennыe.
6. A11y ekvivalentligi. Alt-matnlar, aria-yorliqlar, qisqartmalar - hammasi mahalliylashtiriladi.

2) Lokallar strategiyasi

Tizim kodlari:’language-REGION’(masalan,’pt-BR’,’en-GB’).
Lokal tanlash: foydalanuvchi profili → moslash; ehtiyot - brauzer/geo bo’yicha avto-detekt (tasdiqlangan holda).
Ko’p mintaqa: tilni huquqdan ajrating:’es-ES’≠’es-MX’(turli qonunlar/to’lovlar/limitlar).
Folbek zanjiri: UI - eng yaqin til; huquqiy matnlar - qat’iy mintaqaviy versiya, aks holda tasdiqlash bloki va so’rovi.

3) Axborot arxitekturasi va kontenti

Asosiy sohalar: navigatsiya, CTA, xatolar, shakllar, maslahatlar, xabarnomalar, xatlar, PDF/bannerlar.
Matnni kengaytirish: kengligi + 30-40% (nemis/fin). Layaut - elastik (flex/grid).
Ton/uslub: brend lug’ati (og’ir joylarda «sleng tarjimasiz» atamalar).
Tasvirlar/ikonkalar: rasmlardagi matndan qoching; agar kerak bo’lsa, mahalliy versiyalarni saqlang.

4) i18n arxitekturasi

Kalitlar:’domain. section. intent` → `payments. withdraw. error. insufficient_funds`.
Pleysholderlar: (’{amount}’,’{minutes}’) deb nomlangan, satrdan tashqarida formatlanadi.
ICU MessageFormat: koʻplik, jins, kelishuv.
Fayllar: lokal va domen boʻyicha (’/i18n/{ locale }/{ domain} .json’), changlar dangasa yuklanadi.
Server/mijoz: universal render, kukidagi lokal + HTTP-Vary.

json
{
"betslip": {
"placed": "Ставка на сумму {amount} {currency} принята",
"timeout": "Ожидаем подтверждение… ~{seconds, plural, one {# сек} few {# сек} many {# сек} other {# сек}}"
}
}

5) Formatlash: sonlar, sanalar, valyutalar, birliklar

js const nf = new Intl.NumberFormat('uk-UA', { style:'currency', currency:'UAH' });
nf.format(2000); // 2 000,00 ₴

const df = new Intl.DateTimeFormat('tr-TR', { dateStyle:'medium', timeStyle:'short' });
df.format(new Date());

const pl = new Intl.PluralRules('ru-RU');

Minor birliklar: summalarni sent/tiyinlarda saqlang; mijozda formatlang.
Nisbiy vaqt:’Intl. RelativeTimeFormat`.
Birliklar:’Intl. NumberFormat({ style:'unit', unit:'meter' })`.
Kalendar/hafta: haftaning 1-kuni va sana formati - lokal bo’yicha.

6) RTL va xat yo’nalishi

’dir =’ rtl’uchun’ar’,’he’,’fa’; foydalanuvchi kontenti uchun’dir =’auto’dan foydalaning.
Belgi/chevron’larni invertatsiya qiling; karusellar va stepperlar oynalari.
Valyuta raqamlari/belgilari - LTR oynalari (aralash BiDi xaosidan qoching).
left/right oʻrniga CSS-mantiqiy xususiyatlari (’inline-start/end’).

7) Shakllar va kirish

Ismlar/manzillar: apostrof/diakritik/ikki xil familiyalarga ruxsat bering.
Telefonlar: E.164 saqlash; niqoblar - yumshoq, qo’shimchani qo’llab-quvvatlaydi.
Manzilli formatlar: mamlakat bo’yicha maydonlarning tartibi; indeks/shtat mavjud bo’lmasligi mumkin.
Tugmalar:’inputmode’,’autocomplete’lokal uchun toʻgʻri.
Pleysholderlar: mahalliy til/formatdagi namunalar.

8) Psevdolokalizatsiya va test

Satrlarni avtomatik ravishda almashtiring "【 Ěě ~ 】’+ + +’uzaytirish (35%).
Psevdolokalni «qps-ploc» deb dev yigʻishga kiriting.
Tarjimonlar uchun kontekstli skrinshotlar: pleysholderlar va uzun matnlarni yoritish.
Sinab ko’ring: kesish, ko’chirish, to’ldirish, «qattiq tikilgan» satrlar, RTL.

9) Bildirishnomalar, xatlar, shablonlar

Xat va mavzu namunasi - har bir lokal uchun; matnlar va matnlarni ajrating.
Mavzudagi sanalar/summalar - lokal bo’yicha formatlanadi.
«Ogohlantirishlarni moslash» bogʻlamalari har doim xat tilida.
SMS: qisqacha, ko’p satrli tirnoqlarsiz; UTM - lokalizatsiyasiz.

10) Xavfsizlik va ishonchlilik

Hech qachon tarjimani HTML deb talqin qilmang, xavfsiz ilovalardan foydalaning.
Pleysholderlar - faqat maʼlumotlar, belgi emas.
Loglar/metriklar maxfiy emas, ammo treysing uchun mahalliy muammolar mavjud.
Tarjima fayli mavjud boʻlmaganda folbek - «jim» (inglizcha + telemetriyani koʻrsating).

11) Unumdorlik

Yo’nalishlar/domenlar bo’yicha o’tkazmalar chankalari; tez-tez yuklash.
Кеш CDN с `ETag`/`Cache-Control`.
Lokal almashtirilganda rerenderlardan qoching - i18n kontekst memoizatsiyali.

12) iGaming xususiyatlari

Diskleymerlar va mas’uliyatli o’yin: formulalar mamlakatga bog’liq (18 +/21 +, tartibga solish organlari, yordam liniyalari).
KYC/AML: yuridik jihatdan to’g "ri atamalar (masalan," Mablag’manbai "," Benefitsiar egasi "), kelishuv/tug’ish variantlari.
To’lov usullari: lokal nomlar (PIX, Papara, SEPA) va shartlar (ETA/komissiyalar) - qat’iy ravishda mintaqa bo’yicha.
Koeffitsiyentlar va format:’decimal/fractional/american’- mahalliy tushuntirishlar va misol.
Yuridik matnlar: o’zgarmas mintaqaviy versiyalar; boshqa yurisdiksiyaga folbekni taqiqlash.

13) Dizayn-tizim tokenlari (misol)

json
{
"i18n": {
"fallback": ["en"],
"rtl": ["ar", "he", "fa"],
"textExpansionPct": 0.35,
"screenshotHints": true
},
"typography": {
"lineHeight": { "ui": 1.4, "dense": 1.3 },
"hyphens": "auto",
"tabularNums": true
},
"layout": {
"minLabelWidth": 96,
"gap": { "sm": 8, "md": 12, "lg": 16 }
},
"a11y": {
"ariaMirroring": true,
"altTranslate": true,
"contrastAA": true
}
}

14) Snippetlar

ts import i18n from 'i18next';
import ICU from 'i18next-icu';
import { initReactI18next } from 'react-i18next';

i18n.use(ICU).use(initReactI18next).init({
lng: 'uk-UA',
fallbackLng: ['ru', 'en'],
load: 'languageOnly',
interpolation: { escapeValue: false },
resources: {} // пусто — грузим лениво
});

export async function loadNamespace(ns: string, lng = i18n.language){
const mod = await import(`/i18n/${lng}/${ns}.json`);
i18n.addResourceBundle(lng, ns, mod.default, true, true);
}

json
{
"notifications": "{count, plural, one {# уведомление} few {# уведомления} many {# уведомлений} other {# уведомления}}"
}

js const money = (v, c, l) => new Intl.NumberFormat(l, {style:'currency', currency:c}).format(v/100);
const rel = (v, unit, l) => new Intl.RelativeTimeFormat(l, {numeric:'auto'}).format(v, unit);
// money(250000,'EUR','de-DE') → 2.500,00 €

js const rtl = new Set(['ar','he','fa']);
document.documentElement.dir = rtl.has(locale.split('-')[0])? 'rtl': 'ltr';

js const pseudo = s => s.replace(/[aAeEiIoOuU]/g, m => ({a:'à',e:'ê',i:'ï',o:'ô',u:'û'}[m.toLowerCase()]        m)).replace(/([^\s])/g,'$1\u0301');

15) Bo’sh/xato/greysful degradatsiyasi

Kalitning tarjimasi yoʻq: inglizcha + logotip’missing _ key’.
Lokal fayl yoʻq: folbek va «Inglizcha interfeys qismi» banner.
Matnning uzunligi juda uzun: joyida’line-clamp’, toʻliq matnli tooltip.

16) Metrika va sifat nazorati

Kalitlar/lokallar boʻyicha% (maqsadli ≥ 98%).
Yangi relizlar uchun Time-to-Translate (TTT).
Bug rate L10n: vizual kesmalar, RTL nuqsonlari, xato formatlar.
Reading ease (subyektiv so’rov) va NPS per locale.
Hududlar bo’yicha yuridik validatsiya (komplayens cheklisti).

17) Antipatternlar

Koddagi satrlarni konkatenatsiya qilish («Siz» + amount + «!») - grammatikani buzadi.
Rasmlar/piktogrammalardagi matnlar mahalliy versiyalarsiz.
Ingliz tili uchun qattiq kengliklar.
Mamlakat huquqini til bilan almashtirish (Meksika uchun’es-ES’dan foydalanish).
CMS dan sanitayzasiz HTML orqali tarjima qilish.
Bir xil ma’noga ega bir xil kalit.

18) QA-chek-varaq

Satrlar va kalitlar

• Nomlangan pleysholderlar; konkatenatsiya yo’q.
• ICU-pluralizatsiya/jins kerak bo’lganda.
• Folbek zanjiri ishlamoqda.

Layout va foydalanish

• Kengligi + 30-40%;’line-clamp’, so’zlarni ko’chirish.
• Alt/aria yorliqlari mahalliylashtirilgan.
• RTL piktogramma/navigatsiyani aks ettiradi; raqamlar oʻqiladi.

Formatlar

• ’Intl.’orqali sanalar/valyutalar; minor birliklardan summalar.
• Manzil/telefon/ism - mamlakat bo’yicha moslashuvchan qoidalar.

Xavfsizlik/ijro

• Tarjimalar HTMLni bajarmaydi; XSS chiqarib tashlandi.
• Dangasa changlar, CDN keshlari, keraksiz rerenderlarsiz.

iGaming-spetsifikasi

• Disleymerlar/18 +/yordam liniyalari - yurisdiksiya bo’yicha.
• KYC/AML matnlari yuridik jihatdan tekshirilgan.
• To’lov nomlari/ETA/komissiyalar - mahalliy.

19) Dizayn-tizimdagi hujjatlar

Разделы: i18n Tokens, Guides (ICU/Plural/RTL), Patterns (Emails/SMS/Toasts), Legal Strings per Region.
Asboblar: psevdolokal, ekranlar skrinshoteri, coverage hisoboti, kalitlar linteri.
Jarayon: glossariy, Translation Memory, kontekstli skrinshotlar, tilda so’zlashuv.

Qisqacha xulosa

Koʻp tilli UI - bu arxitektura, dizayn, kontent va huquq darajasidagi tizimli ishdir. Kalitlar va folbeklarni tashkil qiling, ICU va’Intl’dan foydalaning, RTLni qo’llab-quvvatlang, psevdolokalni oldindan haydab chiqaring va mintaqaviy formulalarning qonuniy to’g’riligini ta’minlang. SHunda mahsulot har bir mamlakatda va har bir foydalanuvchi uchun koeffitsiyentlar va to’lovlardan tortib xat va ma’lumotnomalargacha o’zgacha seziladi.