4.7
(18)
Ten wpis przeczytasz w czasie 4 minut!

Typografia od podszewki. Praktyczne porady

Wygląd tekstu powinien iść w parze z jego treścią. Przez wygląd mamy na myśli czytelność i estetykę. Nawet jeśli użytkownik trafi na Twój artykuł, niedociągnięcia w tych obszarach mogą skutecznie zniechęcić go do dalszej lektury.

Nieodpowiednie fonty, za małe odstępy między wersami, nadmierne użycie czcionek szeryfowych czy pogrubień… Moglibyśmy wymieniać i wymieniać. Zamiast tego, stawiamy na profilaktykę. Odkryj kilka praktycznych porad, które poprawią czytelność i wizualną atrakcyjność Twoich treści.

Kilka słów o typografii

Kluczem do tworzenia czytelnych i funkcjonalnych treści jest zrozumienie zasad typografii. Wykorzystując w praktyce zasady właściwego rozmieszczenia tekstu, ułatwiasz czytelnikowi odbiór treści. Możesz to zrobić wybierając odpowiedni rozmiar fontów, zwracając uwagę na układ tekstu oraz relacje między znakami. Proste, prawda? Jest jeden haczyk. Jeśli tworzysz treści przeznaczone do publikacji w internecie, musisz pamiętać zarówno o użytkownikach komputerów, tabletów, jak i smartfonów. Twoje teksty będą wyświetlane na różnych urządzeniach i ekranach o różnej rozdzielczości, więc musisz zadbać o dopasowanie wyświetlanej treści do rozmiaru różnych wyświetlaczy. Typografia świadczy ponadto o Twojej marce! Jest jednym z elementów składających się na jej identyfikację wizualną. Dbając o ten aspekt pomagasz odbiorcom zrozumieć Twoją markę. 

Czcionka czy font?

Choć te dwa terminy są używane na przemian w mowie potocznej, ich znaczenie nie jest takie samo. Trochę lekcji historii – w tradycyjnej technice drukarskiej czcionka odnosiła się do klocka metalu z wypukłym znakiem, który następnie odbijano na papierze. Dzisiaj można śmiało powiedzieć, że font wyparł czcionkę. Zamiast odlewania i odciskania liter projektuje się je w dedykowanych programach. Font, czyli cyfrowy obraz znaku a inaczej zestaw czcionek w elektronicznej postaci. Pojęcia choć różne, to używane zamiennie. Chyba, że jesteś językowym purystą.   

Z szeryfem czy bez?

Każdy znak posiada swój indywidualny kształt, a razem z szeryfami czy interlinią tworzy harmonijną całość zwaną krojem pisma. To jaki krój wybierzesz ma istotny wpływ na odbiór Twojego tekstu, gdyż określa on styl, grubość i proporcje wszystkich liter, cyfr i znaków specjalnych. Wyróżniamy dwa podstawowe kroje pisma: szeryfowe i bezszeryfowe. Czym właściwie się różnią?

Szeryfowe

Kroje szeryfowe to te bardziej dekoracyjne. Swoja nazwę zawdzięczają szeryfom, czyli ozdobnikom stosowanym na zakończeniach liter, zarówno poziomych, jak i pionowych kresek. Ich geneza sięga czasów, kiedy litery były wykuwane dłutem w kamieniu – poziome lub pionowe zakończenia ułatwiały pracę narzędziem. Jak się jednak okazuje szeryf szeryfowi nie równy. W niektórych krojach szeryfy mogą również występować na średniej linii znaku.

Wyróżniamy ich kilka typów:

  • szeryfy klinowe – przypominają trójkąty. Znajdziesz je w logo wytwórni DreamWorks Pictures (Minion Pro)
  • szeryfy belkowe – mają postać prostokątów. Na pierwszych stronach niedzielnego wydania New York Times (Stymie Extra Bold)
  • szeryfy kreskowe – czyli cienkie linie kontrastujące z głównymi elementami litery. Przykładów możesz szukać robiąc zakupy. Ten typ szeryfów jest widoczny w logo Zary (Bodoni)
  • szeryfy skryte – subtelne poszerzenia na końcach liter. Stosowane w logo komiksu o znanym rudym kocie lubiącym lasagne. (Cooper Black)

