Przejdź do treści

Informacja zwrotna

Wybór między komunikatami w treści, alertami, powiadomieniami i oknami dialogowymi — tak, by ludzie zauważali to, co ważne, a nie przerywało im to, co nieważne.

Każdy komunikat walczy o uwagę. Właściwy komponent zależy od tego, jak pilny jest komunikat i czy dotyczy czegoś na ekranie.

Wybór komponentu

KomunikatKomponentPrzykład
Dotyczy konkretnego polaFieldErrorWpisz adres e-mail, np. ada@acme.co.
Dotyczy fragmentu ekranu, widoczny na stałeAlertTwój okres próbny kończy się za 3 dni.
Potwierdzenie akcjitoastZapisano ustawienia.
Wynik zadania w tletoast z akcjąEksport gotowy — Pobierz.
Wymaga decyzji od razuAlertDialogUsunąć „acme-web”?
Globalny, dotyczy całego systemuAlert w nagłówku stronyPlanowane prace serwisowe dziś o 22:00 UTC.

Zasady

  • Jak najbliżej przyczyny. Pokazuj informację zwrotną tam, gdzie ludzie patrzą: błędy obok pól, wyniki obok przycisku, który je wywołał.
  • Przerywaj tylko wtedy, gdy potrzebna jest decyzja. Okna dialogowe wstrzymują wszystko — zostaw je na wybory, które nie mogą czekać. Cała reszta trafia do treści strony albo do powiadomienia.
  • Ulotne znaczy drugorzędne. Powiadomienia znikają. Nigdy nie umieszczaj w nich informacji, których nie da się znaleźć gdzie indziej, ani jedynego sposobu na naprawienie błędu.
  • Status to nie tylko kolor. Każdy komunikat o stanie ma ikonę i tekst.

Powiadomienia

  • Jedna linijka, jeśli się da; najwyżej dwie. Zacznij od rezultatu: Wysłano fakturę, a nie Sukces!
  • Proponuj jedną akcję — zwykle Cofnij lub Pokaż.
  • Błędy w powiadomieniach zostają, dopóki ktoś ich nie zamknie; potwierdzenia znikają same po 5 sekundach, a gdy są pod kursorem lub mają fokus, odliczanie się wstrzymuje.
  • Czytniki ekranu odczytują powiadomienia uprzejmie, nie przerywając bieżącej wypowiedzi; powiadomienia nigdy nie przejmują fokusu.
Faktura nr 2041 jest gotowa
Ada skomentowała „Strona główna v3”
Tygodniowy raport zużycia