Najczęstsze błędy typograficzne na stronach internetowych

Najczęstsze błędy typograficzne na stronach internetowych

Idąc za tym, co można znaleźć w Wikipedii, typografia zajmuje się kształtowaniem struktur i aranżacją języka w jego wizualnym wymiarze. Tak to brzmi w teorii.

Przekładając to na strony internetowe, mówimy po prostu o odpowiednim „traktowaniu” wszystkich tekstów, które pojawiają się w sieci.

Wiem, iż wiele osób nie przywiązuje do tego większej wagi. Jak się okazuje – błędnie, gdyż tekst odgrywa kluczową rolę w internecie. Nie mam tu na myśli jedynie samej treści, lecz także właściwe przedstawienie tekstu pod kątem wizualnym.

Sprawdź zatem, jakie są najczęstsze błędy typograficzne na stronach internetowych i dowiedz się, dlaczego (oraz w jaki sposób) warto jest z nimi walczyć.

Najczęstsze błędy typograficzne na stronach internetowych – 10 rzeczy, których warto unikać

1. Zbyt wiele rodzajów fontów.

Minimalistyczne strony internetowe cechuje spójność. Pod tym terminem kryją się na przykład:

  • podobnie wyglądające elementy, które stosuje się w obrębie całej witryny
  • określona paleta barw
  • jednolity styl narracji i języka
  • stosowanie konkretnego zestawu fontów

Na ostatnią spośród ww. kwestii powinno się kłaść bardzo mocny nacisk. Występowanie zbyt dużej liczby fontów wprowadza chaos i psuje cały ład. Strona internetowa wygląda o wiele lepiej, gdy znajdują się na niej np. dwa fonty – pierwszy odpowiedzialny za normalny tekst, z kolei drugi za wszelkie nagłówki.

Oczywiście od wyżej wymienionej zasady jak najbardziej można robić wyjątki, jednak muszą być one silnie umotywowane.

2. Nieodpowiednia wysokość linii.

Omawiając najczęstsze błędy typograficzne na stronach internetowych, obowiązkiem wręcz jest omówienie kwestii wysokości linii.

Musi być ona… odpowiednia. Właśnie, tylko co to oznacza?

Odpowiednią wysokość linii znajdziesz np. w tym właśnie wpisie blogowym. Każda linijka tekstu ma nieco oddechu zarówno na górze, jak i na dole. Linie nie zlewają się ze sobą.

Wszystko to sprawia, że tekst jest czytelny i brnie się przez niego w miarę płynnie.

3. Zły dobór fontów.

W punkcie pierwszym wspomniałem o właściwej liczbie fontów, lecz nie powinno się zapominać także o odpowiednim doborze rodzajów fontów.

Ujmując sprawę krótko, font pokroju Times New Roman nie będzie zbyt dobrze wyglądał na nowoczesnej i świeżej stronie internetowej.

Fonty z rodziny „handwriting” (stylizowane na takie, które wyglądają niczym tekst pisany odręcznie) z kolei będą nieczytelne właściwie wszędzie. Nadają się one tylko do akcentowania pojedynczych wyrazów i odgrywają rolę wyłącznie artystyczną, ozdobną.

FontPair – koniecznie zapoznaj się z tym serwisem. Znajdziesz tutaj całe dziesiątki par fontów, które razem prezentują się wręcz znakomicie.

4. Niezwracanie uwagi na inne elementy.

Najczęstsze błędy typograficzne na stronach internetowych nie dotyczą jedynie samych fontów.

Aby strona internetowa miała odpowiedni „feeling”, podchodzenie do tekstu musi także respektować inne elementy, które znajdują się dookoła.

Każdy serwis składa się z przeróżnych fragmentów układanki, które razem muszą być po prostu spójne. Nie może być tak, że wstawienie tekstu w danym miejscu sprawi, iż np. jakiś obraz straci znacząco na swojej estetyce.

5. Niepotrzebne kombinowanie.

Jeden z najpopularniejszych wpisów na naszym blogu dotyczy tzw. prawa Hicka.

