Klickbare Elemente

Links

Mit Links kann man auf Webseiten oder bestimmte Elemente innerhalb einer Webseite verlinken. Emails und Telefonnummern können auch verlinkt werden.

Aufgabe

Deine Aufgabe ist es, die nächsten Elemente mit der Tab ↹-Taste zu fokussieren und die Enter ⏎-Taste zu drücken:

Buttons

Mit Buttons kann man verschiedene Aktionen auslösen, z. B. Formulare abschicken, Dialoge öffnen usw.

Aufgabe

Deine Aufgabe ist es, das nächste Element mit der Tab ↹-Taste zu fokussieren und die Enter ⏎-Taste zu drücken bis der Zählerstand 3 erreicht.

Aktueller Zählerstand: 0



Formular-Elemente

Textartige Felder

Bei den folgenden Eingabe-Feldern kann man direkt Text mit der Tastatur eingeben.

Aufgabe

Deine Aufgabe ist es, die nächsten Elemente mit der Tab ↹-Taste zu fokussieren und alle Felder auszufüllen.

Hinweis: der Browser überprüft ob die Eingabe einem Email-Format entspricht.

Hinweis: der Browser überprüft ob die Eingabe nur aus Zahlen besteht.

Hinweis: der Browser überprüft ob die Eingabe dem URL-Format entspricht.

Auswahlartige Felder

Bei den folgenden Eingabe-Feldern muss man unterschiedliche Tasten verwenden, um Werte einzugeben.

Checkboxen

Aufgabe

Deine Aufgabe ist es, die nächsten Elemente mit der Tab ↹-Taste zu fokussieren und ein Häkchen auf allen Checkboxen zu setzen.

Hinweis: Du kannst, nachdem das Element fokussiert ist, mit Space ␣ Häkchen setzen oder sie wieder entfernen.

Radio-Buttons

Aufgabe

Deine Aufgabe ist es, das nächste Element mit der Tab ↹-Taste zu fokussieren und eine Auswahl zu treffen.

Hinweis: Du kannst, nachdem das Element fokussiert ist, mit einer Pfeiltaste , , , deine Auswahl ändern.

Radio Buttons:

Range-Input (Schieberegler)

Aufgabe

Deine Aufgabe ist es, das nächste Element mit der Tab ↹-Taste zu fokussieren und den Regler zu verschieben.

Hinweis: Du kannst, nachdem das Element fokussiert ist, mit einer Pfeiltaste , , , den Regler verschieben.

Select-Elemente

Aufgabe

Deine Aufgabe ist es, das nächste Element mit der Tab ↹-Taste zu fokussieren und eine Option zu wählen:

  • Drücke Space ␣ um das Auswahlmenü zu öffnen,
  • mit den Pfeiltasten und kann man die Optionen durchblättern, und
  • mit der Enter ⏎-Taste die Auswahl bestätigen.


Deine Aufgabe ist es, das nächste Element mit der Tab ↹-Taste zu fokussieren und mehrere Optionen zu wählen:

  • Drücke auf die Pfeiltasten , , um eine Option auszuwählen,
  • mit der Shift ⇧-Taste können mehrere Optionen ausgewählt werden.

Datum-Feld

Aufgabe

Deine Aufgabe ist es, das nächste Element mit der Tab ↹-Taste zu fokussieren und das Datum zu ändern.

Hinweis: Du kannst, nachdem das Element fokussiert ist, mit den Pfeiltasten , , , das Datum ändern. Mit der Space ␣-Taste öffnet sich ein Menü, was die Auswahl erleichtern kann. Es können auch direkt die Zahlen mit der Tastatur eingegeben werden.

Datei-Feld

Aufgabe

Deine Aufgabe ist es, das nächste Element mit der Tab ↹-Taste zu fokussieren und eine Datei auszuwählen.

Hinweis: Du kannst, nachdem das Element fokussiert ist, die Space ␣-Taste drücken, um das Dateiauswahlmenü zu öffnen.

Farb-Feld

Aufgabe

Deine Aufgabe ist es, das nächste Element mit der Tab ↹-Taste zu fokussieren und eine Farbe auszuwählen.

Hinweis: Du kannst, nachdem das Element fokussiert ist, die Space ␣-Taste drücken, um das Farbauswahlmenü zu öffnen.



Weitere interaktive Elemente

Audio-Wiedergabe

Aufgabe

Deine Aufgabe ist es, das nächste Element mit der Tab ↹-Taste zu fokussieren und die Audio-Wiedergabe zu starten.

Hinweis: Du kannst, nachdem das Element fokussiert ist, die Space ␣-Taste drücken, um die Audio-Wiedergabe zu starten.

Hinweis: Solange das Audio-Element fokussiert ist, werden die Pfeiltasten für die Lautstärke-Regelung verwendet. Drücke die Tab ↹-Taste um das nächste Element zu fokussieren, dann kannst du wieder mit den Pfeiltasten scrollen.

Quelle: Ludwig van Beethoven, Public domain, via Wikimedia Commons

Video-Wiedergabe

Aufgabe

Deine Aufgabe ist es, das nächste Element mit der Tab ↹-Taste zu fokussieren und die Video-Wiedergabe zu starten.

Hinweis: Du kannst, nachdem das Element fokussiert ist, die Space ␣-Taste drücken um die Video-Wiedergabe zu starten.

Hinweis: Solange das Video-Element fokussiert ist, werden die Pfeiltasten für die Lautstärke-Regelung verwendet. Drücke die Tab ↹-Taste um das nächste Element zu fokussieren, dann kannst du wieder mit den Pfeiltasten scrollen.

Quelle: Nature video, HD - 4K, CC BY 3.0, via Wikimedia Commons

Details

Aufgabe

Deine Aufgabe ist es, das nächste Element mit der Tab ↹-Taste zu fokussieren die Detailansicht zu öffnen.

Hinweis: Du kannst, nachdem das Element fokussiert ist, die Enter ⏎-Taste drücken, um die Detailansicht zu öffnen.

Details

Hier kann eine länger Beschreibung stehen, die nicht immer auf den ersten Blick sichtbar sein muss. Der text wird erst sichtbar, wenn man auf "Details" klickt bzw. aktiviert.

Dialog

Aufgabe

Deine Aufgabe ist es, das nächste Element mit der Tab ↹-Taste zu fokussieren den Dialog zu öffnen.

Hinweis: Du kannst, nachdem das Element fokussiert ist, die Enter ⏎-Taste drücken, um den Dialog zu öffnen.

Du kannst diesen Dialog mit Esc schließen.