Skip to main content

Best way to determine user"s locale within browser



I have a website (Flash) localized into a dozen of languages and I want to auto-define a default value depending on the user's browser settings in order to minimize the steps to access the content.





FYI, I cannot use server-scripts due to proxy restrictions, so I guess JavaScript or ActionScript would be appropriate to solve the problem.





Questions:









  1. What would be the best method to 'guess' the user's locale ?









  2. Are there any existing simple classes/functions that could help me out (no complex localization bundles) ? Specially to break down all the possible languages into a smaller number (the translations I have) on a smart way .









  3. To which point can I trust such a solution ?









  4. Any other workarounds or suggestions ?









Thanks in advance!



Source: Tips4all

Comments

  1. The proper way is to look at the HTTP Accept-Language header sent to the server. This contains the ordered, weighted list of languages the user has configured their browser to prefer.

    Unfortunately this header is not available for reading inside JavaScript; all you get is navigator.language, which tells you what localised version of the web browser was installed. This is not necessarily the same thing as the user's preferred language(s). On IE you instead get systemLanguage (OS installed language), browserLanguage (same as ‘language’) and userLanguage (user configured OS region), which are all similarly unhelpful.

    If I had to choose between those properties, I'd sniff for ‘userLanguage’ first, falling back to ‘language’ and only after that (if those didn't match any available language) looking at ‘browserLanguage’ and finally ‘systemLanguage’.

    If you can put a server-side script somewhere else on the net that simply reads the Accept-Language header and spits it back out as a JavaScript file with the header value in the string, eg.:

    var acceptLanguage= 'en-gb,en;q=0.7,de;q=0.3';


    then you could include a <script src> pointing at that external service in the HTML, and use JavaScript to parse the language header. I don't know of any existing library code to do this, though, since Accept-Language parsing is almsot always done on the server side.

    Whatever you end up doing, you certainly need a user override because it will always guess wrong for some people. Often it's easiest to put the language setting in the URL (eg. http​://www.example.com/en/site vs http​://www.example.com/de/site), and let the user click links between the two. Sometimes you do want a single URL for both language versions, in which case you have to store the setting in cookies, but this may confuse cookieless user agents and search engines.

    ReplyDelete
  2. This article suggests the following properties of the browser's navigator object:


    navigator.language (Netscape - Browser Localization)
    navigator.browserLanguage (IE-Specific - Browser Localized Language)
    navigator.systemLanguage (IE-Specific - Windows OS - Localized Language)
    navigator.userLanguage


    Roll these into a javascript function and you should be able to guess the right language, in most circumstances. Be sure to degrade gracefully, so have a div containing your language choice links, so that if there is no javascript or the method doesn't work, the user can still decide. If it does work, just hide the div.

    The only problem with doing this on the client side is that either you serve up all the languages to the client, or you have to wait until the script has run and detected the language before requesting the right version. Perhaps serving up the most popular language version as a default would irritate the fewest people.

    Edit: I'd second Ivan's cookie suggestion, but make sure the user can always change the language later; not everyone prefers the language their browser defaults to.

    ReplyDelete
  3. THe only way a browser can share meta data about its user and the request is via URLs and headers. Grab Firefox and take a peek at the headers being sent when a request is made. Its quite interesting to examine typical request and response headers.

    ReplyDelete

Post a Comment

Popular posts from this blog

[韓日関係] 首相含む大幅な内閣改造の可能性…早ければ来月10日ごろ=韓国

div not scrolling properly with slimScroll plugin

I am using the slimScroll plugin for jQuery by Piotr Rochala Which is a great plugin for nice scrollbars on most browsers but I am stuck because I am using it for a chat box and whenever the user appends new text to the boxit does scroll using the .scrollTop() method however the plugin's scrollbar doesnt scroll with it and when the user wants to look though the chat history it will start scrolling from near the top. I have made a quick demo of my situation http://jsfiddle.net/DY9CT/2/ Does anyone know how to solve this problem?

Why does this javascript based printing cause Safari to refresh the page?

The page I am working on has a javascript function executed to print parts of the page. For some reason, printing in Safari, causes the window to somehow update. I say somehow, because it does not really refresh as in reload the page, but rather it starts the "rendering" of the page from start, i.e. scroll to top, flash animations start from 0, and so forth. The effect is reproduced by this fiddle: http://jsfiddle.net/fYmnB/ Clicking the print button and finishing or cancelling a print in Safari causes the screen to "go white" for a sec, which in my real website manifests itself as something "like" a reload. While running print button with, let's say, Firefox, just opens and closes the print dialogue without affecting the fiddle page in any way. Is there something with my way of calling the browsers print method that causes this, or how can it be explained - and preferably, avoided? P.S.: On my real site the same occurs with Chrome. In the ex