Internationalization vs. Localization: The Difference Between l10n and I18n

Are you looking for a way to offer your product worldwide? Then you probably already have come across terms like “internationalization” and “localization.” Let’s talk more about these steps of taking your product global.

1. What is the difference between internationalization and localization?

The act of adapting your program so that it isn’t fixed to a single language or region is known as internationalization (i18n). Localization (l10n) is the process of including the necessary resources in your program. To support a specific language or locale. It’s beneficial to distinguish between them. Since, in theory, after your program has undergone the i18n process, you may iterate as many l10n processes as you need.

Although we use localization and internationalization in similar contexts, they have different meanings. In this article, we’ll answer these questions. And explain what distinguishes localization from internationalization and what benefits they provide.

2. Do internationalization and localization complement each other?

At least two main stages are involved in creating multilingual software. They are internationalization and localization. Designing and developing an application to support localization is internationalization. The cultural and linguistic adaption of an internationalized application for two or more markets with diverse cultures is localization.

What Is Internationalization? (i18n Meaning)

Internationalization (i18n) is the process of creating applications where your product’s code and UI are ready for localization. So there’s no need for further programmatic changes to the application to switch between languages. Internationalization focuses on linguistic, cultural, and regional viewpoints.

“Internationalization” can be challenging to spell, so that you can abbreviate internationalization as “i18n”. Where 18 represents the number of letters between “I” and “N” in the word “internationalization.”

Internalization usually starts in the early stages of project development. It’s recommended to consider localization before you start development. So later, fewer changes to the code are required. But you already have your product developed. So it would be a good idea to start with internationalization before you order your product’s translations.

With the help of internationalization, you can make the localization process more manageable. First, determine what code changes you’ll need to make to add more locales. Most programming languages and frameworks offer internationalization libraries, modules or support i18n and l10n out of the box. For example, you can read our guides on making your products multilingual for the following frameworks Node.js, CakePHP, and Django.

The internationalization process includes:

1. Providing space in user interfaces. Such as hardware labels, help pages, and online menus. You need to do it for translation into languages that need more characters.
2. Creating software that can handle worldwide character sets ( Unicode ).
3. Keep visual assets separate from code. So you can localize them for different audiences.
4. Translatable texts are not hardcoded into the software. Instead, they are stored outside the source code. So you can add translations without changing the source code. And you can retrieve texts dynamically.
5. Locale-specific data is automatically altered based on the user’s locale. It includes the date, time, and currency format.
6. Tell your code how to switch locales and where to find

We will tell you how to internalize your product and what to consider.

How to Internationalize your Software

Internationalizing software involves more than adding translations to the user-facing content. You should also change your code to switch between languages easily. And test your localization to ensure your customers would receive the same experience with your product in English and other languages. Let’s take a closer look at i18n from a developer’s perspective.

1. Use Unicode for inclusive character encoding

ASCII encoding can only support 128 symbols. It is not enough if you’re planning to support more languages than just English. It’s highly recommended that your app or website supports files in UTF-8 encoding. Unicode uses a variable number of bytes per character. For example, one letter can be stored as 4 bytes. It allows for handling multiple letters from different languages.

2. Do not hard code any text strings

We recommend you store your source texts separately from your code. One way to achieve this is by using a key-value file structure. In this case, source strings are replaced with unique IDs or keys as part of the internationalization process. The corresponding strings and keys are then saved in the resource files. Your code will use the keys to get the relevant strings from the proper files or folders with translations to display to the end-user.

Here’s an example of what JavaScript strings with keys would look like.

Code example:

$contactDialog.dialog({
  title: translate('contactDialog.RequestMessage'),
  buttons: [{
    class: 'btn',
    text: translate('contactDialog.close'),
    click: function() {
      $contactDialog.dialog('close');
    }
  }]
});

Corresponding texts in the resource file:

"contactsDialog.RequestMessage","Please share your questions and ideas. We'd assist you best if you also share what are you expecting from our product and what goals you have.","",""
"contactsDialog.close","Close","",""

Having some structure behind the way you name keys would be a good idea. For example, each key can start with the name of the page they are on, and keys used in multiple locations across your product can start with the word “universal” or something similar. For example, if you’re creating a Contact Us page on your website, all the keys on this page can start with “contact.” Here’s an example:

contact.PageTitle
contact.email
contact.name
contact.question

To store your texts separately from code, create a separate file or folder for all your localizable text strings. So you can update your strings and translations separately from your main code. You can set your primary/ source language (for example, English) as a default locale. And add new locales separately.

In most cases, you’ll choose one out of two most common ways to organize your translated strings. You can create a folder for localized texts with separate subfolders for each language. Here’s an example of the structure:

/locales
    /en
        texts.yml
    /de
        texts.yml

Or, you can organize folders by content type and add language codes to each separate file. Here’s an example:

/locales
 /main
texts-en.yml
texts-es.yml
 /users
list-en.yml
list-de.yml

Each framework or i18n library will have a standard or two for handling the file structure. So there’s no need to do it on your own.

