Following my previous posts on How to handle non-English characters in ASP.NET MVC routes, Build pretty clean URL for your dynamic pages using JavaScript and Non English Words in URL I decided to share another simple tip that let you translate what your user inserts as content’s title (that can be a blog post title, a page name or a news headline) automatically using Google Translate API.

Let me explain it with an example. Suppose that you have a news system in Persian language and your end user enters a Persian phrase like “این یک عنوان خبر است” as the headline of a news story. From SEO point of view it’s better we include original headline words in URL (like something that I explained in this post) instead of using an integer ID or GUID (e.g. /news/?id=1 or /news/1.aspx, etc.) but as we discussed on in that post, including non-English characters in URLs is not the best way! I just wanted to have something like /news/story/this-is-a-title and didn’t want to force user translate his words into English in order to use in URL field.

A few days ago I was thinking on this topic and decided to try a trick to utilize Google Translate API (which has recently started supporting Persian language as well) to translate such titles into meaningful English phrases and then clean them using the way I described in this post.

Fortunately, thanks to Google API simplicity it was so easy and straightforward. Here’s what I wrote:

1. First you should include Google API JavaScript source in your page:
   

   <script type="text/javascript" src="http://www.google.com/jsapi"></script>

2. Add this JavaScript code to your page:
   

   $(document).ready(function() {
           $("#contentPage_Title").blur(function() { parseUrl($("#contentPage_Title").val()) });
       });
   
   
           google.load("language", "1");
           function parseUrl(url) {
               $("#loadingImage").attr("style", function() { return "display: inline;" });
               google.language.translate(url, "fa", "en", function(result) {
                   if (!result.error) {
                       var url = (result.translation + " ").replace(/[^a-zA-Z0-9]+/g, "-");
                       $("#contentPage_Url").val(url.slice(0, url.length - 1).toLowerCase());
                       $("#loadingImage").attr("style", function() { return "display: none;" });
                   }
               });
           } 
   
   

You’re done! Now, let me explain the code a little. First using jQuery, you tell the DOM to fire parseUrl() event as soon as you enter the title and go to the next field, then, we load Google Translate service into our script, call translate function to translate from “fa” (Persian) to “en” (English) and finally clean the result using our old trick. That’s all and no magic here!

Please note that we show and hide a “Loading” element (e.g.: a loading image) before and after we call AJAX translate function. So user can see something is happening behind the scene.

One of the most amazing features of ASP.NET MVC is its powerful routing engine that let you define clear URLs for your web application. Today I want to share a very simple and short tip with you to handle non-English URLs in your ActionLink methods.

Let’s start with an example; in a blog engine we have two routes as follows:

routes.MapRoute(

                "ShowPost",

                "read/{url}",

                new { controller = "Post", action = "Show" }

            );

routes.MapRoute(

                "EditPost",

                "edit/{url}",

                new { controller = "Post", action = "Edit" }

            );

and you decide to show a Persian title in a URL as follows: /blog/read/این-یک-عنوان-است

Everything is fine till now but if you want to put an ActionLink in your view to redirect user to edit page in this way:

<%= Html.ActionLink("Edit", "Edit", new { url = Model.Url }) %>

You will be redirected to an ugly encoded URL like this /edit/%D8%AA%D8%B3%D8%AA instead of /blog/edit/این-یک-عنوان-است

Here’s the simple trick to overcome this:

<%= HttpUtility.UrlDecode(Html.ActionLink("Edit", "Edit", new { url = Model.Url })) %>

That’s it!

After releasing ASP.NET MVC previews, URLs have found more important role in web applications. If many developers used to show URLs like /products/showproducts.aspx?pid=14 or /products/14.aspx or even products/14/ in past, now MVC lovers are going to use more friendly URLs like /products/notebook/sony/fz-490; that’s much better. But what if your main language is not English?!

For example assume you’re developing a Persian web application to show news items. Now what to do with URLs? Will you let site administrator add an English translation for headline to show in URL and build a URL like this: /news/2008/8/8/this-is-a-headline/ or show native language words in URL (e.g.: /news/1387/8/8/این-یک-سرخط-خبر-است/)? I chatted to Simone about this and he suggested me use full English URLs instead of a combination of Persian/English characters. He also thought it’s better to keep a unity among all URLs and not to use English URLs somewhere in your application and use non-English (or a combination of both) somewhere else. I agree with him on this and personally I prefer English URLs too.

Another point is that Persian characters are not extended from English and are totally different. For example Simone told me they have characters like à è ò in Italian language but this chars have equivalents like a e o and even if you show URL using native language and characters, you can have equivalent URLs and map them to each other using a simple URL rewriting (So you can satisfy both fans of native and English URLs!); but in Persian language we don’t have this option! Everything will be shown in Persian languages and there is no solution to convert it to a similar English characters URL.

Now let’s take a look at this issue from another point of view: SEO. What is search engine crawlers’ behavior against non-English URLs? Is it better to use native words or not? I have no idea about this because I’m not a SEO expert; so I invite you participate in this discussion by leaving a comment. What is your opinion? What solution you suggest to reach a standard way?

As I told Simone, there aren’t many Persian sites in which they use Persian words in URLs but we have some exceptions too. e.g. Persian Wikipedia (http://fa.wikipedia.org/wiki/صفحهٔ_اصلی). (+ PS: Referencing Keyvan's post, there are non-English domain names too; e.g. Pedram's Persian domain name (www.پدرام.com))

P.S.: Simone invited me to write a blog post about this and open a discussion and also suggested me to talk to Keyvan about it. So, Keyvan, I would be appreciated and so glad if you participate on this topic

P.S. (2): My dear friend Keyvan accepted my invitation to join this thread and wrote a nice blog post about it. Please read this post as well.

Omid K. Rad, the author of first standard Persian calendar for .NET 1.x, started his new Blog. I welcome him and express my happiness because I know him as one of VIPs of Iranian developers community.

To understand how he was effective for Iran .NET developers, it's enough to know that PersianCalendar class which is included in .NET 2.0 is developed and prepared by Omid and Soheil and they did their best for this project (iranl10ninfo) to make it ready and present it to Microsoft.

Thank you Omid and waiting for your valuable writings on your blog ;)