Language Select

Für eine mehrsprachige Seite kann im Content Header ein Sprachwahlschalter hinzugefügt werden. Der Selektor soll den gleichen Content in einer anderen Sprache anbieten (nicht davon abweichende Contentangebote). Er verwendet dabei Sprachnamen nach ISO 639-1.

For a multilingual page a language selector can be added to the Content Header. The selector should offer the same content in other languages (not different content). It uses language names in accordance with ISO 639-1.

Aktuelle Sprache: Deutsch
HTML
    <div class="content-language-select js-content-language-select">
        <div role="button" id="language_select_button" aria-haspopup="menu" aria-controls="language_select" aria-label="Sprache der Seite ändern" tabindex="0" class="trigger js-trigger">
            <i class="language-icon" aria-hidden="true">de</i>            <span class="aural">Aktuelle Sprache: Deutsch</span> 
            <i class="bicon bicon-chevron-down arrow" aria-hidden="true"></i>
        </div>
        <div class="dropdown js-dropdown">
            <ul role="menu" class="list--clean" id="language_select">
                <li role="presentation">
                    <a role="menuitem" href="link-to-page-in-de.html" lang="de" hreflang="de">
                        <i class="language-icon" aria-hidden="true">de</i><span lang="de">Deutsch</span>
                    </a>
                </li>
                <li role="presentation">
                    <a role="menuitem" href="link-to-page-in-en.html" lang="en" hreflang="en">
                        <i class="language-icon" aria-hidden="true">en</i><span lang="en">English</span>
                    </a>
                </li>
                <li role="presentation">
                    <a role="menuitem" href="link-to-page-in-fr.html" lang="fr" hreflang="fr">
                        <i class="language-icon" aria-hidden="true">fr</i><span lang="fr">Français</span>
                    </a>
                </li>
            </ul>
        </div>
    </div>