Language switcher
The visible control for changing language, listing each option in its own language rather than hiding behind a flag icon.
See it
What it is
The visible control that lets someone choose their language, usually a globe icon in the header or a list in the footer. The rule that matters: label every option in its own language (Deutsch, Español, 日本語, العربية), not in yours. A visitor who cannot read your interface cannot find 'German' in an English list, which is exactly the person the control exists for.
Skip flags. A flag is a country, not a language: Spanish is not Spain for 400 million speakers, Arabic covers twenty-odd flags, and Switzerland has four official languages under one. Switching should keep the user on the same page in the new locale (not bounce them to the homepage), change the URL so the choice is linkable and indexable, persist to a cookie or account preference, and set lang plus dir on the document. Give each option its own lang attribute so screen readers pronounce it correctly. hreflang belongs on real links only, meaning an anchor with an href: putting it on a button or an option element does nothing but produce invalid markup.
Gotcha: geo-IP auto-redirect without a visible, sticky switcher traps people. An English speaker in Tokyo, a Portuguese speaker on a German VPN, and anyone sharing a link all end up in a language they did not ask for. Detection is a first guess. An explicit choice from the switcher must win permanently and never be re-overridden on the next visit.
Ask AI for it
Build a language switcher for this site. Render every locale destination as a real link carrying href, hreflang, and lang, styled as an accessible globe-icon menu in the header, with no flag icons and the current locale marked aria-current. Use correct endonyms: Deutsch, Español, Français, 日本語. If you use a native select element instead, put lang on each option and keep hreflang on the actual alternate links in the head, never on an option or a button. Selecting a locale should navigate to the equivalent path in that locale (keeping the current page, query, and hash), write the choice to a persistent cookie that overrides Accept-Language detection on future visits, and update the html lang and dir attributes. Make it keyboard navigable with arrow keys and Escape, and give it an accessible label that does not rely on the icon alone.