Header Base

<nav class="sidenav" label="">
    <div class="sidenav--head">
        <div class="sidenav--head-title">
            <div class="sidenav--head-subsection"></div>
        </div>
    </div>

    <ul class="sidenav--list">
        <li>
            <a lang="en" href="/wai-website/fundamentals/accessibility-intro/" aria-current="location" class="page-link"><span>Introduction to Web Accessibility <span lang="de" dir="auto" translate="no" class="lang">(auf Englisch)</span></span></a>
            <ul>
                <li>
                    <a lang="de" href="/wai-website/videos/standards-and-benefits/de" aria-current="page" class="page-link">Video-Einführung</a>

                </li>
            </ul>
        </li>
        <li><a href="#" aria-current="page">Web Accessibility Tutorials</a></li>
        <li>
            <a href="#" aria-current="location">Page Structure Tutorial</a>
            <ul>
                <li><a href="#">Page Regions</a></li>
                <li><a href="#" aria-current="page">Labeling Regions</a></li>
                <li><a href="#">Headings</a></li>
                <li><a href="#">Content Structure</a></li>
                <li><a href="#">Example</a></li>
            </ul>
        </li>
        <li>
            <a href="#">Menus</a>
            <ul>
                <li><a href="#">Structure</a></li>
                <li><a href="#">Styling</a></li>
                <li><a href="#">Fly-out Menus</a></li>
                <li><a href="#">Application Menus</a></li>
                <li><a href="#">Application Menu Example &amp; Code</a></li>
            </ul>
        </li>
        <li>
            <a href="#">Images</a>
            <ul>
                <li><a href="#">Informative Images</a></li>
                <li><a href="#">Decorative Images</a></li>
                <li><a href="#">Functional Images</a></li>
                <li><a href="#">Images of Text</a></li>
                <li><a href="#">Complex Images</a></li>
                <li><a href="#">Groups of Images</a></li>
                <li><a href="#">Image Maps</a></li>
                <li><a href="#">An alt Decision Tree</a></li>
                <li><a href="#">Tips and Tricks</a></li>
            </ul>
        </li>
        <li>
            <a href="#">Tables</a>
            <ul>
                <li><a href="#">One Header</a></li>
                <li><a href="#">Two Headers</a></li>
                <li><a href="#">Irregular Headers</a></li>
                <li><a href="#">Multi-level Headers</a></li>
                <li><a href="#">Caption &amp; Summary</a></li>
                <li><a href="#">Tips and Tricks</a></li>
            </ul>
        </li>
        <li>
            <a href="#">Forms</a>
            <ul>
                <li><a href="#">Labeling Controls</a></li>
                <li><a href="#">Grouping Controls</a></li>
                <li><a href="#">Form Instructions</a></li>
                <li><a href="#">Validating Input</a></li>
                <li><a href="#">User Notifications</a></li>
                <li><a href="#">Multi-page Forms</a></li>
                <li><a href="#">Custom Controls</a></li>
            </ul>
        </li>
        <li>
            <a href="#">Carousels</a>
            <ul>
                <li><a href="#">Structure</a></li>
                <li><a href="#">Functionality</a></li>
                <li><a href="#">Animations</a></li>
                <li><a href="#">Styling</a></li>
                <li><a href="#">Working Example</a></li>
                <li><a href="#">Complete Code</a></li>
            </ul>
        </li>
    </ul>
    <nav class="sidenav-languages" aria-labelledby="languagehead">
        <header id="languagehead">Languages/Translations</header>
        <ul class="langlist">
            <li><a href="/wai-video-standards-and-benefits/videos/standards-and-benefits/" lang="en">English (original)</a></li>
            <li><a style="text-transform: capitalize;" href="/videos/standards-and-benefits/ar" lang="ar" dir="auto" translate="no">العربية</a></li>
            <li><strong style="text-transform: capitalize;">Ελληνικά</strong></li>
            <li><a style="text-transform: capitalize;" href="/wai-video-standards-and-benefits/videos/standards-and-benefits/es" lang="es">español</a></li>
            <li><a style="text-transform: capitalize;" href="/wai-video-standards-and-benefits/videos/standards-and-benefits/fr" lang="fr">français</a></li>
            <li><a style="text-transform: capitalize;" href="/wai-video-standards-and-benefits/videos/standards-and-benefits/nl" lang="nl">Nederlands</a></li>
            <li><a style="text-transform: capitalize;" href="/wai-video-standards-and-benefits/videos/standards-and-benefits/zh-hans" lang="zh-hans">简体汉语</a></li>
        </ul>
        <p style="padding: 4px 0 4px 27px;margin:0;border-top: 1px solid #eed009;"><a href="/wai-video-standards-and-benefits/translations/#el">Άλλοι πόροι στη γλώσσα Ελληνικά</a></p>
        <p><a href="/wai-video-standards-and-benefits/translations/">Όλες οι Μεταφράσεις</a></p>
        <p><a href="#">Μετάφραση πόρων WAI</a></p>
    </nav>
</nav>