Dlaczego pełne justowanie tekstu w internecie to zły pomysł?

Drukowane wzorce

Choć tekst cyfrowy towa­rzyszy nam już od dłuższego czasu, zarówno na stronach inter­ne­to­wych, jak i na wyświe­tla­czach różnego rodzaju urządzeń mobilnych, czytników książek elek­tro­nicz­nych czy przedmiotów funk­cjo­nu­ją­cych w domenie internetu rzeczy, nasze przy­zwy­cza­jenia dotyczące pożą­da­nego wyglądu tekstu pochodzą raczej ze źródeł druko­wa­nych.

Ten stan jest płynny. Pokolenie, które aktualnie przy­chodzi na świat, może posiadać inne wzorce (ponieważ od wczesnych lat obcuje z tekstem cyfrowym), ale dla osób dorosłych w chwili, kiedy piszę ten tekst, stan­dardem czytel­ności są litery wydru­ko­wane na papierze.

Warto o tym pamiętać — wierzę, że jest to kluczowe do zrozu­mienia, skąd bierze się mit o uniwer­salnym pełnym justo­waniu tekstu, który skutecznie utrudnia czytel­ność zarówno małych i amator­skich stron inter­ne­to­wych, jak i dużych portali newsowych.

Wyrów­nanie lub justo­wanie tekstu­

Ko­lumnę tekstu możemy wyrównać na cztery sposoby:

1. do lewej krawędzi (w lewą chorą­giewkę),
2. do środka (centralnie),
3. do prawej krawędzi (w prawą chorą­giewkę),
4. wyrów­nując obydwie krawędzie (justo­wanie pełne).

Wyrów­nanie do lewej krawędzi (skład chorą­giew­kowy)

Forma­to­wanie do lewej krawędzi jest domyślne dla języków czytanych od lewej do prawej strony. Jest najprostsze w reali­zacji — zarówno w czasach składu ręcznego (sprzed epoki kompu­terów) — jak i dzisiaj, z wyko­rzy­sta­niem kompu­terów. Polega na ułożeniu liter od lewej krawędzi kolumny, zacho­wując jednakowe odstępy między­wy­ra­zowe, do prawej krawędzi kolumny. Wyrazy niemiesz­czące się w wierszu zostają prze­nie­sione w całości do następ­nego wiersza, gdzie proces powtarza się od początku. Warto wiedzieć, że w epoce cyfrowej ten proces jest bardzo skuteczny — błyska­wicznie radzą sobie z nim nawet urzą­dzenia internetu rzeczy oraz czytniki e-booków o niewiel­kiej mocy obli­cze­niowej.

 

Zwróć uwagę na wyróż­nienie w powyższym para­grafie: „Zacho­wując jednakowe odstępy między­wy­ra­zowe”. To bardzo ważne i przyda się w dalszej części tekstu.

Wyrów­nanie do środ­ka­

Taki sposób forma­to­wania tekstu przydaje się rzadko. Ze względu na nierówne wiersze, tekst wyrównany do środka nie powinien być dłuższy niż 2–3 wiersze. Czytając dłuższy paragraf, łatwo się pogubić. Oczy muszą ciężko pracować, żeby znaleźć kolejny wiersz, brakuje wspólnego punktu zacze­pienia.

 

Kiedy można pokusić się o taki format? Forma­to­wanie centralne przydaje się do elementów mających przykuwać uwagę lub do prostych form graficz­nych, gdzie tekstu jest niewiele. Przy­kładem może być ciekawy projekt wizytówki złożonej centralnie w pionie, gdzie wszystkie dane są wyrównane centralnie. Również obrazki w mediach społecz­no­ścio­wych mogą zostać opatrzone podpisem lub wezwaniem do działania umiesz­czonym centralnie. Warto jednak pamiętać, że taki tekst nie powinien być umiesz­czony z innymi ważnymi obiektami, z którymi będzie musiał rywa­li­zować o uwagę.

W forma­to­waniu centralnym ważny jest umiar przy jego stosowaniu — im jest go mniej w całości tekstu, tym lepszy efekt możemy uzyskać.

