Placeholder to nie etykieta

Kuszące jest umieszczenie podpowiedzi w polu i pominięcie etykiety. Jednak placeholder to podpowiedź, a nie nazwa. ⚠️

Gdy tylko ktoś zacznie pisać, placeholder znika. Nie pozostaje nic, co wskazywałoby, do czego służyło pole.

Użytkownicy z trudnościami z pamięcią lub koncentracją muszą zapamiętać podpowiedź po jej zniknięciu. Stała etykieta usuwa to obciążenie.

Tekst placeholder jest zwykle jasnoszary, przez co często nie spełnia wymagań dotyczących kontrastu. Użytkownicy słabowidzący mogą go w ogóle nie odczytać.

Szary tekst podpowiedzi może wyglądać jak już wypełniona wartość. Użytkownicy pomijają pole, a następnie zaskakuje ich błąd dotyczący wymaganego pola.

Obsługa placeholder jako nazwy przez czytniki ekranu jest nierówna i zależy od przeglądarki. Nie można zakładać, że zostanie odczytany.

Elementy placeholder sprawdzają się jako dodatkowe podpowiedzi, na przykład przykład formatu. Należy łączyć je z prawdziwą etykietą i nigdy nie używać ich samodzielnie.

Placeholder świetnie nadaje się jako przykład formatu, na przykład wzór daty. Etykieta nadal zawiera właściwą nazwę pola.

Pływające etykiety przesuwają się w górę po rozpoczęciu pisania, dzięki czemu nazwa pozostaje widoczna. To prawdziwa etykieta, tylko animowana, więc spełnia wymagania.

Szybki test: wpisz coś w polu. Jeśli nie możesz już stwierdzić, czego ono oczekuje, placeholder pełnił funkcję etykiety.

Kryterium WCAG Labels or Instructions wymaga jasnej, stałej nazwy. Pola zawierające wyłącznie placeholder regularnie nie przechodzą audytów.

Placeholder to znikająca podpowiedź, a nie nazwa. Należy zachować prawdziwą etykietę, a placeholderów używać wyłącznie jako dodatkowej pomocy dotyczącej formatu. 💡