Links und Navigation

Links machen das Web zum Netz. Sie entstehen mit dem Element <a> (anchor) und dem Attribut href.

Pfade

Besondere Linkarten

• mailto: öffnet das Mailprogramm, tel: wählt auf dem Handy
• download lädt die Datei herunter statt sie anzuzeigen
• title zeigt einen Tooltip (kein Ersatz für gute Linktexte)

target und Sicherheit

target="_blank" öffnet einen neuen Tab. Moderne Browser setzen rel="noopener" dafür automatisch, trotzdem schreibt man es oft dazu. Bei Links zu fremden Seiten schützt rel="noopener noreferrer" vor Missbrauch des Fensters und gibt keine Herkunftsadresse weiter. Für bezahlte oder nicht vertrauenswürdige Links gibt es rel="nofollow sponsored ugc".

Gute Linktexte

Der Linktext sollte allein verständlich sein, denn Screenreader-Nutzer lassen sich oft alle Links der Seite vorlesen.

• Schlecht: "Klicke hier", "Mehr", "Link"
• Besser: "Preisliste 2025 als PDF herunterladen (2 MB)"
• Bei Links in neuen Tabs oder Downloads einen Hinweis geben (Dateityp, Größe)

Navigationsmenü

Ein Menü ist technisch eine Liste von Links in einem <nav>-Element:

• aria-current="page" markiert den aktuellen Menüpunkt
• aria-label unterscheidet mehrere nav-Bereiche voneinander

Sprunglink für Tastaturnutzer

Als erstes Element der Seite hilft ein "Zum Inhalt springen"-Link, dass Tastaturnutzer nicht jedes Mal das ganze Menü durchtabben müssen:

Klicke ins Ergebnis und drücke Tab: Der Link erscheint beim Fokus.