Best practices for language selector (and why not to use flags)

The common practice for representing language selector on websites is to use country flags. Unfortunately, it’s not a good way of doing so in terms of UX.

I know it is tempting to go with the crowd and just throw icon flags on your website and be done with it. Like most of us, at some point, I used to do that too. But a little research shows that it’s a bad way of presenting users the possibility to change the language. Let’s find a better approach and use it from now on.

Best practices for presenting languages

  • Use the native language names
  • Try to detect the user’s language and show the appropriate content
  • Display the language selector in a clear way, e.g. with a globe icon in the footer, in the header, or in the main navigation
  • Use flags only if the content is specific to the country
  • Remember about HTML hreflang

HTML tags

Tell Google and other search engines about localized versions of your page:

<link rel="alternate" hreflang="lang_code" href="url_of_page" />

Further reading


Thanks for reading. If you liked it, consider sharing it with friends via:

Let's be in touch!

Don't miss other useful posts. Level up your skills with useful UX, web development, and productivity tips via e-mail.

I want to be up to date via email!

No spam ever (I don't like spam, I don't send spam). You can unsubscribe at any time. Privacy Policy

Don't you want to subscribe via e-mail?

See other ways to keep in touch.


If you want to comment, write a post on social media and @mention me. You can also write to me directly on the contact page.