Kolejka w warzywniaku, przystanek autobusowy, ławka w parku – właśnie w takich sytuacjach coraz częściej przeglądamy strony internetowe.
Zgodnie z danymi opublikowanymi przez StatCounter ruch mobile w 2023 roku wynosił w Polsce aż 70,50%, podczas gdy desktop wynosił zaledwie 29,52%
Nic dziwnego, że w projektowaniu treści do internetu zaczyna królować podejście „mobil-first”.
Jest wielce prawdopodobne, że pierwszy kontakt użytkownika z Twoją stroną WWW, sklepem online, blogiem czy landing page’em nastąpi właśnie na komórce. I jeśli czytelnik zobaczy na stronie zbitą ścianę tekstu, wyskoczy ze strony szybciej, niż na nią wszedł. Dlaczego?
Co znajdziesz w tym artykule:
Jak czytamy z ekranów mobilnych
Czym różni się czytanie na ekranie mobilnym od czytania na desktopie? Jak zauważa Joanna Wrycza-Bekier:
To już nie kartka papieru, lecz duży ekran jest tym miejscem, w którym oko czytelnika zwalnia. Na ekranie smartfona pędzi.
Średni czas spędzany na lekturze tekstów na smartfonach jest zazwyczaj dwukrotnie krótszy niż na komputerach.
Na urządzeniach mobilnych czytamy szybko i powierzchownie. Omiatamy tekst wzrokiem. Chcemy jak najszybciej skonsumować treść. I chcemy, żeby czytanie było tak łatwe i płynne, jak operowanie kciukiem, który przewija ekran.
Nie ma mowy o czytaniu słowa po słowie. Na komórce czyta się trudniej, dlatego stosujemy tzw. skim reading, czyli przeskakujemy między słowami i linijkami. Zamiast głęboko wnikać w sens tekstu, chwytamy kawałki wiedzy i układamy je w głowie po swojemu. A to już krok od nadinterpretacji i nieporozumień.
Do tego dochodzi przeciążenie poznawcze – na ekranie wyświetla się przecież tylko niewielki fragment całego tekstu, więc czytelnik musi wciąż wracać pamięcią do tekstu, który znikł już z ekranu. Na dodatek robi to w warunkach, które utrudniają mu skupienie.
Czy można więc skłonić czytelnika, żeby zatopił się w uważnej lekturze tekstu, nawet gdy czyta go z ekranu komórki? Tak – stosując zasady mobil writingu.
Na czym polega mobil writing
Gdy tworzysz tekst z myślą o użytkownikach mobilnych, zrób wszystko, żeby zwiększyć czytelność i komfort przeglądania. Oto, w jaki sposób:
Krótkie akapity
Używaj krótkich akapitów (2-3 zdania), aby ułatwić odbiór tekstu. Pamiętaj, że akapity, które wydają Ci się krótkie na dużym ekranie, na ekranie mobilnym mogą sprawić, że użytkownik będzie skrolować, skorolować i skrolować… Niech akapit nie będzie dłuższy niż 3-4 zdania.
Nagłówki
Zastosuj czytelną hierarchię wizualną tekstu. Wyróżnij nagłówki różnego rzędu (H1, H2, H3). Dzięki temu czytelnik szybko przeskanuje treść i wyłapie najważniejsze informacje.
Odwrócona piramida
Być może coś rozproszy czytelnika i nie doczyta tekstu do końca na ekranie mobilnym. Dlatego najważniejsze informacje umieść na początku treści. Sprawdza się tu zasada 3 ekranów – ważne treści powinny się pojawić na pierwszych 3 ekranach, jakie może przewinąć użytkownik.
Prosty język
Używaj krótkich zdań i zrozumiałych zwrotów. Unikaj technicznego żargonu (o ile to możliwe). Zwracaj się się bezpośrednio do użytkownika. Wyrzuć rzeczowniki i puste przysłówki czy przymiotniki Czasowniki, konkretne dane i obrazowe ożywią tekst.
Chcesz sprawdzić, czy Twój tekst zbudowany jest zgodnie z zasadami prostego języka? Wrzuć go do aplikacji Logios, która zbada tekst i zaproponuje nawet uproszczoną wersję tekstu.
Wyróżnienia i listy
Na ekranie mobilnym szczególnie ważne staje się formatowanie tekstu – pogrubienia, kursywy, wypunktowania i wszelkie wyróżnienia. Takie zabiegi podtrzymują uwagę odbiorcy i ułatwiają mu wyłowienie poszczególnych informacji z tekstu.
Biała przestrzeń
Wprowadź do tekstu oddech lub – jak mówią graficy – światło. Wprowadź odpowiednią szerokość marginesów oraz wielkość interlinii (odległości między akapitami). Biała przestrzeń sprawia, że nasz wzrok może swobodnie wędrować po ekranie.
Zajrzyj też do mojego tekstu: Chcesz, aby tekst na Twojej stronie wyglądał naprawdę pro? Pamiętaj o tych zasadach
Obrazy i grafika
Zdjęcia, obrazy i infografiki pobudzają uwagę użytkownika. Jednak nie powinny przytłaczać tekstu. W wersji mobilnej stosuj je z umiarem, żeby nie wydłużały strony. No i kompresja! Zwróć uwagę, czy zdjęcia nie są zbyt ciężkie i nie spowalniają ładowania strony.
A może… dwie wersje tekstu?
Niekiedy trudno jest pogodzić tekst na ekranie desktopowym i mobilnym. Na komputerze nagłówek brzmi i wygląda świetnie, a na komórce wyraźnie wypadłoby go skrócić. Na komputerze mamy ochotę dodać fikuśną animację tekstu, ale na mobilu może to utrudniać przekaz. Co teraz?
Wyjściem może być po prostu opracowanie dwóch wersji ekranu głównego – jedną na większe, a drugą na mniejsze rozdzielczości ekranu. Zobacz, jak wygląda to na stronie aplikacji Slack. Na pierwszym nagraniu widzisz nagłówek dla ekranu komputera.
Mobile writing – podsumowanie
- Na ekranie mobilnym czytamy szybciej i bardziej powierzchownie.
- Tekst na ekranie mobilnym musi być przejrzyście sformatowany i napisany prostą polszczyzną.
- Warto dodać w treści zdjęcia, infografiki oraz elementy wideo.