Wyrów­nanie do prawej krawę­dzi

To odpo­wiednik lewej chorą­giewki dla języków, których teksty zapi­sy­wane i czytane są od prawej do lewej strony (np. arabski lub hebrajski). W przypadku języków czytanych od lewej do prawej strony skład do prawej krawędzi ma rzadkie zasto­so­wanie. Najczę­ściej jest używany jako dodatek do tekstu głównego (margines) lub w niektó­rych tabelach, gdzie lewa kolumna tabeli pełni formę tytułów dla prawej części tabeli — wtedy wyrów­nanie tekstu do osi tabeli ma sens.

 

Zdecy­do­wanie nie powin­niśmy korzystać z wyrów­nania do prawej krawędzi dla tekstu głównego (dzie­ło­wego) dla języków czytanych od lewej do prawej strony. Dla czytel­ności jest to sytuacja podobna jak w przypadku wyrów­nania do środka — ponieważ lewa krawędź kolumny jest nierówna, oczy muszą wykonać ciężką pracę — nie mogą swobodnie i bez przeszkód poruszać się po bloku tekstu.

Justo­wanie pełne

Wyrów­nanie krawędzi jest z pozoru świetnym pomysłem. Po co zasta­na­wiać się, do której strony wyrównać tekst jak można jednym klik­nię­ciem wyrównać wszystko?

 

Jest tylko jeden drobny problem: Jeżeli wymuszamy równe krawędzie dla tekstu, to coś musi zostać rozcią­gnięte. Ponieważ odstępy między­li­te­rowe są krytyczne dla czytel­ności, zazwyczaj rozcią­gane są odstępy między­wy­ra­zowe. Zazwyczaj, ponieważ profe­sjo­nalne programy do składu tekstu druko­wa­nego radzą sobie z tym wyzwaniem całkiem nieźle, wpro­wa­dzając różne techniki mające na celu zopty­ma­li­zo­wanie światła między­wy­ra­zowego, np.:

• Zaawan­so­wane słowniki z pełną kontrolą łamania i prze­no­szenia słów (jeżeli odstępy są zbyt niejed­no­rodne i widoczne na pierwszy rzut oka, można skorzy­stać z bardziej agre­syw­nego dzielenia wyrazów);
• Algorytmy justujące całe paragrafy zamiast każdego wiersza z osobna (czytniki e-book nie posiadają wystar­cza­jącej mocy obli­cze­niowej, aby ten proces był niezau­wa­żalny dla użyt­kow­nika, powo­do­wałby również spore opóź­nienia w rysowaniu tekstu na kompu­te­rach mobilnych);
• Możliwość niewiel­kiego zmniej­szania lub zwięk­szania (2 – 3%) odstępów między­li­te­ro­wych (niezau­wa­żalnych dla czytel­nika) w celu uzyskania bardziej jedno­li­tych i satys­fak­cjo­nu­ją­cych odstępów między­wy­ra­zo­wych.

Prze­glą­darki inter­ne­towe, czytniki książek elek­tro­nicz­nych oraz urzą­dzenia internetu rzeczy (wyświe­tlacze w samo­cho­dach, pralkach i lodówkach, inte­li­gentne zegarki oraz inne produkty typu „wearables”) tego nie potrafią. Być może kiedyś się tego nauczą, a edytory tekstu takie jak Microsoft Word czy Google Docs zyskają zaawan­so­wane funkcje do składu znane z aplikacji do DTP. Niestety o ile mi wiadomo — nie jest to najbliższa przy­szłość.

Celowo wspo­mniałem o edytorach tekstu, ponieważ nie są od tego problemu wolne. Pisząc list moty­wa­cyjny albo pracę magi­sterską, bez specja­li­stycz­nego opro­gra­mo­wania do składu, justując tekst do obydwu krawędzi, w rzeczy­wi­stości czynisz go mniej czytelnym. Znacznie lepszym rozwią­za­niem będzie skład chorą­giew­kowy do lewej strony.

 

