Witam, buduję formularz logowania,
czy w formularzu każde pole musi mieć swój label ?
Chciałem aby nazwy pól były widoczne wewnątrz input podane jako value,
zaoszczędze również dzięki temu miejsce.

Czy mogę ominąć label ?
Czy ustawić normalnie i schowac za pomocą text-indent, nie będzie
widoczny ale dla programów czytających już tak .

Aha jeszcze jedno pytanie, podczas walidacji wywala mi błąd, który mówi,
że znaczniki input jest niedozwolony wewnątrz form.

Objąć wszystkie divem lub p czy każdy z osobna ?

do góry

Dnia Wed, 24 Jun 2009 13:12:30 +0200, hazet napisał(a):

> Witam, buduję formularz logowania,
> czy w formularzu każde pole musi mieć swój label ? Chciałem aby nazwy
> pól były widoczne wewnątrz input podane jako value, zaoszczędze również
> dzięki temu miejsce.
>

Ciekawe jak zrobisz to value dla input type="password" ;)

> Czy mogę ominąć label ?

Nie

> Czy ustawić normalnie i schowac za pomocą text-indent, nie będzie
> widoczny ale dla programów czytających już tak .

<label class="auraltext"> (dalej google)

>
> Aha jeszcze jedno pytanie, podczas walidacji wywala mi błąd, który mówi,
> że znaczniki input jest niedozwolony wewnątrz form.
>
> Objąć wszystkie divem lub p czy każdy z osobna ?

Fieldsetem się nie da? To divem albo ul. Ale ja bym był za fieldsetem -
legend też auralem można dać, ogólnie trochę więcej stylowania ale dla
screenreaderów taki fieldset z legendem to baaaardzo przydatna sprawa.

ethanak
--
mailto=window.atob('ZXRoYW5ha0Bwb2xpcC5jb20=');
http://milena.polip.com/ - Nie bede czekac na Ivo :)

do góry

ethanak pisze:
> Dnia Wed, 24 Jun 2009 13:12:30 +0200, hazet napisał(a):
>
>> Witam, buduję formularz logowania,
>> czy w formularzu każde pole musi mieć swój label ? Chciałem aby nazwy
>> pól były widoczne wewnątrz input podane jako value, zaoszczędze również
>> dzięki temu miejsce.
>>
>
> Ciekawe jak zrobisz to value dla input type="password" ;)
>
>> Czy mogę ominąć label ?
>
> Nie
>
>> Czy ustawić normalnie i schowac za pomocą text-indent, nie będzie
>> widoczny ale dla programów czytających już tak .
>
> <label class="auraltext"> (dalej google)

Tego nie za bardzo rozumiem, 1 wynik w google wyświetla mi twój problem
z google. Później znalazłem na innej stronie zawartość tej klasy i
stwierdziłem , że text-indent: -9999px. będzie lepszym rozwiązaniem


>
>> Aha jeszcze jedno pytanie, podczas walidacji wywala mi błąd, który mówi,
>> że znaczniki input jest niedozwolony wewnątrz form.
>>
>> Objąć wszystkie divem lub p czy każdy z osobna ?
>
> Fieldsetem się nie da? To divem albo ul. Ale ja bym był za fieldsetem -
> legend też auralem można dać, ogólnie trochę więcej stylowania ale dla
> screenreaderów taki fieldset z legendem to baaaardzo przydatna sprawa.
>

fieldsetem się da, niby jest do grupowania pól, można by powiedzieć
czemu ludzie używają div,p zamiast fieldset ?

do góry

ethanak pisze:
> Dnia Wed, 24 Jun 2009 13:12:30 +0200, hazet napisał(a):
> Ciekawe jak zrobisz to value dla input type="password" ;)
>
>> Czy mogę ominąć label ?
>
> Nie

A jeszcze za czasów JAWS 7 proponowano konstrukcję:

<input ... title="Twoje imię">

...i podobno nawet przy wyłączonym czytaniu wspomagaczy typu title
właśnie - akurat te title w polach formularzy były czytane.
Nie sprawdzałem, tak tylko się zastanawiam ile w tym prawdy.
Powyższą wskazówkę przeczytałem kiedyś w książce, której redaktorem był
Jim Thatcher (http://jimthatcher.com/), więc wydawało mi się to być
rzetelne źródło. Zgaduję, że nie wszystkie readery tak to traktują.

--
Pozdrawiam - Radek N.

do góry

Polecam artykulik http://www.usability.com.au/resources/wcag2/
Jest też odwołanie do Thatchera.

do góry

Radek N. pisze:
> ethanak pisze:
>> Dnia Wed, 24 Jun 2009 13:12:30 +0200, hazet napisał(a):
>> Ciekawe jak zrobisz to value dla input type="password" ;)
>>
>>> Czy mogę ominąć label ?
>>
>> Nie
>
> A jeszcze za czasów JAWS 7 proponowano konstrukcję:
>
> <input ... title="Twoje imię">
>
> ...i podobno nawet przy wyłączonym czytaniu wspomagaczy typu title
> właśnie - akurat te title w polach formularzy były czytane.
> Nie sprawdzałem, tak tylko się zastanawiam ile w tym prawdy.
> Powyższą wskazówkę przeczytałem kiedyś w książce, której redaktorem był
> Jim Thatcher (http://jimthatcher.com/), więc wydawało mi się to być
> rzetelne źródło. Zgaduję, że nie wszystkie readery tak to traktują.
>

aha ;] (nie za bardzo wiem ocb)

