Typografia w sieci: Wyrównanie tekstu
W większości papierowych dokumentów, gazet czy książek tekst jest wyjustowany. Nasz mózg lubi symetrię, więc lepsze wrażenie robi na nim blok tekstu, który nie jest poszarpany. Niemniej jednak, justowanie odrobinę utrudnia czytanie. Trudniej jest zaczepić wzrok na ostatnim słowie w wierszu, ponieważ wszystkie linie mają jednakową długość. Czasami przez to potrafimy zgubić linijkę w trakcie schodzenia do kolejnej. Staramy się temu zapobiec stosując odpowiednią długość wiersza, jednak zawsze odpowiednia długość plus niejustowany tekst da lepsze rezultaty niż tylko odpowiednia długość. Jest to jedno z ustępstw jakie popełnia się by tekst wyglądał dobrze.
Justowanie wymaga precyzji. Nie wystarczy samo porozsuwanie wyrazów tak, aby wypełniły całą długość wiersza, ponieważ zdarzyć się może, że odstępy między nimi staną się okrutnie duże. Typografowie, oprócz manipulowania odstępami międzywyrazowymi, starają się również odpowiednio dobierać odstępy między znakami jak również przenosić niektóre wyrazy do kolejnej linii. W dzisiejszych czasach to żmudne zajęcie wspomagane jest przez profesjonalne oprogramowanie do składu tekstu.
Do tej pory nie radzą sobie z tym przeglądarki. Przy wyrównywaniu tekstu do obu stron manipulują tylko odstępami międzywyrazowymi, co często daje efekt bardzo rozstrzelonych wyrazów. Jest kilka metod pozwalających zadbać o ten aspekt przy odrobinie wysiłku, jednak część z nich obciąża zasoby komputera, a druga część wymaga bardzo dużej pracy przy ręcznej edycji tekstu. Dlatego też, mówiąc ogólnie, nie poleca się justowania tekstu na stronach internetowych.
p { text-align: justify; } /* justowanie */
p { text-align: left; } /* wyrównanie do lewej */
p { text-align: right; } /* wyrównanie do prawej */W krótszych tekstach możemy ręcznie pokazać przeglądarce w którym miejscu można podzielić wyraz. Robi się to za pomocą ­. Kiedy przeglądarka uzna, że podzielenie wyrazu w tym miejscu będzie korzystne dla czytelnika, przeniesie jego część do kolejnej linii.
Ręczne dba­nie o typografię.Na horyzoncie pojawia się CSS3 z nowym modułem tekstu. Twórcy przewidują w nim wsparcie dla automatycznego przenoszenia wyrazów do nowej linii (ang. hyphenation
) jak również wsparcia dla justowania z prawdziwego zdarzenia. W tej chwili przeglądarki dopiero starają się zadbać o ten aspekt i prawdopodobnie przyjdzie nam jeszcze trochę poczekać.
Automatyczne dzielenie wyrazów
Nowy CSS przewiduje kontrolę nad automatycznym dzieleniem wyrazów za pomocą własności hyphens:
none– zabroni dzielenia wyrazówmanual– podzieli wyraz tylko w miejscach, które sami wyznaczymy (tak, jak działa to teraz) za pomocą­lub znaków unicode U+00AD i U+2010auto– automatycznie podzieli tekst w odpowiednich miejscach
Pamiętajmy, że sposób dzielenia wyrazów zależny jest od języka tekstu. Specyfikacja CSS mówi, że możliwe będzie zaimportowanie własnego „słownika podziału wyrazu” za pomocą @hyphenation-resource. Jednak można się spodziewać, że przeglądarki same będą radziły sobie z określaniem tegoż jeśli w znaczniku <html> określimy wartość lang. Przeglądarki i tak posiadają już słowniki ortograficzne, więc logicznym następstwem wydaje się być dodanie w nich wsparcia dla podziału wyrazów. Specyfikacja oddaje nam też w ręce pełną kontrolę nad różnymi aspektami, jednak póki całość jest tylko szkicem, nie ma sensu się w nie zagłębiać.
Lepsze justowanie tekstu
W CSS3 znajdziemy również kilka przydatnych opcji jeśli chodzi o dokładniejsze justowanie. Szczególnie jedna z możliwości text-justify wydaje się interesująca: distribute powinno wyjustować tekst używając zarówno odstępów między wyrazami jak i między znakami.
Specyfikacja nie jest jednak jasna. W tej chwili brzmi nawet dość dziwnie, więc musimy poczekać dłuższą chwilę aż ustalone zostaną konkretny.
Komentarze
Na dzień dzisiejszy: http://code.google.com/p/hyphenator/
Obsługuje język polski.
Kret: Ale właśnie taki dodatkowy JS to IMO nie jest dobre rozwiązanie. Uruchom to na jakimś netbooku.
stare ;) napisałem sobie hyphenatora w etytorze i testowałem shy na moim poprzednim joggu ;) były czasy że tylko opera to porządnie obsługiwała, za to nie obsługiwała ZWNBSP.
btw, dobrze widzę że używasz radzieckiego fonta ? skoro już to pisz w cyrylicy, będzie lepiej wyglądać :) ktoś kiedyś nawet o tym na joggerze pisał: http://pawel-ciupak.jogger.pl/id/145357
całkem btw: jestem nieco zdziwiony że żaden z joggerowych pr0siaków nie raczy nas swoimi spostrzeżeniami na temat chrome os (a nie mogli się doczekać), oraz rewelacji na temat CSS4.
Warto również zadbać o NIE dzielenie niektórych wyrazów. Np. 30 MB, 10 zł, itp.
@Szymon: to prawda, cyrylica z tym fontem wygląda dużo lepiej
Przecież zasady "usability" mówią, że tekstu w Internecie się nie justuje....
prezes: Z powodów, które wymieniłem w tekście, a które powoli znikają. Znasz jakieś inne?
Justowanie bez dzielenia wyrazów to zło. Wstawianie ­ ręcznie to też zło. Trzeba się zastanowić nad tym js ;)
Prezes, a ja z chęcią zobaczę justowanie z prawdziwego zdarzenia w przeglądarkach. Może WikiBooks będą wreszcie normalnie wyglądać po wydrukowaniu. ;)
WikiBooks nie dawały normalnie wyglądających pdf-ów?
Kiedyś próbowałem jeden wydrukować i wersja w PDF-ie była niedostępna.
Dziwne, to się tworzy na żywo jakimś dziwnym softem. Wystarczy chwilę poczekać, żeby się wyrenderowało...
Rzeczywiście działa, niemniej kiedyś coś tam szwankowało. A skoro już tak offtopuje, do listy życzeń dorzuciłbym jeszcze łamanie tekstu na kolumny. Może rzadko używane ale również przydatne.
Kolumny na stronach to zło jeszcze gorsze niz justowanie...
Oj tam, oj tam. ;)
W tym :lepszym" wyrównaniu tekstu, tj. z podziałem wyrazów, i tak masz sierotki ;)
Grzegorz: O których miejscach mówisz? Ogólnie to miał być prosty przykład, robiłem to ręcznie.
Jak robisz podział ręcznie, to i sierotki możesz też wyciąć, nie?
Aaaa, mówicie o 'i', tak? Mógłbym faktycznie. ;)
O "i", a w porywach nawet o "po" :) Pod Worpdressem można skorzystać z rewelacyjnej wtyczki polskiego pochodzenia Wiszące Spójniki Wordpress Plugin.
Ciekawi mnie czy jest jakieś zaklęcie w CSS3 pozwalające osiągnąć taki efekt...
Z tego, co pamiętam, wikibooks, wikipedia i wiktionary korzystają z wewnętrznego kompilatora LaTeXa.