Bezszeryfowe

To te bez ozdobników. Świetnie sprawdzają się w nagłówkach i tytułach. Jeśli Twój projekt ma być zgodny z zasadami minimalizmu, postaw właśnie na te kroje. Są one bardziej czytelne, stąd z reguły stały się standardem w projektach graficznych. I nie tylko. Do najpopularniejszych przykładów bezszeryfów możemy zaliczyć Arial czy Montserrat.

Typografia w praktyce

Niech przyświeca ci jeden nadrzędny cel – zapewnienie czytelności tekstu. Zasady typograficzne mogą na pierwszy rzut oka wydawać się skomplikowane, ale kiedy się w nie zagłębisz, docenisz ich prostotę i przydatność. W końcu piękno tkwi w prostocie.

Wybierz rozmiar fontu

W przypadku treści internetowych najlepiej sprawdzają się rozmiary od 15 do 25 pikseli. Warto jednak pamiętać, że różne fonty mogą wyglądać na większe lub mniejsze, mimo identycznej wielkości, dlatego ważne jest dostosowanie się do konkretnego projektu.

Zachowaj odległość

Zbyt mała interlinia może utrudniać śledzenie tekstu, a zbyt duża rozpraszać czytelnika. Na odległość między wierszami ma wpływ krój pisma, jego wielkość, grubość oraz długość linii tekstu. Kluczem jest, aby odstępy między wierszami były większe niż przestrzeń między wyrazami.

Dostosuj długość wierszy

W trosce o komfort czytelnika rezygnuj z długich wierszy. Zbyt długie najzwyczajniej są obciążeniem dla oczu. Optymalny wiersz, powinien mieć od 50 do 75 znaków.

Nie przesadzaj z długością akapitów i liczbą czcionek

W obu przypadkach mniej znaczy więcej. Gwarantujemy, że ściana tekstu skutecznie zniechęci czytelnika. Kiedy dodamy do tego dużo różnych fontów przed oczami zapanuje chaos, nie mówiąc o powolnym ładowaniu strony (przeglądarka musi przecież pobrać i wyrenderować każdą czcionkę). 

Powiedz NIE wiszącym literom 

Jednym z najczęściej popełnianych błędów typograficznych jest pozostawianie spójników i przyimków na końcu wierszy. Mamy na to prostą radę. Przerzucaj wszystkie a, i , o, w, z do następnej linijki. Nie zaburzysz wówczas płynności czytania i estetyki tekstu. Jeśli nie chcesz robić tego ręcznie, możesz być spokojny. Dzisiejsze edytory tekstu są wyposażone w automatyczne narzędzia, które Ci w tym pomogą. 

Czarno na białym

Unikaj kombinacji kolorów, które skutecznie utrudniają odczytanie tekstu. W tym przypadku żółty nie idzie w parze z białym, ani czerwony z zielonym. Postaw na bezpieczne opcje – ciemny tekst na jasnym tle i analogicznie jasny tekst na ciemnym tle. Pamiętaj, że kontrast ma bezpośredni wpływ na czytelność Twojego tekstu.

Podziel się:

Podobał Ci się artykuł?

Kliknij gwiazdkę, aby go ocenić!

Średnia ocena 4.7 / 5. Głosowało: 18

Brak głosów! Bądź pierwszą osobą, która oceni ten post.

Picture of Jakub Burnatowski

Jakub Burnatowski

Jestem specjalistą ds. frontendu stron i sklepów internetowych oraz ekspertem w obszarze WordPress. Moje umiejętności obejmują tworzenie estetycznych i responsywnych interfejsów, które zachwycają użytkowników. Jako specjalista WordPress, dostarczam spersonalizowane rozwiązania, optymalizację i integrację strony lub sklepu online. Moje doświadczenie pozwala mi tworzyć wyjątkowe doświadczenia użytkownika, zgodne z najnowszymi trendami.

Chcesz więcej wiedzy?

Sprawdź także