Ինչպես ավելացնել բազմաթիվ լեզուներ ձեր հավելվածին կամ կայքին

Բազմալեզու հավելված ստեղծելու համար առաջին հերթին տեղափոխեք ինտերֆեյսի բոլոր տեքստերը թարգմանության ֆայլերի մեջ (մեկը յուրաքանչյուր լեզվի համար), բեռնեք դրանք i18n գրադարանով և ավելացրեք լեզվի փոխանջատիչ, որը կհիշի ընտրությունը։ Հանրային էջերի համար, որոնք պետք է հայտնվեն որոնման արդյունքներում, յուրաքանչյուր լեզու պետք է ունենա իր URL-ը, օրինակ՝ /fr/, իսկ տարբերակները կապվեն hreflang պիտակներով։ Այնուհետև անդրադարձեք այն մասերին, որոնք հաճախ մոռացվում են՝ ամսաթվերին, թվերին և արժույթներին, երկար տեքստերին որոշ լեզուներով, աջից ձախ գրվող գրերին և տվյալների բազայում պահվող բովանդակությանը։

Բառեր, որոնք կլսեք

• Internationalisation (i18n)․ կոդը պատրաստել աջակցելու ցանկացած լեզվի՝ առանց կոշտ գրված տողերի, լոկալին համապատասխան ձևաչափմամբ և ճկուն դասավորություններով։ «18»-ը տառերի թիվն է i-ի և n-ի միջև։
• Localisation (l10n)․ հավելվածը հարմարեցնել կոնկրետ լեզվին կամ շուկային, հիմնականում թարգմանությամբ, երբեմն նաև արժույթով, պատկերներով և իրավական տեքստով։
• Locale․ լեզու և, ըստ ցանկության, տարածաշրջան, օրինակ՝ en-GB կամ pt-BR։

Կատարեք i18n-ը մեկ անգամ, և յուրաքանչյուր նոր լեզու ավելացնելը հիմնականում կդառնա թարգմանական աշխատանք։

Տարբերակներ և փոխզիջումներ

Ավելի մեծ մասի հավելվածների համար հիմքը պետք է լինի ստանդարտ i18n գրադարանը թարգմանության ֆայլերով։ Եթե ցանկանում եք, թարգմանությունների նախնական տարբերակները ստացեք մեքենայական կամ AI թարգմանությամբ, ապա թույլ տվեք լեզուն տիրապետող մարդկանց վերանայել այն, ինչ հաճախորդները տեսնում են առավել հաճախ։

Բազմալեզու հավելվածի մասերը

Թարգմանության ֆայլեր

«Welcome back»-ի փոխարեն կոդում գրվում է t('dashboard.welcome'), իսկ յուրաքանչյուր լոկալ ունի ֆայլ՝ տեքստով․

{
  "dashboard": {
    "welcome": "Բարի վերադարձ, {{name}}",
    "items_one": "{{count}} տարր",
    "items_other": "{{count}} տարր"
  }
}

Փոփոխականների համար օգտագործեք տեղապահներ, այլ ոչ թե նախադասության մասեր միացնել, քանի որ բառերի դասավորությունը տարբեր է լեզուներում։ Եվ օգտագործեք գրադարանի հոգնակիի կանոնները․ անգլերենում երկու ձև կա (1 item, 2 items), իսկ ոմանց լեզուներում՝ երեք, չորս կամ ավելի։

Ամսաթվերի, թվերի և գումարների ձևաչափում

Դրանք ձեռքով մի ձևաչափեք։ Բրաուզերի ներկառուցված Intl API-ը ձևաչափում է յուրաքանչյուր լոկալի համար․ 1,234.5 անգլերենում և 1.234,5 գերմաներենում․ ամսաթվերը փոխում են կարգը, իսկ արժույթի նշանները՝ տեղը։ Ամսաթվերը պահեք UTC-ով, գումարները՝ որպես թվեր արժույթի կոդով, և ձևաչափեք միայն ցուցադրելու համար։

Դասավորություն, որ ձգվում է

Թարգմանված տեքստը հաճախ ավելի երկար է, քան անգլերենը, հատկապես գերմաներենը և ֆիններենը։ Խուսափեք ֆիքսված լայնության կոճակներից և կտրված պիտակներից, և փորձարկեք ձեր ամենաերկար լեզվով։

Աջից ձախ լեզուներ

Արաբերենը, եբրայերենը, պարսկերենը և ուրդուն կարդացվում են աջից ձախ։ Այդ լոկալների համար դրեք էջի վրա dir="rtl" և օգտագործեք CSS տրամաբանական հատկություններ (margin-inline-start margin-left-ի փոխարեն, իսկ Tailwind-ում ms-4 ml-4-ի փոխարեն), որպեսզի դասավորությունը ինքնուրույն հայելապատկերվի։ Ուղղություն ցույց տվող պատկերակները, օրինակ՝ սլաքները, նույնպես պետք է շրջվեն։

Լեզվի փոխանջատիչ և հայտնաբերում

