Automate content translations with minimal effort!

In my last post, I shared how this site is now deployed globally, thanks to Cloudflare workers. With a true global presence, we needed the content of this site to be available in multiple languages.

In considering this, clear questions arose. How could this be done? How would Devopsdrops be able to support multiple languages and translations without having to incur huge costs in time and money? Who could be trusted to translate the site content, especially as it scales to add new categories and options?

To answer these questions, I started doing research on translators and especially machine learning translation models.
Eventually, the right service was made available and I'm proud to say that this site is now translated to 100 languages. The best part though is that this is without having to do any work apart from an initial onboarding. So now, not only is Devopsdrops automatically global, its automatically multilingual! This is thanks to our new partner Dialect Ready!

What's Dialect Ready?

In my research on a translation solution, I came across a number of options. Most had varying degrees of acceptable pricing, but none made it easy to integrate their translator with my content. What made it more challenging is that I needed preferred browser language support. Users of this site aren't going to spend time setting up translation manually. Sure they can have Google translate the content on page load, but it's still a manual step for them to do this.

Thankfully Dialect Ready checked all the boxes for what we need in a translation service.

☑ Low cost options
☑ Accurate translations
☑ Many languages supported
☑ Translation based on the users browser language
☑ Options to translate multiple domains down the road
☑ Secure integration without us having to manage secrets/tokens

Thanks to this, I don't have to lift a finger to translate. I just write posts in my first language and Dialect Ready does the rest!

Onboarding

The setup is described on their home page and its simple.

Once you proceed with step 1, they have you fill out a form to collect a contact email and the domain(s) you want to enable translation for. You need to accept their terms of service then of course go through the payment step. Once done, they should take you to a confirmation type of page. This is where you need to grab a client script. Their confirmation page has a download button and link for this.

This client script is what you need for step 2, it should be added to your site's pages (or at least ones you want to have translated).
Then you just need to make sure you have the data-translate attribute set for page elements you want to have translated. This is an interesting feature. I can translate the entire page if I put this attribute in the body element (as they suggest) or just sections.

For my use case, I trust Dialect Ready enough to translate this site's content appropriately. You may justifiably want to do some review of the translations prior to them going live.
I won't get into it here but they have some advanced usage options for content translation previewing. You can check out details on their how it works page.

What about security?

With a translation script in hand, a nefarious person might think they could just pay for one domain and then use the script on it and any other domain/subdomain they wanted. The folks managing Dialect Ready seem to have thought about and created a way to prevent this. Details around their security approach are not publically available. I can say that the client script they provided for use on this blog is unique to this site and will not work on other domains. You can relax knowing that the script they provide you will not be usable on sites that you don't manage or own.

Also, keep in mind that any content you permit to be translated will be cached on their end and client side. This is apparently to ensure good response times for translations.
Client side caching can still work in a preview first setup, as only those clients with access to a preview environment would have translations cached locally. I'm assuming you're protecting your upstream/non-prod environments with some form of authentication or better yet zero trust architecture. If you're not doing that, I would advise you to start.

Real Translations, Real Results!

Once I was all setup, with the script loaded on every page and data-translate attributes added to the title and body elements, I will admit I was a little skeptical about how well this would work out.

I can say, after having Dialect Ready enabled for a few weeks it has resulted in MAJOR increases in traffic across the globe. I have to credit some of this to updating the blog to be deployed at the CDN edge, even with that I didn't see much traffic from Greece, Malaysia or Germany (to name a few) before enabling this translation service!
The translation solution has tremendously helped Devopsdrops expand it's userbase, promoting our guides, expertise and apps in more languages.

I very much recommend you give Dialect Ready a try for site translation!