Unexpected Side Effect of CSS in Multilingual Sites

Sometimes absolutely harmless actions can lead to totally unexpected conclusions. This is what happened to me when I accidentally translated Web Scheduler from English to Russian using Chrome's Translate functionality.

Back in 90s we used to construct navigation of web sites using tables and GIF images. We would either draw those images ourselves (the cheap and ugly way) or order them from professionals as part of overall look and feel of the application. Each image would represent a navigation link such as Home, Products, Contact Us, etc. Back then (I sound like my grandad, don't I?) the notion of styles was just emerging and you had to force-load your fonts into user's machine if you wanted any level of UI consistency on the client. So, graphics served us fine for a while. Then browsers became soficticated enough to render most of the UI the way we wanted them to. CSS ruled the Internet [well, they still do, no matter what Silverlight diehards want you to believe ;)] and we were finally able to significantly lower the amount of graphics we needed to load on the client without loosing the quality of the UI. That has benefited everyone.

This is all good. Take a look at any modern client-side web app like Google Docs, Hotmail, etc. Absolute minimum amount of graphics and maximum amount of appeal (excluding ads, of course). All our sites were build on the same principals: all navigation links, titles and logos are SPAN or DIV tags, their appearence is controlled by CSS classes. Inner text or content of those tags is freely available to web crawlers and all kinds of client features.

Yesterday I accidentally brought up the Chrome's Translate bar while testing something on Web Scheduler. I've never translated any of our sites to any language before so I translated it from English to Russian just to see what happens. The result was shocking.

In fact, the Russian that Chrome displayed was so bad, it wasn't even funny. If you speak Russian, click the screenshot link at the bottom of this post to see what I mean. What absolutelly sucked was the way it translated the name of our company and most of site's titles. Plain disaster, to say the least. Of course, I immediatelly imagined a bunch of Russian teens, pointing at our site, laughing and making up all kinds of dirty jokes that rhyme with the "Russian" names of the company, or products, or anything else that is related to us. It's not good. Not good at all. I can only imagine how translation of our content into other languages might look like.

So, going back to graphics? No, of course not. But now I can't stop thinking that we have to do something about that. Quite an unexpected side effect of using styles :) The first reaction was anger at Google. Damn you, Google! If you can't do something that is solid on all levels - then don't! This Russian translation IS horrible! But then I realized that there could be one of our former clients, sitting somewhere at the same moment, looking at some of my old code and thinking "Damn you, Vlad! If you couldn't code it right, why did you code this at all?!"

I guess CodeEffects.com will just have to deal with that translation thing somehow...