Quest: Projektowanie UX – tekst

Tekst

  1. Czytelność: Wybieraj czcionki, które są łatwe do odczytania na ekranie, np. bezszeryfowe dla tekstów głównych. Szeryfowe są dobre dla dłuższych treści w PDF-ach lub książkach cyfrowych.
  2. Rozmiar czcionki: odpowiedni dla platformy i zastosowania
  3. Liczba czcionek: Stosuj maksymalnie 2-3 rodzaje czcionek w całym projekcie, aby zachować spójność.
  4. Kontrast: Upewnij się, że kontrast między tekstem a tłem spełnia standardy WCAG
  5. Unikaj nadmiaru efektów: Nie stosuj nadmiernych cieni, gradientów czy ozdobników, które mogą utrudniać czytanie.
  6. Podział treści: Dzielenie tekstu na krótkie sekcje z nagłówkami ułatwia użytkownikowi przyswajanie informacji. Idealna długość to 3-5 zdań, aby użytkownik nie poczuł się przytłoczony. Zachowuj odpowiednie między akapitami, by poprawić czytelność.
  7. Przerywniki wizualne: Wzbogacaj tekst o listy punktowane, numerowane, cytaty i obrazy dla lepszej nawigacji.
  8. Jednolitość: Wszystkie akapity na stronie powinny mieć spójny wygląd i odstępy.

Marginesy

  1. Odstępy wokół tekstu: Ustaw wystarczająco duże marginesy wokół treści, aby uniknąć wrażenia „przeładowania” strony.
  2. Ograniczenie szerokości wiersza: Optymalna szerokość tekstu to 50-75 znaków na linię, co zwiększa komfort czytania.
  3. Responsywność: Upewnij się, że marginesy dostosowują się do różnych rozdzielczości ekranów.

Ogólne wskazówki UX

  1. Dostosowanie dla osób z niepełnosprawnościami: Zastosuj standardy WCAG (np. tekst możliwy do powiększenia o 200% bez utraty jakości układu).
  2. Unikaj chaosu wizualnego: Spójność wizualna w stylach, marginesach i układzie zwiększa zaufanie użytkowników.
  3. Czas wczytywania: Dobrze dobrane czcionki i układ tekstu nie powinny znacząco obciążać strony.

Quest

Które z powyższych zasad są spełnione na tej stronie z tekstem tego questa? Przygotuj jedną stronę z samym tekstem (np. Lorem ipsum) zwracając szczególną uwagę na jego formatowanie.

Quest: Projektowanie UX – menu

Tworzenie intuicyjnego menu i łatwej w obsłudze nawigacji na stronie internetowej to kluczowy element dobrego projektowania UX (User Experience). Oto zasady, które warto stosować:

  • Czytelność: Używaj prostych i zrozumiałych etykiet, np. „O nas”, „Kontakt”, zamiast złożonych opisów.
  • Hierarchia treści: Wyraźnie zaznaczaj sekcje i podsekcje, np. za pomocą rozwijanego menu.
  • Logika rozmieszczenia: Umieść najważniejsze elementy menu w miejscach, w których użytkownicy spodziewają się je znaleźć (najczęściej na górze lub po lewej stronie strony).
  • Jasne ścieżki: Użytkownik powinien zawsze wiedzieć, gdzie się znajduje na stronie, np. dzięki podkreślaniu aktywnej zakładki lub okruszkom nawigacyjnym (tzw. breadcrumbs).
  • Zasada trzech kliknięć: Użytkownik powinien dotrzeć do każdej podstrony w maksymalnie trzech kliknięciach.
  • Jednolity styl: Menu powinno wyglądać i działać podobnie na każdej podstronie.
  • Responsywność: Na urządzeniach mobilnych menu powinno być łatwo dostępne i intuicyjne, np. w formie rozwijanego „hamburger menu”.
  • Testy użytkowników: Przetestuj działanie menu z rzeczywistymi użytkownikami, aby zidentyfikować ewentualne trudności.
  • Analiza ruchu: Wykorzystaj narzędzia analityczne, by sprawdzić, jak użytkownicy poruszają się po stronie i optymalizować nawigację.
  • Dostępność (WCAG): Upewnij się, że menu jest dostępne dla osób z niepełnosprawnościami. Na przykład: wsparcie dla nawigacji klawiaturą, kontrast tekstu i tła w menu zgodny z wytycznymi WCAG.

Utwórz stronę o czymś konkretnym (o fizyce, o kotkach, o rowerach…) składającą się z przynajmniej 7 podstron/plików html. Może być ona prosta, ale ma mieć nawigację utworzoną zgodną z powyższymi zasadami.