CSS Navbar ok oder gehts übersichtlicher?

[Matthias Scharwies]

Guten Morgen!

@Gunnar Bittersmann

Du hast in deinem Beispiel visually-hidden verwendet.

visually-hidden,
.visually-hidden,
[visually-hidden="true"]
{
	position: absolute !important;
	clip: rect(1px, 1px, 1px, 1px) !important;
	padding: 0 !important;
	border: 0 !important;
	height: 1px !important;
	width: 1px !important;
	overflow: hidden !important;
}

Habe jetzt ein bisschen nachgelesen (Inclusively Hidden Chris Coyier on Apr 19, 2019) und würde gerne auf .screenreader-only oder sowas verzichten.

Was hältst Du von:

<nav>
  <ul>
    <li><a href="#">Seite 2</a>
      <button aria-expanded="false" aria-label="Untermenü aufklappen">
        ▶
      </button>
      <ul>
        <li><a href="#">Seite 2a</a></li>
        <li><a href="#">Seite 2b</a></li>
      </ul>
    </li>

Sollte die ul ul eine id und der button ein aria-controls enthalten?

Herzliche Grüße

Matthias Scharwies