Formularze adresowe

Podanie adresu może być czasochłonne i frustrujące. Co to jest wiersz adresu 2? Prawdopodobnie nie masz nazwiska, więc co należy wpisać w polu Nazwisko? Unikaj tych nieporozumień i pomóż użytkownikom wypełniać formularze adresowe.

Zadbaj o to, aby formularz adresowy był łatwy w użyciu

Wiele formularzy używa jednego pola na imię, a drugie na nazwisko. Niektóre osoby nie mają nazwiska lub nie składają się z dwóch części. Jak wypełnić pole nazwiska? W polu nazwy użyj pojedynczego elementu <input>. Dowiedz się więcej o obsłudze różnych formatów nazw.

Użyj też pojedynczego elementu <input> dla adresu – nie każdy adres ma numer domu.

Zachowaj ostrożność przy opisach elementów sterujących formularza. Na przykład użytkownicy w Stanach Zjednoczonych podają ZIP, a w Wielkiej Brytanii kod pocztowy. Użyj reguły <label for="zip">ZIP or postal code (optional)</label>, aby użytkownicy wiedzieli, jakie dane wpisać. Pole kodu pocztowego powinno być opcjonalne – nie każdy adres ma taki kod.

Pomóż użytkownikom wpisać adres

Atrybut autocomplete może ułatwić użytkownikom ponowne wpisanie adresu:

  • autocomplete="name"
  • autocomplete="street-address"
  • autocomplete="postal-code"
  • autocomplete="country"

Możesz zdefiniować wiele wartości rozdzielonych spacją autocomplete. Załóżmy, że masz formularz z adresem dostawy i inny formularz z adresem rozliczeniowym. Aby poinformować przeglądarkę, który kod pocztowy jest powiązany z adresem rozliczeniowym, możesz użyć autocomplete="billing postal-code". Jako adres dostawy jako pierwszą wartość użyj shipping.

Atrybut enterkeyhint pozwala zmienić etykietę klawisza Enter na klawiaturach ekranowych. Użyj enterkeyhint="done" jako ostatniego elementu sterującego formularza i enterkeyhint="next" w przypadku pozostałych elementów sterujących formularza.

Zasoby