Jeśli chcesz przeczytać artykuły z innej kategorii, kliknij w wybrane przez siebie pole:

Jak zrobić stronę internetową?

Obierz zniżkę - 30%

w WebWave

Najnowsze artykuły:

Typografia to bardzo szerokie pojęcie i nie ma co ukrywać, że ma też swoje lata. Słowo pisane towarzyszy człowiekowi od tysięcy lat.- mówimy tu wręcz o czasach p.n.e. Pomimo tego, że pismo ewoluowało nadal stanowi ono niezwykle istotną formę przekazu. 

Rozwój technologi, internet i powstawanie licznych platform internetowych sprawiły, że poza słowem pisanym ręcznie oraz tym drukowanym powstała też potrzeba stworzenia jego cyfrowego odpowiednika. 

Jeśli posiadamy własną stronę lub chcemy zajmować się ich projektowaniem czy też np. rozwijać się przy tworzeniu szeroko pojętej grafiki, to z pewnością podstawy na temat typografi będą tu jak najbardziej przydatne. Jaki font będzie odpowiedni na stronie internetowej, a jaki nie powinien być wykorzystywany, gdzie szukać darmowych fontów i czy właściwie można mówić po prostu “czcionka”? Przekonaj się, czytając ten artykuł. 

Typografia 

Dla formalności na początku wyjaśnimy sobie samo pojęcie typografii.  

Nie ma ona jednego, sprecyzowanego objaśnienia, ponieważ na początku określano tak drukarnie oraz technikę druku (wypukłego).

W naszym przypadku to trzeci opis będzie najbardziej trafiony, ponieważ mówi on, że jest to dziedzina skupiająca się na kształtowaniu struktur oraz aranżowaniu języka w jego wizualnym wymiarze. 

Niektórzy mogliby zapytać…no dobrze, ale co ma druk do projektowania stron. Otóż jak już na wstępie wspomnieliśmy typografia to nie tylko materiały otrzymane “spod rąk” drukarni, istnieje bowiem coś takiego jak typografia cyfrowa i to właśnie ona będzie miała wiele wspólnego z tworzeniem grafik oraz kompletnych witryn, a nawet budowaniem marki. 

Podstawowe pojęcia związane z typografią

Chyba już nie jedna osoba domyśla się, że znajdziemy tutaj m.in. dwa pojęcia, których znaczenie mylone jest przez wielu…ale czy aby na pewno jest to błąd?

O co chodzi z wiecznym sporem o to, jak powinno się mówić - czcionka czy font, a może krój pisma?

Czcionka

Jest to metalowy bloczek, na który naniesiona jest litera. Dawniej czcionki wykorzystywane były w druku wypukłym. Obecnie powszechny jest już druk cyfrowy, przy którym nie wykorzystujemy czcionek.

Jedna czcionka zawierała na sobie jedną literę. 

Krój pisma 

Jest to rodzaj pisma, którego poszczególne znaki są spójne i mają podobne elementy - np. oś nachylenia, kontrast, grubość, zakończenia liter. Krótko mówiąc, jest to pewnego rodzaju wzór, spójny dla całości. Przykładem może być tutaj Arial, Lato, Helvetica itd.  

Krój pisma może być zarówno kompletem czcionek, jak i cyfrowym fontem.

Font

Jest to cyfrowy odpowiednik pisma.  Tradycyjna forma, krój pisma i jego charakterystyczne cechy wpływające na wygląd zostały tutaj przełożone na jego wirtualny odpowiednik- najczęściej w postaci pliku.

Jak mówić?

Mówiąc o wszystkim, co widzimy na ekranie monitora, powinniśmy mówić o foncie i ku temu skłaniają się puryści językowi. Jednak większość osób, które z typografią nie mają zbyt wiele wspólnego, a jedynie czasem muszą wybrać “czcionkę” w Wordzie, właśnie tego określenia użyją - czcionka. Co ciekawe w języku potocznym obydwa te słowa stosowane są jako synonimy. 

Dlatego możemy zadać sobie pewne pytanie - czy chcemy mówić prawidłowo, czy tak, jak większość?  Oczywiście warto mieć z tyłu głowy, co jest poprawne.

To nie jedyne pojęcia, które mają związek z typografią. Wyjaśnijmy sobie pokrótce jeszcze kilka z nich.

• Majuskuły  zwane też inaczej wersalikami, to nic innego jak wielkie litery alfabetu.

• Miniskuła, to przeciwieństwo majuskuły, czyli mała litera alfabetu, litera tekstowa, 

• Kapitaliki, to czcionka zawierająca w sobie same wielkie litery. Nie posiadają wydłużeń, a ich wielkość i grubość jest podobna do małych liter.

• Tracking polega na równomiernym rozsunięciu (lub też ewentualnie przybliżeniu) liter lub cyfr. 