Proces czytania

Wprawny czytelnik czyta, prze­no­sząc wzrok skokowo wzdłuż wierszy tekstu. Te krótkie ruchy, nazywane sakkadami, oddzie­lone są przerwami fiksa­cyj­nymi, w trakcie których wzrok zatrzy­muje się na 0.2–0.4 sekundy. Wzrok ciągiem wielu sakkad bada wiersz, a potem jedną duża sakkadą powraca w lewo do początku następ­nego wiersza. Infor­macja przy­swa­jana jest tylko w momencie fiksacji. Przy prze­ciętnej wielkości pisma, stoso­wanej w książkach druko­wa­nych, sakkada obejmuje 5–10 liter, a więc w języku polskim jedno lub dwa słowa. Może się ona rozpo­czynać lub kończyć także w obrębie wyrazu. Podczas przerwy spoczyn­kowej spośród tych co najwyżej 10 liter ostro widziane są jedynie 3–4, które znajdują się w obszarze fiksacji, a pozostałe postrze­gane są przez oko niewy­raźnie i tylko w powią­zaniu z innymi. Jeśli sens tekstu nie jest jasny, oczy prze­ska­kują wstecz w sakkadach regre­syw­nych i upewniają się, co do tej pory <prze­czy­ta­ły>.
— Jost Hochuli, Detal w typo­grafii, wydaw­nictwo d2d.pl, Kraków 2009, s. 8

Jeżeli zależy nam na prze­ka­zaniu infor­macji — po co utrudniać ten proces?

Zbyt duże światło między­li­te­rowe lub między­wy­ra­zowe zaburza rytm. Ponieważ odstępy są płynne i nieprze­wi­dy­walne, oczy muszą włożyć więcej pracy w odczy­tanie tekstu. W efekcie rozu­mienie treści jest trud­niejsze i bardziej czaso­ch­łonne.

Posia­danie równych krawędzi jest nieistotne dla czytel­ności tekstu. Serio. Prawa krawędź prak­tycznie nie bierze udziału w procesie czytania. Po prostu dochodząc do niej, opusz­czamy ją, lądując w następnym wierszu. Miejsce wylą­do­wania jest istotne i dobrze, jeżeli jest dla wzroku prze­wi­dy­walne. Dlatego też wyrów­nanie dłuższego tekstu do środka lub do prawej krawędzi nie jest dobrym pomysłem.

 

Jeżeli nie potrafisz przy­zwy­czaić się do e-booków i nie do końca wiesz dlaczego, spróbuj prze­łą­czyć justo­wanie na lewą chorą­giewkę, zwiększ inter­linię i stopień pisma — oczy zapewne to docenią.

Czytelny tekst w inter­necie, jak to zrobić?

Istnieją różne wysu­bli­mo­wane metody forma­to­wania tekstu w inter­necie, a wiele z nich czerpie inspi­rację z dobrych praktyk drukar­skich. Jednak nie musisz być zawodowym typo­grafem, żeby ułatwić czytel­nikom odbiór tekstu. Wystarczy kilka prostych zasad:

1. Duże litery oraz czytelna inter­linia

Czasy tekstu o wielkości 12 pikseli już dawno minęły. Zamiast domyślnej rozdziel­czości 1024 × 768 pikseli sięgamy 1920 × 1080, a za sprawą tech­no­logii stoso­wa­nych w urzą­dze­niach prze­no­śnych, osiągamy zagęsz­czenie na ekranie rzędu 400 punktów na cal, co jest wartością wyższą niż standardy dla publi­kacji druko­wa­nych.

Obecnie uważa się, że absolutne minimum dla tekstu bazowego na stronach inter­ne­to­wych to 16 pikseli, choć w bardzo wielu przy­pad­kach nie warto schodzić poniżej 18 pikseli.

Czytanie tekstu z ekranu jest zwykle mniej komfor­towe niż czytanie z papieru. Warto zapewnić czytel­nikom odpo­wiednio dużo „powietrza” między wierszami, aby ułatwić proces czytania.

