input type=range und input type=number verbinden

[Gunnar Bittersmann]

@@JürgenB

ich glaube, die Funktion der Eingaben ist zu erkennen

Für Sehende, ja. Die Label grob/fein kann man visuell verstecken, sodass sie bei nicht-visueller Bedienung zur Verfügung stehen.

so etwas wie „rough/fine“ oder „coarse/fine“ muss da nicht drangeschrieben werden, zumal es ja auch nicht stimmt.

Nicht?

Es sind zwei Eingaben für den gleichen Zweck, nur eine schnell und eine präzise.

Ob du das nun coarse, rough oder quick and dirty nennst …

Und wie sieht es bei Schiebereglern mit der Tastaturbedienbarkeit aus?

Geht mit Pfeiltasten. Bei 100 Stufen dauert’s schon eine Weile; bei 1000 Stufen eine Unendlichkeit. Warum sollte man als Tastaturbediener überhaupt den Schieberegler betätigen? Per Tastatur ist doch nichts einfacher als den Zahlenwert direkt in ein Eingabefeld zu tippen – oder beim Eingabefeld type="number" mit den Pfeiltasten inkrementieren/dekrementieren.

Möglicherweise ist es eine gute Idee, den Schieberegler vor Tastaturbedienern und assistiven Technologien zu verstecken‽ Er ist eine zusätzliche Eingabemöglichkeit (progressive enhancement) für Mausschubser. Dann hätte sich auch die Frage nach dem Label erledigt:

<label for="red">Rot</label>
<input type="range" tabindex="-1" aria-hidden="true"/>
<input type="number" id="red"/>

Sehende Tastaturbediener werden sich vielleicht wundern, warum sie an den Schieberegler nicht herankommen, dann aber doch einsehen, dass sie das auch gar nicht wollen.

Für Mausschubser ist es eine Qual, die winzigen Schaltflächen zum Inkrementieren/Dekrementieren zu treffen. Da ist es ja fast einfacher, den genauen Wert mit dem Schieberegler einzustellen. Hier vielleicht noch zwei Buttons hinzufügen?

Kwakoni Yiquan