Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Design

Grant Lacey
Grant Lacey
6,103 Points

flag icon as language selector symbol?

What is the best line of thought for this? This is just for a company brochure site. No e-commerce, no back-end. The intent is to provide a multi-lingual site for the users preference by providing language selections. I like the idea of nice looking flag icons, however I am second guessing and rather considering just writing the language name in it's native text. Where flag icons represent a language Spanish and Portuguese seem problematic for example.

Ben Dietrich
Ben Dietrich
8,287 Points

Grant,

Aesthetically, the flag icons sounds more appealing than a text list of languages. However, would you run the risk of people not knowing which flag represents which language (as in your example)? It might seem fairly elementary but a potentially huge UX problem. If you really wanted the flag icon, maybe you could come up with a way to combine the two? I have a few in mind but it's really up to what you think will be most effective for your users!

Best of luck!

1 Answer

I agree with Ben Dietrich in that things could get confusing with flags, with certain countries with more than one language. I have two solutions for this:

  1. Choose countries with either a single dominant language. The United States and Canada are both bad examples of this, as the US has English and Spanish, and Canada has English and French. The United Kingdom - on the other hand - is predominantly English, so you might consider using the UK flag rather than the US' or Canada's for the English language.

  2. Add hover-text to the button. As even the above solution has it's problems, you could add hover text to the button displaying (as you proposed) the language's name in the native language. This combines your compatibility option with your aesthetically pleasing option.

Grant Lacey
Grant Lacey
6,103 Points

It's a minefield! Great Britain spells colour this way, maybe they'd be a bit peeved with me using their flag for American spelling.. and on and on :) Trying not to be presumptive with the choices I provide. That being said you've got to strike a balance somewhere. I agree; hover text with my nice flat flag icons it is! Thanks for the opinions.

Eh, "Great Britain" won't be mad at you for spelling anything the way you want, ultimately it's about being clear to your users. And besides, "colour" is the correct way to spell it. :D

Glad I could help!