Przy­kła­dowo, tekst na moim blogu to 18/32 pikseli (wielkość / inter­linia), a na blogu Jacka Kłosiń­skiego (znanego blogera poru­sza­ją­cego się w tematyce branży kreatywnej) bazowe wartości to aż 21/34.

Jedno­cze­śnie pamiętaj, że tak duży tekst może nie wyglądać najlepiej na urzą­dze­niach mobilnych. Warto opracować osobną styli­stykę dla urządzeń prze­no­śnych, spraw­dzając czytel­ność tekstu w praktyce.

2. Odstępy między para­gra­fami

Wcięcia para­gra­fowe stosowane w druku nie spraw­dzają się w inter­necie. Lepszym rozwią­za­niem jest wpro­wa­dzenie odstępu między para­gra­fami o wysokości co najmniej jednego wiersza. W połą­czeniu z optymalną wiel­ko­ścią tekstu oraz inter­linii poprawi to ogólną czytel­ność i pozwoli odbiorcom lepiej zorien­tować się, w której części artykułu się znajdują.

3. Wyrów­nanie do lewej krawędzi (skład chorą­giew­kowy)

Na pełne justo­wanie tekstu mogą sobie pozwolić składacze DTP mający w swoim arsenale rozbu­do­wane opro­gra­mo­wanie do składu tekstu oraz lata doświad­czenia i wiedzy. Jeżeli tworzysz tekst cyfrowy wyświe­tlany w inter­necie, albo korzy­stasz z edytorów tekstu, stosuj skład chorą­giew­kowy do lewej strony.

Dzięki temu unikniesz nierów­nych odstępów między­wy­ra­zo­wych, kurio­zal­nych sytuacji w wąskich łamach zawie­ra­ją­cych wyrazy poroz­rzu­cane po krawę­dziach, oraz auto­ma­tycznie uczynisz tekst prze­wi­dy­walnym dla oczu nieza­leżnie od ilości wyrazów w wierszu.

Pamiętaj, że prawa krawędź tekstu jest nieistotna dla czytel­ności — wzrok opuszcza ją tak samo sprawnie nieza­leżnie od tego czy jest równa lub nie.

4. Zecer­ka­

Nie­za­leżnie od tego czy dasz się przekonać do porzu­cenia pełnego justo­wania na korzyść składu chorą­giew­ko­wego bądź nie, warto wzbogacić teksty prze­zna­czone do publi­kacji w inter­necie o funkcje, które oferuje darmowa usługa Zecerka. To serwis umoż­li­wia­jący auto­ma­tyczne popra­wianie typowych błędów typograficz­nych, w tym wiszących spójników, spacji przy znakach inter­punk­cyj­nych, polskie cudzy­słowy, forma­to­wanie dat oraz wiele innych.

Praw­do­po­dobnie najbar­dziej przydatną funkcją Zecerki jest możliwość wsta­wienia specjal­nych znaków HTML &shy;, które są następnie inter­pre­to­wane przez prze­glą­darkę jako poten­cjalne miejsca łamania wyrazów. Dzięki temu tekst układa się nieco efek­tyw­niej.

Na temat Zecerki pisałem już wcześniej, dowiedz się więcej.

5. Szerokość wiersza

W jednym wierszu tekstu głównego powinno zawierać się od 9 do 11 wyrazów. Taka ilość umożliwia płynne czytanie bez koniecz­ności podążania wzrokiem od krawędzi do krawędzi ekranu. Nie ma powodu abyś kazał swoim czytel­nikom kręcić głową podczas czytania treści na Twojej stronie.

Pamiętaj, że te praktyki odnoszą się do kolumn oraz bloków tekstu. Nie oznacza to, że cała strona inter­ne­towa nie może posiadać elementów pełnoekranowych. Po prostu tekst główny powinien mieć ogra­ni­czoną szerokość. Ja rozwią­załem ten problem zamykając treści blogowe w osobny kontener, węższy niż ogólna szerokość strony. Dzięki temu tekst znajduje się na środku ekranu i można go czytać bez obracania głowy.