Ցույց տվեք փոխանջատիչ յուրաքանչյուր էջում՝ յուրաքանչյուր լեզվի սեփական անվամբ («Deutsch», «Français», «العربية»), այլ ոչ թե դրոշներով, քանի որ դրոշները ներկայացնում են երկրներ, ոչ թե լեզուներ։ Առաջին այցի ժամանակ բրաուզերի նախընտրած լեզուն հայտնաբերեք՝ տարբերակ առաջարկելու համար, բայց այցելուի բացահայտ ընտրությունը պետք է գերակա լինի և հիշվի։

URL-ներ և SEO

Երբ էջերը պետք է հայտնվեն որոնման արդյունքներում, յուրաքանչյուր լեզու պետք է ունենա իր URL-ը։ 2026 թվականի սեպտեմբերի դրությամբ Google-ի ուղեցույցը բազմալեզու կայքերի համար հետևյալն է․

• Առանձին URL-ներ յուրաքանչյուր լեզվի համար․ ենթաթղթապանակները (example.com/fr/) ամենապարզն են, ենթադոմեյնները և երկրի դոմեյնները նույնպես աշխատում են։ URL պարամետրերը (?lang=fr) խորհուրդ չեն տրվում։
• Մի փոխեք լեզուն միայն cookie-ով կամ բրաուզերի կարգավորմամբ․ Google-ի crawler-ը կարող է երբեք չտեսնել մյուս տարբերակները։
• Մի արեք ավտոմատ վերահղում ըստ լեզվի․ փոխարենը կապեք տարբերակները միմյանց։
• Օգտագործեք hreflang՝ Google-ին ասելու համար, թե որ էջերն են միմյանց թարգմանությունները։ Յուրաքանչյուր տարբերակ պետք է թվարկի և իրեն, և մյուսներին, հակառակ դեպքում նշումները կարող են անտեսվել։ Ավելացրեք x-default հետադարձ էջի համար։
• Google-ը էջի լեզուն որոշում է տեսանելի բովանդակությունից, ոչ թե lang-ից կամ hreflang-ից, ուստի թարգմանեք ամբողջ էջը, ոչ միայն մենյուն։

Այնուամենայնիվ, յուրաքանչյուր տարբերակում դրեք <html lang="fr">․ էկրանի ընթերցիչները դրանով են ընտրում ճիշտ արտասանությունը, ինչը մատչելիության պահանջ է։

Մուտք գործած հավելվածի էկրանները ինդեքսավորելու կարիք չունեն, ուստի դրանց համար բավական է լեզուն պահել օգտատիրոջ պրոֆիլում։ Հանրային էջերը որոնողական համակարգերի համար պատրաստելու մասին տե՛ս SEO AI-ով կառուցված կայքերի համար։

Տվյալների բազայի բովանդակություն

Ինտերֆեյսի տեքստը ապրում է ֆայլերում, իսկ այնպիսի բովանդակություն, ինչպիսիք են ապրանքների անունները, բլոգ գրառումները և կատեգորիաները, ապրում է տվյալների բազայում։ Երկու տարածված ձև կա․

• Թարգմանությունների աղյուսակ․ product_translations (product_id, locale, name, description)։ Մաքուր է և մասշտաբավորվում է շատ լեզուների համար։
• JSON սյունակ յուրաքանչյուր դաշտի համար․ name: {"en": "...", "fr": "..."}։ Ավելի պարզ է մի քանի լեզվի դեպքում։

Որոշեք, թե ինչ լինի, երբ թարգմանություն բացակայում է․ սովորաբար վերադարձեք լռելյայն լեզվին, այլ ոչ թե ցույց տաք դատարկ տեղ։

Էլ. նամակներ և ծանուցումներ

Պահեք յուրաքանչյուր օգտատիրոջ լեզուն և օգտագործեք այն էլ. նամակների, ծանուցումների և PDF-ների համար։ Հեշտ է թարգմանել հավելվածը և մոռանալ, որ բարի գալստի նամակը դեռ գալիս է անգլերենով։

Հուշումներ, որոնք աշխատում են

Ավելացրու internationalisation react-i18next-ով։ Տեղափոխիր յուրաքանչյուր օգտատիրոջը տեսանելի տող locales/en.json ֆայլի մեջ՝ անվանատարածքավորված բանալիներով, օգտագործիր ինտերպոլյացիա և հոգնակիի կանոններ՝ տողերի միացման փոխարեն, և ձևաչափիր ամսաթվերը, թվերը և գները Intl-ով ընթացիկ լոկալով։ Դեռ մի փոխիր բառերը։

Ավելացրու ֆրանսերեն և գերմաներեն։ Հանրային մարքեթինգային էջերը ստանան /fr/ և /de/ URL նախածանցներ, անգլերենը՝ արմատում, hreflang հղումներ յուրաքանչյուր էջում (ներառյալ ինքնահղումը և x-default), իսկ html lang՝ յուրաքանչյուր էջի համար առանձին։ Ավելացրու լեզվի փոխանջատիչ՝ յուրաքանչյուր լեզվի սեփական անվամբ։ Մուտք գործած էջերի համար պահիր լեզուն օգտատիրոջ պրոֆիլում։

