მრავალენოვანი ინტერფეისები და ლოკალიზაცია

1) პრინციპები

1. ენა არ არის კანი. იცვლება ტექსტები, ფორმატები, წერილის მიმართულება, ილუსტრაციები, იურიდიული ბლოკები და ნავიგაციაც კი.
2. ჯერ გასაღებები, შემდეგ ტექსტები. ჩამოაყალიბეთ სემანტიკური გასაღებები და პარამეტრები - თარგმანები მოგვიანებით მოდის.
3. ფსევდოლოკაცია - გამოსვლამდე. დაიჭირეთ ხალიჩები, „მკაცრად გაჟღენთილი“ ხაზები და ფარული ანგლიკანები.
4. ფოლბეკი პროგნოზირებულია. 'ru-UA-ru-en'. არ არის „მშვიდი“ წარუმატებლობა.
5. უსაფრთხოება. HTML არ არის DOM- ში გადარიცხვის გარეშე; პლეიშოლდერები მხოლოდ პოზიციონალური/დასახელებულია.
6. A11y ეკვივალენტი. Alt ტექსტები, aria ეტიკეტები, აბრევიატურა - ყველაფერი ლოკალიზებულია.

2) ლოკალური სტრატეგია

სისტემური კოდები: 'language-REGION' (მაგალითად, 'pt-BR', 'en-GB').
იდაყვის არჩევანი: მომხმარებლის პროფილის კონფიგურაცია; სათადარიგო - ბრაუზერის/გეოს მანქანა (დადასტურებით).
მულტფილმის რეგიონი: განასხვავეთ ენა უფლებისგან: 'es-ES' es-MX '(სხვადასხვა კანონები/გადასახადები/შეზღუდვები).
ფოლკლორული ჯაჭვი: UI - უახლოესი ენა; იურიდიული ტექსტები მკაცრად რეგიონალური ვერსიაა, წინააღმდეგ შემთხვევაში ბლოკი და დადასტურების მოთხოვნა.

3) ინფორმაციის არქიტექტურა და შინაარსი

ძირითადი სფეროები: ნავიგაცია, CTA, შეცდომები, ფორმები, მინიშნებები, შეტყობინებები, წერილები, PDF/ბანერები.
ტექსტური გაფართოებები: რეზერვი სიგანე + 30-40% (გერმანული/ფინური). Layaut არის ელასტიური (flex/grid).
ტონი/სტილი: ბრენდის ლექსიკონი (ტერმინები, კრიტიკულ ადგილებში „ჟარგონის თარგმანის“ გარეშე).
სურათები/ხატები: თავიდან აიცილეთ ტექსტები სურათებში; თუ საჭიროა, შეინახეთ ადგილობრივი ვერსიები.

4) არქიტექტურა i18n

გასაღებები: 'domain. section. intent` → `payments. withdraw. error. insufficient_funds`.
Playsholders: დასახელებული ('{amount}', '{minutes}'), ფორმატირებულია ხაზის გარეთ.
ICU Promat Format: მრავლობითი, სქესი, კოორდინაცია.
ფაილები: იდაყვის და დომენების გასწვრივ ('/i18n/{ locale/{ domain} .json '), მონეტები იტვირთება ზარმაცი.
სერვერი/კლიენტი: უნივერსალური Rander, ლოკალი cookie + HTTP Vary.

json
{
"betslip": {
"placed": "{amount} {currency} bid accepted,"
"timeout": "Waiting for confirmation... ~ {seconds, plural, one {# sec} few {# sec} many {# sec} other {# sec}}"
}
}

5) ფორმატირება: რიცხვები, თარიღები, ვალუტა, ერთეული

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');

მცირე ერთეულები: შეინახეთ თანხები ცენტებში/კოპეკებში; ფორმატირება კლიენტზე.
შედარებით დრო: 'Intl. RelativeTimeFormat`.
ერთეულები: 'Intl. NumberFormat({ style:'unit', unit:'meter' })`.
კალენდარი/კვირა: კვირის პირველი დღე და თარიღის ფორმატი - იდაყვის მიხედვით.

6) RTL და წერილის მიმართულება

