Avatar

Displaying the forum in languages written from right to left (Development)

by Auge ⌂, Tuesday, August 13, 2024, 10:56 (39 days ago) @ Abdus_salam

Hello

As first a few explanations.

- UI: user interface, the forum controls and elements
- ltr: left to right writing direction
- rtl: right to left writing direction

When Abdul Salam provided the arabic translation he also showed a testing installation in arabic language. The presentation of the forum in the Arabic language, which is written from right to left, was horrible to say the least.

[image]

An example from the project forum: as one can see, the sidebar partially overlaps the thread tree.

---

[image]

A thread tree of postings in a left to right written language in a forum with a UI in a left to right written language.

---

[image]

The same thread tree of postings in a left to right written language in a forum with a UI in a right to left written language.

The indentation of a thread tree does not work. Additionally the order of the elements of an entry (subject, author, optional marking of registered users, time and function icons) does also not work as intended. Please also note the dotted line on the left-hand side and – in addition to the position – the direction of the angled arrows.

---

[image]

This is the page header of the project forum. It looks surprisingly good but also here are some (smaller) issues. The structure of the operating elements should (not only here) be mirror-inverted to that in languages written from left to right. Also the position of icons for links should be mirror-inverted and margins and paddings should follow the writing direction. However, all this is not the case in the current forum version.

---

I began to solve many of the issues. As mentioned elsewhere, it is possible to replace direction-based subfeatures of margin, padding, border and positioning (top, right, bottom and left) with so called logical properties. And so I started.

---

[image]

This is the page header of a testing forum, directed to use right to left writing direction for the UI. Its version is 20240729.1, not any 2.4.x version, as the forum name claims. The position of the elements is mirrored. Margins and paddings use logical properties where necessary. Icons moved to the starting position of a link text. This works in both writing directions out of the box. Additionally I had to mirror the images of a few icons (as you can see from the mirrored arrow on the right-hand side).

---

[image]

After replacing direction-based margins and paddings with their logical counterparts and replacing a few more icons with their mirrored counterparts, the thread tree looks far more better.

At this point I found additional issues with automatisms of the browsers. As mentioned before, the order of the elements of an entry in the thread tree is not displayed as intended, if the displayed elements are mixed from right-to-left and left-to-right written languages (this is no issue in case of the UI and the content using the same writing direction).

The browsers recognise the writing direction of the individual text sections and apply the relevant rules. After some experiments I learned the following. If all elements are from one writing direction and it's the same writing direction as the UI, the order is correct: This is subject - name, optional registered marking, time, function icons or mirror-inverted for rtl-languages.

If I add the attribute dir="ltr" to a subject, written in a ltr-language, in a forum, that is generally using dir="rtl", the CSS-rules for writing-direction-aware padding are moving the subject into the wrong direction (over the icon in front). Furthermore the authors name stays in the wrong position. After removing the attribute and adding it to the element with the authors name in it, the order of the elements is correct.

---

[image]

Screenshot of the same thread tree with attribute dir="ltr" applied to the elements for the authors names in a ltr-written language (don't ask me why the (R) is on the wrong side of the authors name in the first line). Nice, with a but. It's done here manually by changing the HTML-structure in the browsers site inspector. An automatism does not exist and it is questionable, if it is worth the effort for such an edge case.

It is also questionable whether forum users can be required to indicate the direction in which their own username is written. Many would probably not enter it in their user data and unregistered posters would not even be able to do so. Automatically recognising the spelling direction from the alphabet used for the user name also has its limits with writing systems that are not widely used and therefore cannot be taken into account in a possible automatism.

Again: In a forum with content in languages, written in one writing direction with a UI, using the same writing direction, such hypothetical tweaks are unnecessary.

At the end: when ready, the forum will be far more better usable in languages, written from right to left.

Tschö, Auge

--
Trenne niemals Müll, denn er hat nur eine Silbe!


Complete thread:

 RSS Feed of thread