6. Wyróż­nienia w tekście

Być może posiadasz niezwykle unikatową grupę odbiorców, która z zapałem czyta teksty od początku do końca, ale niestety staty­styki są nieubła­gane i wskazują na jedno — raczej nie czytamy tekstów na stronach inter­ne­to­wych, zamiast tego — skanujemy je. Jeżeli w para­grafie lub sekcji skła­da­jącej się z kilku para­grafów chcesz przekazać jakąś kluczową ideę — wyróżnij kluczowy fragment w tekście. Dzięki temu czytel­nicy zyskają okazję do „zacze­pienia się” o istotny z ich punktu widzenia fragment, odczy­tując pogru­bione zdanie w procesie skano­wania zawar­tości strony.

Pamiętaj jednak, że wyróż­nienie 50% tekstu to nie wyróż­nienie. Jeżeli potrze­bu­jesz wyróżnić aż tak dużą część, zastanów się czy pozostałe 50% w ogóle jest potrzebne. Napro­wa­dzenie czytel­ników na istotne treści to dobry pomysł, losowe wyróż­nienia — nieko­niecznie.

Niezwykle warto­ściowe jest także opatrzenie para­grafów odpo­wied­nimi nagłów­kami. Możesz je traktować jako zapowiedź lub stresz­czenie zawar­tości, która po nich następuje. Powszechne jest również pisanie nagłówków w formie pytań – dzięki temu łatwo trafić na inte­re­su­jące zagadnienia podczas scrol­lo­wania strony.

7. Kontra­st

Za­miast czarnego tekstu na białym tle, pomyśl o ciem­no­szarym tekście na jasno­szarym tle. Papier, w porów­naniu do ekranów LCD, nie świeci — posiada mniejszy, bardziej „naturalny” dla nas kontrast. Poek­spe­ry­mentuj z różnymi poziomami szarości — na początek możesz wybrać 90% szarość dla tekstu oraz 5% szarość dla tła. Różne wartości mogą dać lepszy lub gorszy efekt w zależ­ności od układu strony oraz doboru krojów pisma.

Niestety mało kto dba o odpo­wiednią kali­brację ekranu, a domyślne usta­wienia telefonów pozo­sta­wiają wiele do życzenia jeśli chodzi o ochronę wzroku, zamiast tego kusząc jaskra­wymi kolorami. Możesz zniwe­lować ten efekt zmniej­szając ogólny kontrast tekstu na swojej stronie.

8. Listy­

Je­żeli możesz coś napisać w formie listy — zrób tak. W prze­ci­wień­stwie do jednego, długiego tekstu, punktory są skończone i zazwyczaj zawierają dużo warto­ścio­wych infor­macji na małej prze­strzeni. Jest całkiem praw­do­po­dobne, że zawar­tością listy skłonisz swoich czytel­ników do prze­czy­tania reszty tekstu.

Podsumowanie

Ży­jemy w szumie infor­ma­cyjnym. Stosujemy różne techniki, które pozwalają nam wybierać istotne infor­macje spośród setek komu­ni­katów, które trafiają do nas każdego dnia. Szukamy infor­macji, wybie­rając spośród innych infor­macji. Konku­rencja jest duża.

Warto przy­go­tować tekst tak, aby był czytelny. Być może pomyślisz, że to przesada, ale dla poten­cjalnego czytel­nika samo dotarcie do Twoich mate­riałów to nie lada wyzwanie. Trzeba sięgnąć po telefon, wystukać zapytanie w wyszu­ki­warkę, poprze­suwać palcem po ekranie, czytać, prze­twa­rzać, zasta­na­wiać się. To mnóstwo pracy, jeżeli wziąć pod uwagę, że każdy wykonuje wiele podobnych czynności w trakcie dnia.

Wbrew pozorom granica pomiędzy: „Tak, znalazłem to, czego szukam, zaraz się wszyst­kiego dowiem!”, a „tego się nie da czytać, poszukam gdzieś indziej” jest bardzo cienka.