მხარი დაუჭირეთ 'dir = „rtl“' 'ar', 'he', 'fa'; გამოიყენეთ 'dir =' auto '' მომხმარებლის შინაარსისთვის.
ინვერსიული ხატები/chevron 'y; კარუსელებისა და სტეპების სარკე.
რიცხვები/ვალუტის სიმბოლოები - LTR ფანჯრები (თავიდან აიცილეთ შერეული BiDi ქაოსი).
CSS ლოგიკური თვისებები ('inline-start/end') ნაცვლად left/right.

7) ფორმები და შეყვანა

სახელები/მისამართები: დაუშვეთ აპოსტროფები/დიაკრიტიკა/ორმაგი გვარი.
ტელეფონები: E.164 შენახვა; ნიღბები - რბილი, ჩანართის მხარდაჭერით.
მისამართის ფორმატები: ქვეყნის მასშტაბით ველების რიგი; ინდექსი/სახელმწიფო შეიძლება არ იყოს.
კლავიატურა: 'inputmode', 'autocomplete' სწორი იდაყვის.
პლეიშოლდერები: მაგალითები ადგილობრივ ენაზე/ფორმატში.

8) ფსევდოლოკაცია და ტესტირება

ავტომატურად შეცვალეთ სტრიქონები 'KONESCOM- ით' '' + + 'გაფართოება' (~ 35%).
ჩართეთ ფსევდო ლოკალი dev ასამბლეაში, როგორც 'qps-ploc'.
მთარგმნელებისთვის კონტექსტის მქონე ეკრანები: პლეიშჰოლდერების განათება და გრძელი ტექსტები.
ტესტირება: მორთვა, ტრანსფერები, გადატვირთვა, „მკაცრად გაჟღენთილი“ ხაზები, RTL.

9) შეტყობინებები, წერილები, შაბლონები

წერის შაბლონი და თემა - თითოეული ლოკალისთვის; გამოყავით ტექსტები და ლექსი.
თარიღები/თანხები თემაში - ფორმატირებული იდაყვის საშუალებით.
ბმულები „შეტყობინებების კონფიგურაცია“ ყოველთვის წერის ენაზეა.
SMS: მოკლედ, მრავალსართულიანი ციტატების გარეშე; UTM - ლოკალიზაციის გარეშე.

10) უსაფრთხოება და საიმედოობა

არასოდეს განმარტოთ თარგმანი, როგორც HTML, გამოიყენეთ უსაფრთხო ჩანართები.
პლეიშოლდერები - მხოლოდ მონაცემები, არა მარკირება.
Logs/metrics არის არაპროგნოზირებადი, მაგრამ ადგილობრივი პრობლემების მოსაწყობად.
ხალხური, როდესაც თარგმანის ფაილი მიუწვდომელია, არის „მშვიდი“ (აჩვენეთ ინგლისური + ტელემეტრია).

11) პროდუქტიულობა

გადარიცხვები მარშრუტებზე/დომენებზე; წინასწარ დატვირთვა ხშირი.
Кеш CDN с `ETag`/`Cache-Control`.
მოერიდეთ გამტაცებლებს იდაყვის შეცვლის დროს - i18n კონტექსტი მემოიზაციით.

12) iGaming სპეციფიკა

დისკლეიმერები და საპასუხისმგებლო თამაში: ფორმულირებები დამოკიდებულია ქვეყნიდან (18 +/21 +, რეგულირების ორგანოები, დახმარების ხაზები).
KYC/AML: იურიდიულად სწორი ტერმინები (მაგალითად, „სახსრების წყარო“, „ბენეფიციარული მფლობელი“), შემთხვევების/დაბადების ვარიანტები.
გადახდის მეთოდები: ადგილობრივი სახელები (PIX, Papara, SEPA) და პირობები (ETA/საკომისიო) - მკაცრად რეგიონში.
კოეფიციენტები და ფორმატი: 'decimal/fractional/american' - ადგილობრივი ახსნა და მაგალითი.
იურიდიული ტექსტები: უცვლელი რეგიონალური ვერსიები; ფოლბეკის აკრძალვა სხვა იურისდიქციაზე.

13) დიზაინის სისტემის ნიშნები (მაგალითი)

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) Snippets

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: {}//empty - loadim lazy
});

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 {# notification} few {# notifications} many {# notifications} other {# notifications}}"
}

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) ცარიელი/შეცდომები/დეგრადაციის გრეისფულა

