Коротко: не используй флаги. Пиши название языка на самом этом языке. "English", "Espanol", "Deutsch". Юзер ищет свой язык и узнает его по написанию, даже если не понимает остальной интерфейс.

Если хочется визуального акцента, можно поставить иконку глобуса рядом с выпадающим списком. Но не флаг конкретной страны.

А можно я скажу непопулярное мнение? Флаги работают. Для 90% сайтов, где есть 2-5 языков и целевая аудитория конкретных стран.

Если у тебя интернет-магазин, который продает в Россию, Германию и Францию, то русский флаг для русского, немецкий для немецкого, французский для французского это абсолютно нормально и все всё понимают. Никто не обижается.

Проблемы начинаются когда у тебя 30 языков, или когда аудитория размазана по всему миру. Вот тогда да, глобус + текст.

Но советовать каждому мелкому сайту отказываться от флагов потому что "каталонский язык не имеет государства" это немного оверинжиниринг, нет?

Работаю фронтом 8 лет, прошел через эту дискуссию раза четыре на разных проектах. Каждый раз итог один: менеджер или заказчик хочет флаги потому что "красиво и понятно", дизайнер объясняет почему нет, в итоге идут на компромисс.

Компромисс обычно выглядит так: маленький текстовый переключатель в хедере, формат "RU | EN | DE". Без флагов, без глобуса, без выпадающих списков. Минималистично и никого не раздражает.

На одном проекте с арабской локализацией был прикол. Поставили флаг Саудовской Аравии. Получили гневные письма от пользователей из Египта и ОАЭ. Поменяли на текст за полдня.

Кстати есть библиотека для React, react-language-detector, которая определяет язык браузера и сразу редиректит на нужную локаль. Тогда переключатель вообще не нужен в 95% случаев, юзер сразу попадает на свой язык.

А для оставшихся 5% можно вынести текстовый селектор куда нибудь в футер.

лол, у нас на работе дизайнер поставил для украинского языка флаг россии. его чуть не уволили