Famous Birthdays has been described as a “Wikipedia for Gen-Z”. It’s an insight into popularity across the internet of influencers, not just from traditional stage and screen but also social media channels such as TikTok and Instagram.
It’s also available in four languages: English, French, Portuguese and Spanish. The site presents options to these language versions in a manner that’s quite obvious given this blog’s title: flags, of course.
The argument goes that flags are instantly recognisable; especially to users from that country. Without getting into the country of origin of languages debate here (and the entire premise of this blog being that it’s not the best choice), the most interesting aspect with the design of Famous Birthdays’ language selection is that the flags appear greyed out (unless you hover on desktop, when the colour is revealed, but nothing on mobile).
Screenshot of Famous Birthdays footer. Note that on the Spanish, Portuguese and French sites, the US flag is used for English.
How recognizable are icons greyed out like this? Not very, and that runs foul of specific web accessibility guidelines – namely WCAG 2.0 Success Criterion 1.4.3: Contrast (Minimum). The green and red of Portugal’s flag are indistinguishable here – and is that a French flag? It could be any country that uses a vertical triband. To be fair to Famous Birthday’s developers, they have correctly implemented appropriate alternative text descriptions, albeit “French” instead of “Français” etc.
If you’re using flags for whatever reason ensure you display them accurately – by their very nature they are of course colourful, so by manipulating their appearance you are degrading the concept of an easily identifiable symbol of a nation (and not a language).