Overlap StudioWiedza UXJak prezentować treści na stronach?

Jak prezentować treści na stronach?

4
minut
Share

Nawet najciekawszy tekst może nie zostać przeczytany, jeżeli sposób jego prezentacji nie będzię odpowiedni. Jak uniknąć takiej sytuacji? Jak poprawić doświadczenia użytkowników (user experience) na stronach? Poniżej kilka  wskazówek, jak zwiększyć czytelność prezentowanych tekstów.

1. Paragrafy i wyróżnianie elementów

Obszerne bloki tekstowe mogą przytłaczać użytkowników. Zbyt długie linie tekstu, brak podziału na akapity, brak nagłówków i wyróżnienia kluczowych informacji to często spotykane błędy. Podział tekstu na akapity i nagłówki oraz wypunktowania i podkreślenia sprawiają, że tekst łatwiej przyswajalny. Użytkownik może od razu odnaleźć informację, której poszukuje.

2. Grupowanie wizualne i spójność

Chaotyczny układ zbyt różnorodnych elementów i brak grupowania wizualnego elementów utrudnia użytkownikom zorientowanie się, które części dotyczą aktualnie czytanego artykułu i do czego dokładnie się odnoszą. Odpowiednio zgrupowane i ujednolicone nagłówki i teksty  poprawiają czytelność tekstu. Użytkownik nie ma wrażenia chaosu i nie musi się nadmiernie skupiać czytając lub skanując tekst.

3. Układ krzyżowy czy wyrównanie do lewej strony?

Krzyżowy układ tekstu utrudniaużytkownikom na skanowanie i zmusza ich do ciągłego przenoszenia wzroku z jednej strony na drugą. Czytamy od lewej do prawej, więc umieszczenie tekstu z lewej strony pozwala na szybkie przeszukiwanie zawartości.

4. Kroje i kolory fontów

Zbyt małe fonty o niejednolitych kolorach i krojach oraz zbyt niski kontrast pomiędzy tekstem, a tłem sprawiają, że treści są nieczytelne. Tekst spełniający wymogi WCAG 2.0 pod kątem kontrastu, wielkości i kroju fontów jest przyjemny w czytaniu. Ma to znaczenie nie tylko dla użytkowników z problemami ze wzrokiem, ale dla wszystkich użytkowników stron internetowych.

5.  Układ tekstu na urządzeniach mobilnych

Zbyt duża wielkość fontów nagłówka, za mała interlinia oraz zbyt wąska kolumna z nieodpowiednio złamanym tekstem to częste błędy, które właściwie uniemożliwiają czytanie artykułu na urządzeniach z mniejszymi ekranami.

Dowiedz się więcej:

1.  Nielsen Norman Group: Zigzag Image – Text Layouts Make Scanning Less Efficient by Kim Flaherty

2.  Interaction Design Foundation: Visual Hierarchy – Organizing content to follow natural eye mov…by Mads Soegaard

3.  Smashing Magazine: 10 Principles Of Readability And Web Typography by Matt Cronin

4.  UX Planet: 10 Tips On Typography in Web Design by Nick Babich

5.  UX Planet: Mobile UX – Great Typography Enables Clear Communication by Nick Babich

6.  UX Planet: Mobile Typography – 8 Steps Toward Powerful UI by Tubik Studio

7.  Design Shack: Web Design Best Practices – Minimalism & Typography by Jerry Cao

8.  Intechnic: Best Practices to Improve Text Readability for Optimal User Experience by Andrew Kucheriavy

9.  Muzli: Typography In Mobile Design – 15 Best Practices To Excellent UI by Trista liu

Magdalena Kamińska

UX Designer & Researcher
Zwolenniczka kompleksowego podejścia do doświadczeń użytkowników z przygotowaniem psychologicznym. W Overlap Studio zajmuje się analityką i badaniami na potrzeby UX oraz projektowaniem rozwiązań zwiększających konwersję i satysfakcję klientów.

Jak możemy pomóc?

There is more to our services than just a new product. It's also e.g.:

Audits and Usability Tests
Website design and development
High-end user interface design
Adoption of the quantitative data to support the business model

Zapytaj o ofertę

lub skontaktuj się bezpośrednio pisząc na office@overlap.studio

Wysyłając tę wiadomość wyrażasz zgodę na przetwarzanie danych osobowych zgodnie z ustawą z dnia 10 maja 2018 r. o ochronie danych osobowych. Dane użyte zostaną wyłącznie do celów kontaktowych i przechowywane będą przez okres niezbędny do załatwienia sprawy. Administratorem Danych jest Overlap Studio sp. z o.o., ul. Niedźwiedzia 29b, 02-737 Warszawa, Polska.

Dziękujemy!

Wiadomość została wysłana!
Niedługo wrócimy z odpowiedzią.
Oops! Something went wrong while submitting the form.