Ux writing i dostępność

Kolejny tekst o pisaniu do interfejsów. Jeśli lubisz ten temat, to na pewno spodoba Ci się zestaw ux writera, który ostatnio wydałem. Znajdziesz tam rozdział na temat pisania dostępnej mikrokopii. Pozwól, że rozwinę nieco ten wątek o kilka nowych porad.

👉 Teksty alternatywne

Teksty alternatywne mogą być pomocne przy nawigowaniu po stronie za pomocą czytnika ekranu. Niestety wiele osób nadal nie dba o wdrożenie tekstów alternatywnych w projekcie, a co dopiero o napisanie czegoś oryginalnego.

Jeśli obraz nie ładuje się, na przykład z powodu problemów z połączeniem, opis alternatywny będzie widoczny również dla użytkowników nie korzystających z czytników ekranu — więc jest to pomocne wszystkim.

Podam Ci przykład, gdzie tekst alternatywny może być pomocny i pomoże rozluźnić atmosferę. Jest to produkt w sklepie, w którym brak jest zdjęcia. W tym momencie możesz napisać: brak zdjęcia, co daje wyraźną wskazówkę osobą niedowidzącym. Możesz też napisać: “To zdjęcie się schowało, chyba się wstydzi”.

👉 Ikony

Inny przykład, gdzie warto stosować odpowiednio napisany parametr ALT, są ikony.

Ikony wizualnie przekazują czego dotyczą, ale dla użytkowników, którzy nie widzą, nie zawsze są oczywiste. Nie opisuj ich, tak jak wyglądają np. domek, serce, koło zębate. Opisz jakie działanie lub funkcję uruchamiają: Ustawienia, Dodaj do obserwowanych, Strona startowa.

Jest to szczególnie ważne dla ikon podpowiedzi (tooltipów). Jeśli parametr Alt zostanie przy nich pominięty, użytkownik nie będzie wiedział o ich istnieniu, przez co może pominąć istotne informacje np.:

  • po co nam Twój numer karty?
  • jak uzupełnić to pole?
  • gdzie znaleźć numer abonenta?

👉 Loading

Inny przykład, gdzie mikrokopią możesz wpłynąć na lepsze samopoczucie użytkownika jest proces ładowania się, czy też stan oczekiwania.

Załóżmy, że użytkownik czeka na załadowania się aplikacji do nauki angielskiego. Tekst może brzmieć tak:

“Wczytywanie 55%”

Użytkownik niewidomy nie musi od razu wiedzieć, czego dotyczy to ładowanie. Dlatego warto zmienić go na taki tekst, dający wyjaśnienie sytuacji:

“Wczytywanie kursu 55%. Zaraz rozpoczniesz naukę”.

👉 Strony 404

Na stronach 404 spotkasz się często z wymyślnymi tekstami, które mimo tego, że są naprawdę oryginalnie napisane, nie przekazują, gdzie się użytkownik znajduje.

“Houston, mamy problem…mayday, mayday”.

Dla użytkownika niedowidzącego, taki komunikat nie wnosi żadnej wartości. W przypadku błędów lub pustych stanów napisz: strona nie została znaleziona lub nie ma wyników lub nie ma produktów w koszyku lub nowych powiadomień — a także wyjaśnij, jak postępować dalej.

👉 Tworzenie konta

Użytkownik w formularzu tworzenia konta, widzi nagłówek:

“Porozmawiajmy o biznesie”

Poniżej nagłówka widzi pola:

“Email / hasło”

Nagłówek nie mówi nic o tym, w którym miejscu znajduje się użytkownik. Pola email oraz hasło też nie wyjaśniają, że jest to formularz tworzenia konta. Pasuje też jako formularz kontaktowy czy newslettera. A wystarczy mała zmiana, do tego nagłówka:

“Porozmawiajmy o biznesie. Utwórz konto”.

Możesz też wzbogacić opis samych pól o dodatkowe wyjaśnienie:

“Email będzie Twoim loginem”.

Ten przekaz również daje do zrozumienia, z jakim typem formularza mamy do czynienia.

A może zainteresują Cię…

Ebook przeprojektowani

Naucz się projektować interfejsy biorąc pod uwagę ich wygląd oraz użyteczność.

Ebook idealny landing page

Jak zwiększyć konwersję strony docelowej poprawiając ux/ui oraz webwriting.

Książka + ebook o formularzach

Łatwe, przyjemne, dostępne, konwertujące. Takie mogą być Twoje formularze.

Zestaw UX writing

Twórz mikrokopię, którą pokochają użytkownicy. Ebook, framework, kurs.

Ebook WCAG + UX

Praktyczna wiedza o dostępności i doskonaleniu wrażeń użytkownika.

Ebook o pisaniu

Opowiadaj. Pokaż problemy. Podaj rozwiązania. Zachęć do działania.

Rzuć też okiem na:

Menu