3 Key Things to Consider When Designing an Arabic Font and Typeface

Ghassan Zakaria
Mar 12 2014
Digital Media
3 Key Things to Consider When Designing an Arabic Font and Typeface
Share this article

Arabic typography on web and mobile applications have went through “bad experiences,” but “bad experiences are the key to finding solutions,” as Huda Abi Fares, font and graphic designer, said while presenting a workshop on Arabic typography for mobile apps during ArabNet Beirut 2014 Design+Code day.

In the workshop she held alongside Fawzi Rahal—one of her former students—the prominent member at Khtt Foundation in Amsterdam highlighted important things every designer should take into consideration when designing an Arabic typeface.

1. Legibility

The first thing to think about when designing a typeface is its legibility, especially when designing for the smaller screens of mobile devices. To achieve that, there are a few things to keep in mind:

- People read best what they’re used to reading. Using an ultra-modern typeface that doesn’t resemble anything people are used to read could alienate users and make it more difficult for them to read text. That, however, depends on your target audience. The right typeface differs from an app that is directed at newspapers readers to another aimed at TV watchers.

- Fonts shouldn’t be too light or too thin. A certain degree of thickness is needed for a good typography. But fonts shouldn’t be too thick either, not to confuse readers by losing distinctions between letters.

- No need for unnecessary details. Fonts that are too calligraphic, with too many details, might look good on paper or on a poster, but not on screen. Reading off screens should be spontaneous and easily done; simple looking letters are ideal as they are easy and fast to read.

- Fonts should be compact horizontally and vertically. When designing for smaller screens, you have a limited visual space, and comfortable reading means less scrolling; therefore, letters should be as compact, vertically and horizontally, as possible without losing distinctions.

- Modulate stroke thickness. Though screen fonts should contain as little detail as possible, some detail, such as dots and accents, are mandatory. Modulating stroke thickness could be very useful to preserve these details.

- Keep the counters open. Small or tight counters may deform letters and make reading a difficult experience. Keep them open and definable.

- Design for the worst-case scenario. If you’re a designer, you probably have a good screen to test your work on. Users, on the other hand, may not. Keep that in mind and design fonts that would be legible on low-res or poorly-lit screens.

- Contrast is a priority. Contrast is one of the most important factors in legibility. Use different colors for the background and the typeface. However, when using white typeface over dark backgrounds, such as black, text tends to glow; lighter typeface could reduce the glowing.

2. Using color as a tool

Color can be a powerful tool when designing typography, especially in Arabic. Arabic web fonts do not have proper italics. The Arabic language does not contain options like separate letters, capital letters, small capital letters, etc. Aside from the obvious use of color as a legibility tool, you can use it for better information architecture; different colors for different information is a good way of clearing your information hierarchy.

That, of course, depends on the subject, nature and targeted audience of your design. Sometimes, information hierarchy is better illustrated using sizes, weights or even typefaces to separate headings from body text, or comments from quotes, etc. In many cases, however, using a different color for a heading, or for an important quote, can be a more powerful way of sorting the information your design is about.

The aesthetic value of colors, with the right harmony and the right contrast, cannot be neglected, or even understated. To keep your aesthetics attractive, don’t go overboard with using colors. Too much colors tend to be distracting, especially in text. Usually, two carefully picked colors would be enough if used well.

3. Don't forget to add your touch

Every design project has specifics. A good designer understands what his/her project is about and finds the most beautiful way to convey information clearly. The human factor cannot be understated when designing typeface, or anything else for that matter. Always build your work on what you’re designing and who you’re designing it for.

Last but not least, remember “as a general rule,” Huda Abi Fares says, “less is definitely more!”

Huda Abi Fares and Fawzi Rahal at the Design+Code day