Ավելացրու արաբերեն՝ աջից ձախ աջակցությամբ։ Արաբերենի համար դիր dir="rtl", փոխիր ձախ և աջ եզրերն ու լուսանցքները տրամաբանական հատկություններով, հայելապատկերիր ուղղորդող պատկերակները և ստուգիր, որ ձևերն ու աղյուսակները դեռ ճիշտ են կարդացվում։

Քայլ առ քայլ

1. Ընտրեք առաջին լրացուցիչ լեզուն իրական պահանջարկի հիման վրա՝ ուր են ձեր այցելուները կամ հաճախորդները։
2. Ինտերնացիոնալացրեք կոդը․ տեղափոխեք տողերը ֆայլերի մեջ, ավելացրեք հոգնակիի կանոններ և Intl ձևաչափում։ Թողարկեք միայն անգլերենով և ստուգեք, որ ոչինչ չի փոխվել։
3. Որոշեք URL-ների կառուցվածքը հանրային էջերի համար և ավելացրեք hreflang։
4. Թարգմանեք․ սկսեք մեքենայական կամ AI թարգմանությամբ, ապա վերանայեք լեզուն տիրապետող մարդու հետ։ Տվեք թարգմանիչներին համատեքստ․ «Book» բառը մի էկրանին գոյական է, մյուսում՝ բայ։
5. Թարգմանեք տվյալների բազայի բովանդակությունը և սահմանեք հետադարձ արժեքներ։
6. Լոկալիզացրեք մնացածը․ էլ. նամակները, սխալի հաղորդագրությունները, իրավական էջերը և տեքստով պատկերները։
7. Փորձարկեք յուրաքանչյուր լեզու հեռախոսի լայնությամբ, իսկ եթե կիրառելի է՝ աջից ձախ ուղղությամբ։
8. Սահմանեք գործընթաց, որպեսզի նոր ֆունկցիաները թողարկվեն թարգմանություններով, ոչ թե ամիսներ անց։

Սովորական սխալներ

• Նախադասությունների միացում ("You have " + n + " messages"), որը կոտրվում է այլ լեզուներում։
• Կոշտ գրված տեքստ կոմպոնենտներում, սխալի հաղորդագրություններում և վավերացման տողերում։
• Ամսաթվերի և գների ձեռքով ձևաչափում։
• Դրոշներ լեզուների համար և ավտոմատ վերահղումներ, որոնք մարդկանց թակարդում են սխալ տարբերակում։
• Մեկ URL բոլոր լեզուների համար այն էջերում, որոնք պետք է ինդեքսավորվեն։
• Բացակայող hreflang հետադարձ հղումներ, որ Google-ը անտեսի նշումները։
• Թարգմանել միայն ինտերֆեյսը, բայց ոչ բովանդակությունը, կամ հակառակը։
• Չվերանայված մեքենայական թարգմանություն գնագոյացման, իրավական և վճարման էջերում։

Բազմալեզու ստուգաթերթ

• Տեսանելի տողերը կոշտ գրված չեն, օգտագործված են հոգնակիի կանոններ և տեղապահներ
• Ամսաթվերը, թվերը և արժույթները ձևաչափված են Intl-ով
• Լեզվի փոխանջատիչը յուրաքանչյուր էջում է՝ բնիկ անուններով, ընտրությունը հիշվում է
• Հանրային էջերի համար առանձին URL-ներ, առանց պարտադիր վերահղումների
• hreflang յուրաքանչյուր տարբերակում, ներառյալ ինքը և x-default
• html lang (և dir="rtl"՝ անհրաժեշտության դեպքում) յուրաքանչյուր էջում
• Տվյալների բազայի բովանդակությունը թարգմանված է՝ նորմալ հետադարձ արժեքներով
• Էլ. նամակները և ծանուցումները ուղարկվում են օգտատիրոջ լեզվով
• Հաճախորդներին տեսանելի տեքստը վերանայված է լեզուն տիրապետող մարդու կողմից

Բազմալեզվություն Mythex-ում

Mythex-ում լեզուներ ավելացնում եք չաթում՝ խնդրելով, առանձին թարգմանական վահանակ չկա, ուստի վերևի հուշումները աշխատում են այնպես, ինչպես գրված են։ Նախ կատարեք internationalisation քայլը և ստուգեք Preview-ում, նախքան լեզուներ ավելացնելը․ դա մեծ վերամշակում է, իսկ չաթի checkpoint-ը տալիս է վերադարձի կետ, եթե ինչ-որ բան կոտրվի (չաթ և checkpoint-ներ)։ Եթե ցանկանում եք, որ հավելվածն ավտոմատ թարգմանի բովանդակությունը AI-ով կամ թարգմանության API-ով, դա օգտագործում է ձեր սեփական API բանալին, որը պահվում է նախագծի կարգավորումներում (միջավայրի փոփոխականներ և գաղտնիքներ)․ LLM API-ների օգտագործումը բացատրում է արժեքը։ Երբ լեզուները պատրաստ լինեն, նորից հրապարակեք։

Հարցեր