DEV Community

Adnan Babakan (he/him)
Adnan Babakan (he/him)

Posted on • Updated on

What are the challenges of a RTL web programmer?

Hey there community.

I was thinking about an interesting thing that I could share with you which happens to be the challenges of a RTL programmer!

Relation of web technologies with RTL languages

This is the best demonstration of how web technologies and RTL languages work together!

If the above GIF and the caption wasn't enough for you let's proceed on and get deeper!

First of all in case if you don't know what RTL is it stands for Right-to-Left and it's a direction of scripture of some language like Persian, Arabic, Urdu, Hebrew and maybe other that I don't know.

How Persian works?

So literally Persian uses Arabic alphabet with 4 extra letters which are گ, چ, پ, ژ which they sound like G in Grab, Ch in Chat, P in Pool and Su and pleasure respectively.

And Persian is written from right to left which means our books and notebooks open from left side not from right side! Strange, no? LOL

And another strange thing that happens with Arabic/Persian alphabet is that which our letters are cursively-joint which means they can change shape if they are followed by another letter or not. For example this character ب is B in English and we want to have a U which is و in Persian in front of it so it becomes Bu (means scent) this is how it looks: بو. As you see the first letter changes somehow and this can be really intense in some letters like ه which is H in English.

Hold on these aren't just rubbish information I'm gonna get back to these later in this article. XD

Charset and size

Usually when using Persian, programmers prefer to use UTF-8 as their charset and due to Persian letters' nature it takes 2 bytes per character so that's double size of English or most of Latin letters.

That's a problem about size of files.


First of all it is always about alignment that gives me headache when designing a Persian website.

The first thing I do when starting a new project is creating its layout which happens to be like below:

<!DOCTYPE html>
<html lang="fa" dir="rtl">
Enter fullscreen mode Exit fullscreen mode

So that's the first step! That's absolutely OK if it finished here already but that's just the beginning!

You people (English and other LTR language-native people) have lots of cool features and tools for designing such as frameworks!

You can use Zurb Foundation (my favorite), Bootstrap (anyone's favorite but me), Semantic UI and so on! Fortunately these framework support RTL somehow in some terms but still that is not the most compatible feeling you would get when getting in advanced stuff!

Other tools like parsers and even IDEs sometimes don't support Persian when writing some codes and GOD PLEASE HELP ME gets into my mind at that moment!

And some other tools which claim to support RTL languages fail in cursively-joint part and show the Persian/Arabic alphabet separated which is totally wrong in our terms!

URL Params

Yes, yes... This is a problem as well for Persian characters! The very simple URL params which everyone uses with no effort can be a challenge for a Persian or RTL developer!

This is my personal experience in which one day when developing using some framework me and my friend were shocked about a very strange behaviour of the web server which happened to be Apache! The problem was it was working perfectly with every query but not if it included the character ل (sounds like L in English)! Can you believe it? Only that character! So we had to search for a while to find a solution or a workaround for that!

RTL and LTR conflict

So another annoying thing is that almost 99% of tools are designed for LTR languages and they conflict with RTL languages! For instance I'm using Robo 3T for my MongoDB development and the problem I face with this tools is when editing a document if I wanted to input some Persian text the scripture goes insane! Everything works fine but the double-quote sign or the comma sign all go to left and it's really hard to keep track of what I'm writing in that situation!

No samples

In almost 50% of times the documentation that tools or libraries provide doesn't have enough enough samples, although some of them don't at all! This is the place that I get really angry first because it is a directionism (a word I just made which consists direction and ism which is intended to show the discrimination between LTR and RTL languages!) and second that poor Adnan has to look for a way to make it work!

Translation and i18n

This is the real deal! When a client asks me to translate his website it isn't the translation that bothers me! It is the transforming of the template from RTL to LTR or vice-versa that gives me stomachache (I used headache a lot). Can you believe converting all those CSS attribute from right to left? For example margin-left to margin-right and so on!!!!

A note for developers!

As a fan I beg you to add RTL support to your post editor! I wanted to translate some articles to Persian and share them here on but unfortunately I wasn't able to! And make a way of showing a post in RTL direction and you will get lots of Persian or Arabic or even Hebrew writers added to, STOP DIRECTIONISM! LOL

Please do let me know if you had the same experience or even worth in the comments section below!

Top comments (0)