Dobre praktyki przy projektowaniu witryn internetowych, część IV

Projektując grafikę dla stron www trzeba pamiętać, że nadal najistotniejszym elementem każdej strony jest tekst. Tak więc w naszych projektach odpowiednio dużo uwagi poświęcić musimy zagadnieniu takiemu jak

Typografia

Typografia publikacji internetowych kontynuuje tradycje wywodzące się z druku tradycyjnego, a więc sięga tradycji wywodzących się z czasów Gutenberga, a nawet wcześniejszych tradycji tyczących się np. kaligrafii. Jakkolwiek typografia tradycyjna różni się od internetowej, to w obu przypadkach idzie o to samo: o funkcjonalność, czytelność i estetykę. Tak naprawdę różnice leżą raczej w medium jakim się posługujemy, bowiem w obu przypadkach trzeba wykorzystywać wiedzę o tym jak działa ludzkie oko, jakie są zasady języka, alfabet, słownictwo, czym są porządek, różnorodność, rytm, kontrast, symetria, równowaga, napięcie, skala, przestrzeń, tekstura, kształt, światło, cień, kolor…

Nie zagłębiając się w tajniki typografii musimy zdawać sobie sprawę z konieczności panowania nad podstawowymi elementami charakteryzującymi elementy tekstowe naszych projektów. W ramach jednego artykułu trudno jest odnieść się całościowo do dziedziny tak rozległej jak typografia internetowa. Chcąc podsumować zasadnicze elementy składające się na typograficzny charakter strony www, należy wymienić:

• dobór czcionki: prawidłowo dobrana czcionka może decydować o charakterze strony. Czcionkę dobieramy tak, aby była zgodna z "duchem" projektu, z zasady ograniczając liczbę użytych krojów pisma. Stosujemy zwykle czcionki bezszeryfowe, ponieważ są one bezpieczniejsze w renderingu., tradycyjnie też, czcionki szeryfowe stosuje się do dłuższych tekstów. Więcej na ten temat w jednym z moich poprzednich postów.
  
• dobór rozmiarów pisma i rozmiarów odstępów: tutaj także trzeba kierować się estetyką i ogólnym stylem projektu, ale też nie można łamać dobrych zasad pochodzących jeszcze z zamierzchłych technik drukarskich. Dbać należy przede wszystkim o zachowanie równomiernego rytmu tekstu. Rozmiar pisma oraz odstępów powinien też być dobierany do przyjętej długości linii.
  
• optymalizowanie długości linii: długość linii tekstu powinna ułatwiać czytanie, co oznacza że linia nie może być zbyt krótka ale tez zbyt długa. Przyjmuje się, że optymalna długość wiersza ma wartość od półtorej do dwóch długości alfabetu złożonego małymi literami (27 znaków to minimalna długość wiersza, 40 optymalna, a 70 maksymalna), pod względem zaś liczby wyrazów optymalna długość wiersza to dziewięć lub dziesięć wyrazów (mieszczących średnio 5,5 znaków na wyraz).
  
• optymalizowanie rozmiaru stron: o tym będzie mój kolejny artykuł :)
  
• barwa tekstu: barwa tekstu nie istnieje oddzielnie od barwy tła, tak więc dobieramy ją przede wszystkim tak, aby poziom kontrastu zapewniał jak najlepszą czytelność, ponieważ nie istnieje nic gorszego jak tekst który zlewa się z otoczeniem. Niezależnie od faktycznej barwy istotnym parametrem tekstu jest "jednolita szarość kolumny" do której powinniśmy dążyć. W zależności od cech druku takich jak krój, stopień i odmiana czy odstępy, blok jednolitego (czarnego) tekstu staje mniej lub bardziej rozjaśniony (szary), co widać na przykładzie:
  
  AaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaa
  AaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaa
  AaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaa
  AaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaa AaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaa AaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaa
  AaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaaAaaaaaaaaa
  
  W naszym przykładzie łatwo identyfikujemy element "bardziej szary" niż reszta tekstu, takiego to efektu w miarę możliwości powinniśmy unikać.
   
• justowanie: nagminnym zjawiskiem jest wykorzystywanie obustronnego justowania tekstu. Nie polecam tej metody, ponieważ bardzo często tak sformatowany tekst wygląda śmiesznie bowiem jest "podziurawiony". Z dwojga złego lepsze jest wyrównywanie lewostronne, zaś najlepiej, jeśli dzielimy wyrazy korzystając z miękkiego podziału, co jest pracochłonne ale daje najlepsze efekty.

O typografii internetowej można by pisać niemal w nieskończoność. W końcu internet to medium oparte o przekazywanie treści w formie druku na ekranie monitora, a więc typografia odnosi się do niemal wszystkich zagadnień związanych z projektowaniem grafiki witryn internetowych. A ponieważ taka jest ogólna tematyka mojego bloga, proszę potraktować powyższy artykuł jako wstęp.