Frage

Ich habe eine HTML-Seite mit vielen Textfeldern. Ich habe sie für die Zugänglichkeit purpose.But beschriften, ich will nicht Etikett visible.Is es möglich? Oder gibt es eine andere Design-Alternative?

Keine korrekte Lösung

Andere Tipps

Es gibt verschiedene Möglichkeiten, um Text in einer Seite zu setzen und hat es zu visuellen Benutzern versteckt, während zugänglich Screenreader-Nutzer (wie hohe negativer text-indent).

Allerdings: „Zugänglichkeit“ ist nicht eine Linie zwischen „Menschen, die keine Probleme mit dem Web haben“ und „Menschen, die blind sind“. Es gibt viele Menschen, die in keiner der beiden Gruppen passen, und es ist zu einfach und auch gemeinsam für die Autoren, dass die Zugänglichkeit zu vergessen mehr ist dann zu den Menschen verfügbaren Inhalte zu machen, die nicht sehen können.

Mit display: none ist schlecht für das, und ich unterstütze die Abfrage, warum Sie alle Etiketten verstecken - es gibt wahrscheinlich einige Tag, das Sie verwenden werden Benutzer zu informieren, was das Textfeld enthalten ist, so einfach markieren dass ich wie ein Etikett und Stil entsprechend.

Wenn Sie immer noch das Etikett verstecken wollen, positionieren sie außerhalb des Bildschirms besser ist. Es gibt eine aktuelle Zusammenfassung dieser an der 456 Berea Street Blog rel="nofollow.

Der Punkt eines Etiketts ist Zweck der Eingabe zu beschreiben, ein bisschen wie es einen Header zu geben. Wenn Sie nicht über ein Label verwenden, wie werden Sie Ihre sehenden Benutzer wissen, was in dem Eingang setzen?

Was auch immer den visuellen Hinweis auf den sehenden Benutzer gibt auch das Label für Hilfstechnologien Benutzer sein sollte.

Versuchen CSS:

label {
    display: none;
}

Stellen Sie sicher, dass dieses Stylesheet auf das „Bildschirm“ Medium gelten nur:

<link rel="stylesheet" href="style.css" type="text/css" media="screen" />

Wie bereits erwähnt, ist es immer besser, ein sichtbares Etikett für alle Eingabeelemente zu haben - dies sowohl helfen sehende und nicht-sehende Benutzer. Having said that, gibt es bestimmte Situationen, in denen dies nicht möglich ist, die ich Ihren Fall bin zu raten, unter fallen. Für diese Situationen haben Sie ein paar Optionen.

Die erste ist die „title“ Attribut zu verwenden, die den zusätzlichen Vorteil der Anzeige einer Werkzeugspitze für sehende Benutzer hat:

<input type="text" title="first name" />

Ein paar andere haben die zweite Option genannt, die aus dem Bildschirm mit Hilfe von CSS Positionierung des Etiketts beinhaltet:

<label for="first_name" 
  style="position:absolute;left:-1000px;width:1px;overflow:hidden;" />
<input type="text" id="first_name" />

Im Gegensatz zu mit „display: none“, Bildschirm Leser noch das Etikett lesen. Es ist auch elegant, dass Benutzer, die CSS deaktivieren wählen, wird das Etikett sehen.

Egal, was Sie gehen mit, empfehle ich auf jeden Fall eine Testversion herunterzuladen von JAWS von Freedom Scientific und Ihre Lösung testen.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top