Bidirectional Languages and User Experience

Mon, 04 Nov 2019 18:26:30 GMT

The process of localizing a CMS into Arabic is not simple. It requires additional steps before and after the translation process. This first article will be an introduction and will include an agenda about the main topics to follow.

This is a comprehensive introduction to this large topic as I will identify some related terminologies like Internationalization (i18n), Localization (L10n) and Globalization (g11n):

Briefly, both Internationalization and Localization represent the overall process of adapting a product to work efficiently in different languages. While the Internationalization (i18n) process concerns the design and the structure of the product. Localization (L10n) is the process of adapting already internationalized content into a specific language. One more difference between these processes is that internationalization has to be done only once as the localization can be done several times.

As defined by LISA, Internationalization (i18n) is the first phase and includes the Design, Development, and Testing of a product. Then the second phase is Localization (L10n) which covers Translation, Testing / QA and Local Marketing of the product.

Bidirectional Languages and User Experience (UX):

For several years I have been working on localization Episerver projects for MENA countries. The dominant language spoken in this region is Arabic. A language that confuses many non-Arabic speakers who are working here. Especially the marketing and sales departments who work with Content Management Systems. These countries mostly rely on foreign expertise with their ambitious mega projects. It has become crucial to understand this language in-depth as it affects important business aspects such as content management, digital marketing, sales and most importantly customer experience.

We know that almost all languages worldwide write from left to right (LTR). Only a few languages that write from Right to Left (RTL) like; Arabic, Aramaic, Azeri, Dhivehi/ Maldivian, Hebrew, Kurdish, Persian, and Urdu.

When we say Right to Left language this means that the writing starts at the right-hand side of a page and concludes at the left-hand side as seen below:

As in the above screen, an Arabic word consists of a set of contiguous characters. An Arabic sentence is a set of words with a space between them and ends by a full stop.

One point that confuses non-Arabic speakers is that despite the text is written from right to left, the numbers stay exactly like the English: From Left to right. This fact has a great technical impact during the developing of Episerver templates. If you do not apply this concept correct, numbers like phones, prices, etc… will not be able to display correctly, which is crucial. In the next article, I will provide more examples and solutions on how to solve these issues.

Furthermore, Companies in the MENA region may choose to use Hijri or Gregorian Calendar: A question that must be asked during the Internationalization phase of the product.

Also, you must consider Culture-specific content during the early phase of development. And in some cases, not all content in English is suitable to be displayed for the Arabic audience. This means that an Arabized application must provide options to manage such cases. Such as Admin or Author options from within the application, that doesn’t require the need for any future re-engineering.

And before concluding this article, I have to mention one more important feature which is Episerver Search. A good search option provides a better User Experience. Usually, The search feature handles queries in English or other Latin Languages. But searching using bidirectional keywords requires technical adjustments that need to be anticipated during the design phase for the Front end as well as the Database layer.

Feel free to leave a comment or to Contact Me for an open discussion!

Episerver Languages add-on 2019

Mon, 04 Nov 2019 10:19:26 GMT

Now, you can translate your Episerver Digital Marketing platform content using Episerver Languages add-on. This smart and free add-on is able to export your content in a clean format (XLIFF) in just a few clicks. Also, you can easily import back your translation using the Episerver Languages add-on with the Episerver Project approach. It requires a separate installation but no additional license.

Here is a step by step Installation guide. The installation is simple but technical background is required with the first time installation.

Installation:

Download and install the latest Episerver Languages add-on from the following URL: Episerver NuGet

Second, make sure your current Episerver components, Core and UI, are compatible with the languages Add-on. If not, select an older version from the list on the same page:

Your technical team will have to install the Nuget using Microsoft Visual Studio as recommended by Episerver. For more details about this part please check: Episerver WebHelp

What are the functionalities and benefits of this smart Episerver Languages add-on?

On a multi-lingual Episerver website, it helps you easily manage the enabled languages and related translations workflow.
It integrates with Episerver Project, in order to manage localization projects from one central place.
It exports the content into XLIFF format (XML Localization Interchange File Format) which is the worldwide standard format for translation recognized by all the Translation CAT tools like SDL Trados.
By testing this tool in detail; including the exported XLIFF files, I found that it exports the content in a very clean way without grabbing any non-relevant content such as code, HTML or CSS. This makes these files ready for automated Engineering preparation without any additional rounds of preparation. Therefore, you will save a lot of time and effort and will reduce the localization costs.
The tool provides the option to select the current node only, the current node and/ or sub-nodes. Further, it gives the user the option to export any related content of this page such as blocks: This is a great feature and it overcomes a challenge that other localization tools faced before.

Step by Step: How to Export and Import Content in a few easy steps

Pre-requisites:

If it is a new instance, make sure you already enabled the target languages and the Languages inheritance from Root to subpages. This is set to be up correctly.

Steps:

Once the Add-on is installed, go to your CMS Edit mode. Click the wheel in the top right corner and click Add Gadget.

Then, select All from the left column and Languages from the middle one.

The Gadget will be installed below the Pages Tree as following:

Now to translate a Page, select the page from the pages tree and then check the Languages Gadget. You will see something similar to the screen below (For demo purposes I am using Swedish and Arabic).

As you can see in the above screen, the selected page has the English US as the Master Language and there are 2 other languages available BUT NOT yet created. The next step is to click Create

As you can see you have 3 options now:

Auto-Translate from English (which needs an additional step from the Admin module in order to use an Auto-translate service like Google.)
Duplicate the content (which means that the content from the English page will be copied to the target language)
Start with a blank page. This is useful if the content in the target language will not be identical in comparison with the English.

You can select any of the options based on your business needs. For demo purposes, I selected the second choice. Now, the language record will show that a new version in Draft mode is created in the target language (in my case Swedish) See below:

Now, go to the most right corner of the record and click the arrow there. You will see the following options:

What we need to check on the above popup, is the option number 3 Add to Translation Project. Click this one and the following popup will be displayed:

Important: You need to have an Episerver Project available

Now Select a project, whether you need the sub-pages or not and also if you want related contents like blocks etc… and click OK

Now, go to your project. It should appear in the bottom left of your page

From the top right corner, click Options

You can now see options like Download and upload Translation Packages

In a just few steps, you will be able to localize your content in a very smooth way.