W bardzo dużym skrócie – podczas zastanawiania się nad różnymi możliwościami nie powinniśmy dawać sobie za dużej liczby opcji do wyboru.

Dlaczego?

Ponieważ jest nam wtedy coraz trudniej podjąć ostateczną decyzję.

Skup się jedynie na kilku rozwiązaniach, które z solidnych powodów wchodzą w grę. Przeprowadź „burzę mózgów” i pozostaw sobie tylko te możliwości, jakie mają sens.

Pamiętaj, że często – siłą rzeczy – nasze ostateczne wybory bywają nietrafione. Nikt nie każe od samego początku szukać optymalnych rozwiązań. Zawsze po pewnym czasie (np. po kilku tygodniach) można przeprowadzić testy A/B i na podstawie konkretnych danych wybrać coś lepszego.

6. Brak dzielenia treści na akapity.

Dobrze jest dzielić treść (np. wpisów blogowych) na akapity z kilku powodów.

Pierwszym z nich jest nadanie optycznego oddechu tekstowi. Zdecydowanie lepiej jest „robić entery” co jakiś czas, aby nie stawiać czytelników przed ogromną ścianą jednolitego tekstu.

Drugim powodem jest oddzielanie od siebie części tekstów, które traktują na dane tematy. Akapity umożliwiają „odcinanie” od siebie poszczególnych myśli. Czytelnicy mogą wtedy prościej przechodzić od danej części całości do kolejnej.

Trzeci powód to różnorodność. Raz większy akapit, innym razem mniejszy – takie działanie sprawia, że milej jest nam zapoznawać się z całym artykułem.

7. Niewłaściwa hierarchia nagłówków.

W naszych wpisach wielokrotnie wspominamy o nagłówkach w kontekście SEO. Pod tym względem liczy się zarówno liczba nagłówków w tekście, jak i oczywiście ich zawartość.

Jednak co z wyglądem?

Zasada jest prosta – im niższego rzędu jest dany nagłówek, tym powinien być optycznie mniejszy.

Wszystko dlatego, że samym rozmiarem można nadawać właściwą hierarchię wizualną. Jest to dla nas logiczne, że element większy jest ważniejszy od mniejszego.

8. Problemy z wyrównywaniem tekstu.

Justify text with HTML/CSS? Don’t do it! – jest to wpis, który polecam wszystkim osobom twierdzącym, że w sieci powinno się justować tekst.

Strony internetowe to nie książki. Nie mamy (jeszcze) takich możliwości, aby skutecznie dzielić wyrazy na sylaby i przenosić je do kolejnych linii, by nie powstawały „dziury”. Tym bardziej w dobie responsywności, gdzie każda rozdzielczość ma swoje własne wymiary i mieści określoną ilość tekstu w linii.

Najczęstsze błędy typograficzne na stronach internetowych nie dotyczą jednak tylko justowania. Problematyczne bywa również wyrównywanie tekstu do lewej lub prawej krawędzi, a także wyśrodkowywanie go.

W języku polskim czytamy od lewej do prawej, zatem taka właśnie sytuacja jest dla nas normalna – gdy każda kolejna linia zaczyna się w tym samym miejscu.

Wszelkie odstępstwa od tej reguły muszą mieć solidne podstawy. Jedną z nich jest np. centrowanie jakichś tytułów, które są krótkie i po prostu bardzo dobrze prezentują się na środku.

9. Ignorowanie czytelności.

Tekst musi być czytelny – „oczywista oczywistość”.

Jest to główna zasada, którą musisz mieć w głowie za każdym razem, gdy operujesz tekstem.

Owszem, niekiedy można puścić wodze fantazji i pójść w artystycznym kierunku, jednak czytelność właściwie zawsze musi stać na pierwszym miejscu.

10. Brak wyszukiwania ewentualnych błędów.

Na sam koniec kolejna oczywistość, tym razem związana z przeczesywaniem tekstu w poszukiwaniu ewentualnych błędów.

Polecam Ci wykonywać tę czynność na samym końcu – dopiero wtedy, gdy wiesz, że tekst ogólnie jest w formie „wyjściowej”.

