2

I understand that web safe fonts have a high chance of being install on most OS. Looking at http://www.cssfontstack.com/ shows what OS has which font installed. However, what I can't seem to find any information for is if web safe fonts are internationally safe as well, that is, will the font render in any language?

I looked at tons of international sites to look at their font stacks, and this is what I found:

From inspecting these sites, I see that each web safe font gets mapped to a font file on my OS that has the characters needed to render the language. For example, when Arial is used for a site in Hindi, I see that the font Kohinoor Devanagari is used for any missing characters from the Arial font.

So here are my questions: will a web safe font always map to a font on any OS/device that can render the language? By using a web safe font can I translate my site into any language without needing to change the font for that language?

Community
  • 1
  • 1
Steven Lambert
  • 5,571
  • 2
  • 29
  • 46

1 Answers1

2

You probably already know this, but different regions don't really have their own specific fonts. In a lot of regions websites will go with the system default font, because the language of the region is pictorial (if you thought downloading a webfont was slow, imagine downloading the entire Japanese character set)

The best you can probably do is go with a common stack of fonts that OS's have installed. Medium have a great post on how they prioritize system fonts for their UI components, and the accidental time travel they encountered on the way.

In the end, sans-serif is your friend. I once had to check how a website looked on a PlayStation Vita console on it's built in Internet Browser, which actually avoids downloading webfonts and opts instead for it's own sans-serif font, which has characters for both Latin and non-Latin based languages in one (very big) character library.

Of course, there are many cases where even in non-Latin languages English words are used instead of a local translation (brand names, acronyms) - this is often where I've seen Times New Roman bleed into Asian websites, because it was my browser's (and probably yours) default font to render in the absence of any specific CSS declaration.

If you think from the context of someone seeing a English word in the middle of a Chinese article, they're probably more likely to recognize an English word in Times New Roman than, say, Tahoma. I've even seen that some Asian Cartoons have English text in Times New Roman. While in the West that's we may find it an eye-sore, in countries that don't use latin characters any deviation from the style of the character can compromise the meaning of the word, or change it entirely.

But anyways. I'd recommend trying a leaf from Medium's book. If you feel like displaying a different font, then by all means you can, CSS is great in that respect that it will silently fall back to the next best thing. You'll never get it perfect, but as long as everyone can read your text, they'll be able be able to understand it.

P.S Always keep sans-serif at the end ;)

Kraig Walker
  • 812
  • 13
  • 25
  • So a font stack such as `Arial, sans-serif` would be safe in all languages, or are you saying that only a system UI font stack is safe in all languages? – Steven Lambert Apr 27 '16 at 14:58
  • That's pretty much the plainest, safest font stack you can have. What I'm trying to say is that any named font has the chance of not being available or even a different font. I've seen some people install certain custom dyslexia fonts on their system under names like Arial but that's pretty extreme. All web user agents will have some interpretation of a sans-serif font to use. – Kraig Walker Apr 27 '16 at 15:03