3. Include placeholders inside strings

Make placeholders a part of your string. Because translators won’t have enough context, and thus it will influence the translation quality.

Don’t:
Code: let userButton = username + ‘ ‘ + translate(“mainMenu.profile”)
Localization file: mainMenu.profile: “profile”

Do:
Code: let userButton = translate(“mainMenu.profile”, username)
Localization file: mainMenu.profile: “{username} profile”

When it comes to placeholders, it’s best to make sure they are descriptive and will also provide context for translators. Because depending on the placeholder, the word associated with it might be translated differently.

Don’t:

“%s profile”

Do:

“{username} profile”

4. Think about the length of words in different languages

The length of translated words is a significant consideration in terms of layout and space. While English words are longer than those in most Asian languages, they are also shorter than those in German. Depending on the language you’re translating into, a translation might fit on a button or break your UI.

There is a significant problem with the localization technique. It is creating software overlaying translated terms outside the program’s theme components. Consider layout and design when writing the online text for various languages, especially those that read from right to left.

The design may be affected by translations and vice versa. Before switching to development, the Crowdin for Sketch plugin will assist in making the required adjustments, such as changing a button’s width to accommodate a Geman version or changing a template to accommodate right-to-left readers.

Also, designers may upload production-ready texts from Crowdin and use them in their XD designs with the new Crowdin plugin for Adobe XD. When using Adobe XD, designers add new source strings and send them, along with the context for translators, to Crowdin for translation.

One more solution. Design teams may create a productive localization process using Crowdin for Figma. Automate repetitive tasks, and maintain text synchronization. And ensure the translators have access to the proper context. Putting a bit less effort into what you do best—creating great designs—and concentrating more on that.

A technique for determining if the software is ready for localization is pseudo-localization. This technique displays the product’s user interface (UI) after translation. By determining if any source strings need to be changed before the translation process starts, use this capability to cut possible rework.

The internationalization process entails tailoring the program to a specific locale. It means developing applications in a way that will make localization simpler. Avoid problems with product integration for countries with other cultures. You can localize the internationalized product.

What Does Localization Mean? (l10n Meaning)

Now, you know all the basics of internationalization. At the same time, internationalization aims to make products and services adaptable to many countries. Localization (l10n) is adapting a software product to the client’s language and culture.

Localization includes:

• User interface translation
• Date and time, currency format control
• The user keyboard layout (LTR, RTL layouts)
• Interpretation of text, symbols, and signs
• Legal nuances
• And other similar aspects

Now, you have localized your product. The next step is to localize your documentation, emails, marketing communications, blog articles, and other user-facing content.

Software localization: translate and adapt your product

Localization involves making changes to your content. You do it to make it appropriate for other cultures or locales. Localization involves making software accessible to users in many languages and regions. Regardless of their native tongue, anyone in the world might start using your app, placing orders through the website, or playing the game. Consider how many extra users your software might attract. You would be more useful as a developer if you could expand the target markets for your product. That is a significant issue.

So, the localization process entails tailoring the program to a particular locale. These all interact so that everyone may use the product regardless of location. For more specifics, you can read the 5 things every developer should know about localization articles.

Localization helps you reach new markets: SCS Software case study

For example, we can speak about SCS Software company. The company SCS Software gained recognition on a global scale. Since more than 70% of SCS Software’s clients are non-native English speakers, Crowdin assists SCS Software in managing the localization of their goods and Steam Achievements into 47 languages. SCS Software invites Crowdin, a community with more than 200 members, to participate in the translation process. You can read more about the game localization experience in our case study.

Globalization VS Internationalization VS Localization

Internationalization and localization sound similar. Sometimes people even interchange these terms. Even yet, they differ. And knowing these distinctions is essential for expanding global your product.

Consider a shelf in your library that can only hold books that are 4x4 inches in size. Building the shelf with several sections of various sizes and shapes is internationalization. Additionally, localization would involve placing each book in the appropriate area. Consider the many languages, currencies, and text orientations as the books. And your database, business logic, and user interface (UI) as the shelf.

Globalization is the process of adopting a particular good or service. The aim is to meet the needs of other cultures. To localize some content, you translate it into the language of the intended audience. To ease globalization, you should translate the current material into various languages. You need to do it to make it available to various target groups.

IKEA furniture is an excellent illustration of globalization. They include diagrams in their assembly instructions for the furniture. The translation is not necessary in this case.

Both localization and internationalization fall under globalization. Localization is the process of adapting a product to a global audience. Internationalization is more concerned with structure and development.

Internationalization and localization are two critical components of an effective continuous translation process:

1. The result of internationalization is a product that is simple to localize.
2. A globally adaptable product is the result of the internationalization process.
3. After the internationalizing of the product, localization takes place. A multilingual and culturally appropriate product is the result of localization.

To sum up, the distinction between these terms is the following:

Localization (l10N) involves adapting your product or content to particular locales. Internationalization (i18n) is the process of preparing your software-based product for localization. Globalization is the process that includes bots i19n and l10n for products. The aim is to enter new markets.