Ale postanowiłem zrobić to tak, bez fieldset gdyż będzie się powtarzał
tytuł w legend więc jest to bez sensu, fieldset było by lepsze dla kilku
pól np do grupowania paru checkboxów. Wole sprawdzony sposób

<div id="formularz">
<form ...>
<div>
<label for="login">Login</label>
<input type="text" name="login" id="login" value="Login" />
<label for="pass">Hasło</label>
<input type="password" name="pass" id="pass" value=" " />
</div>
</form>

i tekst z label schowam przez text-indent,
jak będe miał problemy z ostylowaniem jeden pod drugim to wpakuje w
osobny div każdy input (no ale to chyba nie będzie konieczne bo input to
element blokowy, skoro mogę mu nadać margines .)

do góry

Grzesiek pisze:
> Polecam artykulik http://www.usability.com.au/resources/wcag2/
> Jest też odwołanie do Thatchera.

nic tam ciekawego nie napisał :]
ale to chyba stary artykuł skoro autor prezentuje formularz na tabeli ;]

do góry

Dnia Wed, 24 Jun 2009 14:35:01 +0200, hazet napisał(a):

[...]
> Ale postanowiłem zrobić to tak, bez fieldset gdyż będzie się powtarzał
> tytuł w legend więc jest to bez sensu, fieldset było by lepsze dla kilku
> pól np do grupowania paru checkboxów.

Nie o to chodzi. Fieldset legend jest anonsowany przez screenreader w
momencie wejścia z zewnątrz na pole w danym fieldsecie.
Czyli:

<fieldset><legend>Formularz logowania</legend>
<label for="login">Login</label><input type="text" id="login">
<label for="haslo">Hasło</label><input type="password" id="haslo">

Jeśli wejdziesz tabem spoza formularza, usłyszysz:

formularz logowania login pole tekstowe

Przy przechodzeniu po polach wewnątrz fieldset zawartość legend nie jest
czytana.

Nie uważasz że informacja o tym że jest to formularz logowania jest dość
ważna?

[...]
>
> i tekst z label schowam przez text-indent,

Kurde, ludzie wymyślili auraltext po to żeby pod wszystkimi
przeglądarkami to działało a Ty oczywiście jesteś mądrzejszy. TO po co w
ogóle pytasz?

auraltext zadziała również dla zawartości linków, przy ujemnym text-
indent będziesz miał niemiłą niespodziankę...

Poza tym przy ujemnym text-indent element cały czas fizycznie jest w
miejscu które jest dla niego przewidziane, jedynie zawartość tekstowa
jest wysunięta poza ekran. Przy auraltext poza ekranem jest cały element
(w tym przypadku cały label, a nie tylko tekst wewnątrz).

ethanak
--
mailto=window.atob('ZXRoYW5ha0Bwb2xpcC5jb20=');
http://milena.polip.com/ - Nie bede czekac na Ivo :)

do góry

hazet pisze:
> Radek N. pisze:
>> ethanak pisze:
>>> Dnia Wed, 24 Jun 2009 13:12:30 +0200, hazet napisał(a):
>>> Ciekawe jak zrobisz to value dla input type="password" ;)
>>>
>>>> Czy mogę ominąć label ?
>>>
>>> Nie
>>
>> A jeszcze za czasów JAWS 7 proponowano konstrukcję:
>>
>> <input ... title="Twoje imię">
>>
>> ...i podobno nawet przy wyłączonym czytaniu wspomagaczy typu title
>> właśnie - akurat te title w polach formularzy były czytane.
>> Nie sprawdzałem, tak tylko się zastanawiam ile w tym prawdy.
>> Powyższą wskazówkę przeczytałem kiedyś w książce, której redaktorem
>> był Jim Thatcher (http://jimthatcher.com/), więc wydawało mi się to
>> być rzetelne źródło. Zgaduję, że nie wszystkie readery tak to traktują.
>>
>
> aha ;] (nie za bardzo wiem ocb)
>
> Ale postanowiłem zrobić to tak, bez fieldset gdyż będzie się powtarzał
> tytuł w legend więc jest to bez sensu, fieldset było by lepsze dla kilku
> pól np do grupowania paru checkboxów. Wole sprawdzony sposób
>
> <div id="formularz">
> <form ...>
> <div>
> <label for="login">Login</label>
> <input type="text" name="login" id="login" value="Login" />
> <label for="pass">Hasło</label>
> <input type="password" name="pass" id="pass" value=" " />
> </div>
> </form>
>
> i tekst z label schowam przez text-indent,
> jak będe miał problemy z ostylowaniem jeden pod drugim to wpakuje w
> osobny div każdy input (no ale to chyba nie będzie konieczne bo input to
> element blokowy, skoro mogę mu nadać margines .)
>
>

Ależ sięzdziwiłem , gdyż nie mogę usunąć tekstu z label za pomocą
text-indent , co jest grane :) ?
Pozostaje na swoim miejscu lool.

label {
text-indent: - 9999px;
}

do góry

Dnia Wed, 24 Jun 2009 14:18:02 +0200, Radek N. napisał(a):

> [...]Zgaduję, że nie wszystkie readery tak to traktują.

Nawet nie sprawdzam - a jak to traktuje np. Lynx? Sprawdzałeś w Operze
Mini? Blazerze (czy innym NetFroncie)? ;)

ethanak
--
mailto=window.atob('ZXRoYW5ha0Bwb2xpcC5jb20=');
http://milena.polip.com/ - Nie bede czekac na Ivo :)

do góry