Typografia w projektach internetowych ma znaczenie

12 stycznia, 2017

Jakiś czas temu wiele negatywnych komentarzy w tzw. środowisku otrzymała nowa strona jednego z najpopularniejszych sklepów z artykułami dziecięcymi ze względu na użycie na stronie czcionki Comic Sans. Faktem jest, że jest to chyba najbardziej wyśmiewana czcionka świata, a jeśli projektanci serwisu użyli jej świadomie i w dodatku nie celując w ironię, było to niewątpliwie posunięcie ryzykowne. Zaczęłam się jednak przy tej okazji zastanawiać, jak wielkie naprawdę znaczenie ma typografia w projektowaniu i jak bardzo przekłada się to na postrzeganie produktu końcowego.

Spis treści

O co w tym chodzi?

Typografia internetowa podlega w większości tym samym zasadom, co typografia w projektach drukowanych – te jednakże miały setki lat, by się rozwinąć i unormować, podczas gdy projektowanie w internecie często wciąż jeszcze musi „iść na kompromisy”. Czym w zasadzie jest typografia? To nic innego, jak projektowanie i stosowanie krojów pisma jako środka komunikacji. I mamy tu na myśli nie tylko samą czcionkę jako taką, ale też sposób ułożenia liter czy cyfr, znaki, rozplanowanie całych linii i akapitów, a w końcu również białe przestrzenie.

Dobra typografia w projektach internetowych może stać się gwarantem tego, że strona będzie w zamierzony sposób komunikowała z odbiorcami, jeśli jednak nie będzie odpowiednio przemyślana, nawet wspaniałe grafiki, palety i zdjęcia nie sprawią, że przesłanie będzie odebrane w zamierzony sposób. A często jednak ten element jest pomijany, bowiem ważniejsza jest komunikacja obrazkowa. Czy jednak słusznie?

Przykład strony wspomnianej we wstępie pokazuje, że coś w tym jest – coraz więcej mamy osób zainteresowanych projektowaniem, coraz więcej też komunikacji dostępnej nawet dla laików (memy ośmieszające jakąś osobę są już codziennością, jednakże istnieje również mnóstwo memów dotyczących używania niesławnej czcionki). Czy użycie Comic Sans przełożyło się w jakikolwiek sposób na wyniki biznesowe? Nie wiem, nie mam dostępu do wiarygodnych danych. Jednakże wizerunkowo na pewno nie było to korzystne.

Czego więc unikać?

Na to pytanie zapewne odpowiedziało już bardzo dużo wpisów, artykułów, czy choćby memów 😉 Ale pokuszę się o kolejną krótką opinię na ten temat.

Czcionka dobrana do wersji językowych

Celowo ustawiam to jako pierwszy punkt, ponieważ często mamy do czynienia z projektami wielojęzycznymi, strona  skierowana jest do odbiorców w różnych krajach, a nagle okazuje się, że wybrana czcionka nie ma znaków dla danej grupy językowej. Warto się upewnić, że wybrany przez nas krój ma dostępne znaki we wszystkich potrzebnych nam językach i nie będziemy musieli narażać naszych odbiorców na niesympatycznie wyglądające słowa z zastąpionymi znakami innym krojem.

Co za dużo, to niezdrowo

Mnogość dostępnych dzisiaj rodzin czcionek i ich odmian (pochylenie, pogrubienie) korci niewątpliwie, by stosować je z rozmachem. Warto jednak pamiętać, że tekst ma być przede wszystkim czytelny i forma nie powinna odwracać uwagi od treści.  Jeśli chcemy użyć więcej niż jeden krój, na dwóch warto poprzestać, przy czym trzeba dobrać je umiejętnie – jeśli jeden jest dominujący, wyjątkowo rzucający się w oczy, drugi powinien być bardziej stonowany, zdecydowanie mniej ozdobny i czytelny. Kroje muszą też do siebie pasować wizualnie – jeśli nie mamy pewności czy tak jest, możemy skorzystać z jeden z wielu dostępnych stron pomagających w doborze odpowiednich czcionek – Font Combinations  lub fontpair.co.

Szerokość bloku

Dzielenie tekstów na bloki i kolumny na stronie internetowej może wyglądać nieco inaczej niż w książce – tutaj musimy wziąć pod uwagę, że użytkownicy czytają na monitorze, tekst nie powinien więc być rozmieszczony w jednej kolumnie od brzegu do brzegu strony, łatwo bowiem wówczas zgubić linię i czytanie staje się kłopotliwe. Nie warto również dzielić jednego tekstu na więcej niż dwie kolumny – o czytelność wówczas równie trudno. Z zasady dla optymalnego komfortu – bez konieczności poruszania gałkami ocznymi –  linia tekstu powinna mieć około 66 znaków (mniej więcej 9 wyrazów).

Testowanie

Jak we wszystkim, tak w przypadku czcionek musimy przetestować – zwłaszcza używając webfontów – jak wyświetlają się one pod różnymi przeglądarkami. Bardzo często czcionka wygląda doskonale w projekcie, w Photoshopie wszystko pięknie się układa, ale wersja na żywo nie jest już taka idealna – zwłaszcza w przypadku cienkich krojów lub wersji Light , efekt może nie być tak zachwycający jak w projekcie. Google Fonts pozwala nam na przejrzenie wszystkich czcionek w środowisku internetowym, warto więc z tego skorzystać zanim zdecydujemy się na dobór kroju.

Podsumowując…

Projektowanie na potrzeby www to łączenie ze sobą naprawdę wielu dziedzin, aby produkt końcowy spełniał swoje cele, a typografia jest jednym z bardziej znaczących elementów. Trzeba znaleźć ten wspaniały punkt, w którym kolorystyka, dobór grafik, zdjęć, czcionek, wydźwięk i ogólna estetyka łączą się, a to nie zawsze bywa proste. Tak więc czy typografia jest najważniejsza? W większości przypadków nie. Czy ma znaczenie? Ogromne!