• Kerningiem określamy manipulowanie światłem, a raczej wolną przestrzenią pomiędzy literami. W przeciwieństwie do tracingu odstępy mogą być nieregularne – niektóre znaki będą zbliżone, a inne oddalone.  Ta forma może nam się przydać m.in. przy projektowaniu haseł na plakatach czy podczas tworzenia logo. 

• Akapit jest pewnego rodzaju wyznacznikiem wątku. Rozpoczyna się wcięciem w tekście. W niektórych przypadkach może zostać zastąpiony nagłówkami. 

• Justowanie, czyli wyrównywanie wierszy tekstu. Sprawdza się w przypadku prasy, ale nie wygląda najlepiej przy tekstach rozłożonych na niemalże całą szerokość strony. Częściej wykorzystywane jest wyrównanie do lewej lub prawej strony.  

• Linia bazowa, to ta, która określa poziom ułożenia znaków (zarówno majuskuły jak i minuskuły) tworzących tekst. Ważne jest tutaj to, że dolne elementy znajdują się poniżej (np. ogonek w małym “y”). 

Przejdźmy teraz do kilku ciekawych określeń, z którymi przykładami zapewne spotkaliśmy się nie raz, czyli wdowa, szewc, bękart oraz sierotka. Słowa te nie kojarzą się zbytnio z typografią, a jednak. 

Co więc sobą reprezentują? 

Generalnie rzecz biorąc,  wszystkie będą pewną formą błędu. 

• Wdowa, czyli pozostawienie na końcu akapitu (lub łamu) np. jednego krótkiego słowa lub nawet samej końcówki przenoszonego słowa.

• Szewc również będzie pozostawieniem jednego krótkiego słowa lub końcówki przenoszonego słowa, ale tym razem na koniec strony.

• Bękart, to już błąd w składzie tekstu. Polega on na pozostawieniu na początku strony (lub łamu) niepełnego wiersza lub samego krótkiego słowa.

• Sierotka, to taki “opuszczony” znak np. może to być spójnik, który zamiast zostać przeniesiony do nowego wersu, zostaje na końcu starego.

Gdzie szukać fontów

Rzecz jasna do najpopularniejszego (i najprawdopodobniej najbardziej zaopatrzonego) źródła poszerzania naszej kolekcji fontów należeć będzie Google Fonts.  Warto, aby osoby rozpoczynające swoją przygodę z typografią zaczęły waśnie od tej pozycji. Znajdziemy tu zarówno darmowe jak i płatne fonty.  Pamiętajmy, że jeden font będzie miał wiele styli np. bold, thin, light itp. Dlatego też warto pobrać “całą rodzinę”, aby mieć do dyspozycji więcej wariantów. w bardzo wielu wariantach. 

Czy są jeszcze jakieś godne uwagi platformy z fontami? 

Oczywiście, że tak. Na uwagę zasługiwać mogą np.

• The Lost Type Co-Op (należy wykupić licencję),
• Dafont (darmowe, z możliwością darowizny dla autora),
• 1001Fonts (prywatne użycie jest darmowe),
• MyFonts (wymagana opłata),
• Envato (należy posiadać konto)

Jakie fonty wybierać na stronę internetową? 

Przede wszystkim powinny być one:

• przejrzyste

• dostosowane do contentu/tematu

• charakterystyczne (o ile możemy sobie na to pozwolić) 

Na stronę internetową można oczywiście wybierać przeróżne fonty. Nikt nie zabrania też samodzielnego ich zaprojektowania. 

Możemy użyć pisanek (kroje imitujące pismo ręczne) lub fontów szeryfowych w nagłówkach, a przy tych dłuższych tekstach pozostać jednak przy bardziej czytelnych fontach- te bezszeryfowe z pewnością się sprawdzą. Do podstawowych wyborów zaliczyć możemy m.in. Arial, Roboto lub Lato. Pamiętajmy też, że jeśli nasza grafika lub projekt strony zawiera w sobie polskie znaki, to musimy dopilnować tego, aby wybrany przez nas font je posiadał. W przeciwnym razie otrzymamy na to miejsce zdeformowane znaki psujące nie tylko przekaz, ale i estetykę. Oczywiście w niektórych przypadkach możemy temu zaradzić, edytując znak np. w Illustratorze, ale dodajemy sobie w ten sposób pracy, której mogliśmy uniknąć. 

Jeszcze a’porpos własnych fontów kreator WebWave umożliwił dodawanie własnych fontów z dysku. Mogą być one w formacie .ttf, .otf, .woff, .woff2. Dzięki temu jeszcze dokładniej dopracujemy projekt strony według własnej wizji.   

Podsumowanie

Podstawy typografii są konieczne dla każdego, kto ma styczność z tematem projektowania graficznego, tworzeniem stron czy też kreowaniem brandu. Wybór dobrego fontu pozwala na lepszą czytelność treści, a tym samym dobrze wpływa na wygląd (np. strony, plakatu itd.). Poza tym może on też wpłynąć na wzmocnie nie przekazu, dodać mu charakteru- wszystko zależy od naszych potrzeb.