არ არსებობს გასაღების თარგმნა: ჩვენ ვაჩვენებთ ინგლისურ + ლოგიკას 'missing _ key'.
არ არსებობს ლოკალური ფაილი: ფოლკლორი და ბანერი „ინტერფეისის ნაწილი ინგლისურად“.
ძალიან გრძელი ტექსტი: მრავალსართულიანი, 'line-clamp' ადგილზე, tooltip სრული ტექსტით.

16) მეტრიკა და ხარისხის კონტროლი

Coverage% კლავიშები/იდაყვის მიხედვით (სამიზნე ევრო 98%).
Time to-Translate (TTT) ახალი გამოშვებებისთვის.
Bug rate L10n: ვიზუალური ნაჭრები, RTL დეფექტები, მცდარი ფორმატები.
Reading ease (სუბიექტური გამოკითხვა) და NPS per locale.
რეგიონების იურიდიული ვალდებულება (შესაბამისობის ოფიცერი).

17) ანტიპატერები

კოდში ხაზების შეჯამება („თქვენ მოიგეთ“ + amount + „!“) - არღვევს გრამატიკას.
ტექსტი სურათებში/ხატებში ადგილობრივი ვერსიების გარეშე.
მკაცრი სიგანე ინგლისურ ენაზე.
ქვეყნის უფლებების შეცვლა ენით (გამოიყენეთ 'es-ES' მექსიკისთვის).
HTML- ის გადარიცხვა CMS- დან შეკეთების გარეშე.
ერთი და იგივე გასაღები სხვადასხვა ადგილებში სხვადასხვა მნიშვნელობით.

18) QA ჩეკის სია

ხაზები და გასაღებები

• დასახელებული პლეიშოლდერები; არ არის cocatenation.
• ICU პლურალიზაცია/სად არის საჭირო.
• ფოლკლორული ჯაჭვი მუშაობს.

Layaut და წვდომა

• სიგანე + 30-40%; 'line-clamp', სიტყვების გადაცემა.
• Alt/aria ეტიკეტები ლოკალიზებულია.
• RTL სარკე ხატებს/ნავიგაციას; იკითხება რიცხვები.

ფორმატები

• თარიღები/ვალუტა 'Intl.' მცირე ერთეულების თანხები.
• მისამართი/ტელეფონი/სახელი - მოქნილი წესები ქვეყნის მასშტაბით.

უსაფრთხოება/შესრულება

• თარგმანები არ ასრულებს HTML; XSS გამორიცხულია.
• ზარმაცი მონეტები, CDN ქეში, ზედმეტი გამყიდველების გარეშე.

iGaming სპეციფიკა

• დისკლეიმერები/18 +/დახმარების ხაზები - იურისდიქციის შესაბამისად.
• KYC/AML ტექსტები იურიდიულად გადამოწმებულია.
• გადახდის სახელები/ETA/კომისიები ადგილობრივია.

19) დოკუმენტაცია დიზაინის სისტემაში

Разделы: i18n Tokens, Guides (ICU/Plural/RTL), Patterns (Emails/SMS/Toasts), Legal Strings per Region.
ინსტრუმენტები: ფსევდო ლოკალი, ეკრანის ეკრანის ეკრანის სკრინშოტერი, შეკვეთის ანგარიში, კლავიშების ლინტერი.
პროცესი: გლოსარიუმი, ტრანსლაციის მემორიალი, კონტექსტური ეკრანული კადრები, ენის რეპროდუქციული მშობიარობა.

მოკლე რეზიუმე

მრავალენოვანი UI არის სისტემური სამუშაო არქიტექტურის, დიზაინის, შინაარსისა და სამართლის დონეზე. მოაწყეთ გასაღებები და ფოლკლორები, გამოიყენეთ ICU და 'Intl', მხარი დაუჭირეთ RTL- ს, წინასწარ მოაწყეთ ფსევდო-ლოკალი და უზრუნველყეთ რეგიონალური ფორმულირების იურიდიული სისწორე. შემდეგ პროდუქტი იგრძნობა ახლობლად - კოეფიციენტებიდან და გადახდებიდან დაწყებული წერილებით და სერთიფიკატებით - თითოეულ ქვეყანაში და თითოეული მომხმარებლისთვის.