Przydatne okażą się oczywiście wszelkie funkcje wbudowane w edytory tekstu, lecz także narzędzie o nazwie LanguageTool.

Najczęstsze błędy typograficzne na stronach internetowych – podsumowanie tekstu

Tak jak zdążyłem to już kilkukrotnie podkreślić, niezwykle ważna jest czytelność tekstu i ta właśnie zasada powinna być kluczowa absolutnie wszędzie.

Jeśli dorzuci się do tego odrobinę stylistycznych zabiegów, aby tekst był również przyjemny dla oka i po prostu ładny, masz miks idealny.

Spodobał Ci się ten tekst?

Jeśli sądzisz, że moglibyśmy Tobie pomóc, odezwij się do nas. Wypełnij bardzo prosty formularz szybkiej wyceny. Gwarantujemy szybką odpowiedź.

  1. Aleksander Habuda

    „Nie mamy (jeszcze) takich możliwości, aby skutecznie dzielić wyrazy na sylaby i przenosić je do kolejnych linii, by nie powstawały „dziury”.

    W 2019 już mamy 😉 Chociaż Chrome pod tym względem jest nawet za Internet Explorerem.

    caniuse => hyphens
    github => hyphenator

    PS. Coś o sierotkach by się przydało.

    Odpowiedz
  2. Zgred Darek

    A jakiego rodzaju błędem jest wstawianie przez autora tego artykułu kropek w nagłówkach? Typograficzny, interpunkcyjny?

    Odpowiedz
    • MobileTry logo
      MobileTry

      Darku – szczerze mówiąc – nie bardzo rozumiemy, jakie konkretnie błędy / nagłówki masz na myśli. Czy mógłbyś podać nam konkretne przykłady?

Oświadczam, że akceptuję postanowienia zawarte w polityce prywatności. *

Michał Ziółkowski

Co-founder agencji interaktywnej MobileTry z Olsztyna, świadczącej kompleksowe usługi przede wszystkim małym firmom. Specjalizacją agencji jest tworzenie stron internetowych i sklepów internetowych. Ponadto MobileTry prowadzi kampanie reklamowe w internecie oraz oferuje usługi z zakresu pozycjonowania.

Mało czytania? Nie ma problemu!

Sprawdź inne teksty powiązane z tym artykułem

Michał Ziółkowski

5 lat temu

Porady dotyczące user interface – 7 ważnych kwestii

Oto nasze porady dotyczące user interface, których wcielenie w życie sprawi, że Twoja strona internetowa będzie bardziej przyjazna odbiorcom. Sprawdź je!

Jakub Ozorowski

5 lat temu

Brak konwersji w sklepie internetowym – 10 typowych przyczyn

Brak konwersji w sklepie internetowym to niewątpliwie ogromny problem dla właścicieli stron e-commerce. Jakie są najczęstsze przyczyny tego stanu rzeczy?

Michał Ziółkowski

5 lat temu

Proces tworzenia strony internetowej – na czym polega?

Z jakich kroków składa się proces tworzenia strony internetowej? Jakie jego aspekty są istotne, a które mniej? Zobacz, jak proces ten powinien przebiegać.

Jakub Ozorowski

5 lat temu

Aktualizacja strony internetowej – kiedy najlepiej ją przeprowadzić?

W którym momencie aktualizacja strony internetowej powinna być przeprowadzona? Po czym poznać, że najwyższy czas na zmiany? Poznaj nasz poradnik.

Jakub Ozorowski

5 lat temu

Co irytuje użytkowników stron internetowych? – 14 kwestii

Czy wiesz, co irytuje użytkowników stron internetowych? Jakie są to elementy? W naszym wpisie wymieniamy kluczowe sprawy, na które musisz zwrócić uwagę.

Jakub Ozorowski

5 lat temu

Tworzenie własnego portfolio – co warto mieć na uwadze?

Tworzenie własnego portfolio to proces, który musi być solidnie przemyślany. Sprawdź więc, w jaki sposób można stworzyć własną, skuteczną teczkę z pracami.