Gunnar Bittersmann: Responsive Navigation mit Flex&Target

Beitrag lesen

@@ShareThePain

Ich verstehe nicht wie ich Target für eine responsive Toggle-Navigation verwenden kann

Gar nicht.

(Und falls hier noch jemand mit einer solchen „Lösung“ aufschlagen sollte, dann ist das gewiss keine Lösung, weil nicht von allen bedienbar.)

<a class="button" href="#">
<span class="bars"></span>
<span class="bars"></span>
<span class="bars"></span>
</a>

Ein sicheres Zeichen, dass ein a-Element hier falsch ist. Links führen zu anderen Stellen im Web (oder auf der aktuellen Seite).

Für Schaltflächen, die Aktionen auf der Seite auslösen sollen (bspw. das Öffnen/Schließen eines Menüs), ist button zu verwenden.

Drei spans, um ein Hamburger-Icon zusammenzubauen?? Nicht wirklich, oder?

Verwende SVG oder ein Zeichen wie ≡ U+2261. Aber mit barrierefreier Beschriftung:

<button aria-label="Menü"></button>

😷 LLAP

--
“When I was 5 years old, my mother always told me that happiness was the key to life. When I went to school, they asked me what I wanted to be when I grew up. I wrote down ‘happy.’ They told me I didn’t understand the assignment, and I told them they didn’t understand life.” —John Lennon