Kompletny przewodnik po typografii internetowej: zasady, słowniczek, pomysły i najlepsze praktyki

Opublikowany: 2018-05-16

'Obraz jest wart tysiąca słów.'

Najczęściej zdjęcia przekazują to, co mają do powiedzenia. Jednak obraz z tekstem wywiera silniejszy wpływ.

Typografia działa jako towarzysz Twojej grafiki. Typografia to nie tylko wybieranie losowej czcionki i rozmiaru w punktach z rozwijanego menu oprogramowania do edycji. Jest to wyspecjalizowana dziedzina projektowania graficznego. To sztuka i technika układania pisma. Jest to jedna z ważnych umiejętności, która może Cię odróżnić od reszty projektantów, jeśli wiesz, jak z niej korzystać.

Czym jest typografia?

Zanim zagłębisz się w sztukę i technikę typografii, najpierw zrozum, o co chodzi w typografii. Typografia to wizualny fragment tekstu (słowa pisanego). Tekst to seria słów. Każdy wizualnie wyświetlany tekst, który widzisz, jest w zasadzie typografią. Tekst można kategoryzować na trzy sposoby – wizualnie, dźwiękowo i cyfrowo.

What is Typography?

Typografia to coś więcej niż projektowanie liter i znaków. Obejmuje wybór wielkości punktów, odstępów i długości linii. W czasach, gdy Johannes Gutenberg wprowadzał prasę drukarską, zecer musiał układać litery i znaki w przestrzeni fizycznej. Teraz w dobie komputerów ta praca jest dużo łatwiejsza. Musisz tylko znaleźć czcionki typu open source, ułożyć litery i znaki i gotowe.

Znaczenie typografii

Typografia to coś, co znajdziesz absolutnie wszędzie. Powiedzmy, że może to być Twój smartfon, filiżanka kawy, billboard, ubrania i wiele więcej. Typografia jest wszędzie. Wybór czcionki, litery i układu znaków decyduje o tym, jak Twoja wiadomość zostanie przekazana.

Nawet jeśli Twoim zdaniem wydaje się to małym czynnikiem, z pewnością tak nie jest. Nawet pojedyncza korekta typu może zmienić cały wygląd grafiki. Jeśli kiedykolwiek zauważyłeś, że Facebook przetestował nową czcionkę o nazwie Geneva w czerwcu 2016 r. Była to nieco cieńsza i lżejsza wersja oryginalnej czcionki Helvetica. Ale różnica między tymi dwiema czcionkami była zauważalna.

Zasady typografii

W typografii musisz wybrać krój pisma zgodnie z układem, siatką, motywem projektu, schematem kolorów i tak dalej. Oto kilka zasad typografii, o których należy pamiętać podczas pracy.

Rules of Typography

Wybór odpowiedniej czcionki

Jeśli spędzisz kilka minut w Internecie, znajdziesz zadziwiającą gamę gotowych do użycia darmowych i płatnych czcionek. Ale to nie znaczy, że musisz spędzać godziny na szukaniu dokładnie tych czcionek, które wizualizujesz w swoim umyśle. Możesz zacząć malować nawet z ograniczoną paletą. Istnieje kilka wypróbowanych i przetestowanych czcionek, takich jak Helvetica, które nigdy nie mogą się nie udać w żadnym projekcie.

Krój pisma to forma projektowania, którą tworzą rzemieślnicy, którzy wkładają cały swój wysiłek i umiejętności przez znaczny okres czasu. Profesjonalnie zaprojektowane czcionki oferują różnorodne możliwości dostosowania pod względem grubości i stylów, aby stworzyć kompletną rodzinę. Co więcej, oferują znaczne pary kerningu, wsparcie dla wielojęzycznego dostosowywania składu.

Poniżej znajdują się najważniejsze terminy typograficzne, które są brane pod uwagę:

Rozmiar

Nie każdy krój pisma jest tworzony jednakowo. Niektóre używają grubych i szerokich aspektów, podczas gdy inne są cienkie i wąskie. Różne rodzaje krojów pisma mogą uzyskać różną ilość miejsca na stronie.

Wysokość znaku jest oznaczona jako X-height. Kiedy łączysz różne kroje pisma, dobrą praktyką jest używanie tylko tych krojów, które mają podobną wysokość x. Z drugiej strony szerokość znaku nazywana jest „ustawioną szerokością”, która decyduje o tym, ile miejsca zajmie litera i buforuje się z innymi literami.

System punktowy to metoda stosowana do pomiaru typu od XVIII wieku. Punkt może być mierzony jako 1/72 cala, a 12 punktów może tworzyć jedną pica. Pica to jednostka miary szerokości kolumny. Ponadto rozmiary można mierzyć w pikselach, calach lub milimetrach. To zależy od wymagań projektu.

Prowadzący

Odstęp w pionie między poszczególnymi wierszami jest określany jako interlinia. Powodem, dla którego nazywa się to wiodącym jest to, że paski ołowiu były używane do dzielenia wierszy w czasach, gdy stosowano skład metalowy. Ogólną zasadą uzyskania czytelnego tekstu podstawowego jest użycie wartości wiodącej większej niż rozmiar czcionki. Możesz użyć wartości wiodącej wyższej od 1,25 do 1,5 raza.

Śledzenie i kerning

Kerning to czynność polegająca na dostosowaniu przestrzeni między postaciami. Pomaga stworzyć harmonijną parę.

Na przykład, gdy używasz wielkiej litery „A” z wielką literą „V”, ukośne pociągnięcia lewego górnego rogu litery „V” są kerowane z dolną prawą częścią „A”.

Z drugiej strony, śledzenie to termin, który odnosi się do rozmieszczenia wszystkich znaków, które są stosowane równomiernie. Kerning jest podobny do tracka, ale oba nie są takie same.

Mierzyć

Miara to termin, który wyjaśnia szerokość bloku tekstu. Aby uzyskać optymalne wrażenia z czytania, należy wziąć pod uwagę miarę jako ważny aspekt typografii.

Hierarchia i skala

Wszystkie typy nie mogą być używane w tym samym rozmiarze, musisz ustawić hierarchię typów. W przeciwnym razie czytelnikom trudno będzie zrozumieć, które informacje są najważniejsze od pozostałych.

Ogólnie rzecz biorąc, nagłówki są duże, podtytuły mniejsze, a typ ciała jest nieco mniejszy niż podtytuły, aby pomóc czytelnikom zrozumieć ich hierarchię.

Nie tylko rozmiar, zastosowanie różnych kolorów, wagi i odstępów może również pomóc w ustaleniu hierarchii w pracy.

Słowniczek

Omówiliśmy tutaj prawie każdą podstawową koncepcję i terminologię związaną z typografią.

Glossary

  • Aesc : Wymawia się je jako 'Ash'. Jest to podwiązanie dwóch liter mianowicie. „a” i „e”. Pochodzenie aesc wywodzi się ze staroangielskiego, gdzie jest oznaczane jako samogłoska dyftongu. Aesc przeniósł się do alfabetów takich jak islandzki i duński.
  • Apertura : Apertura jest zawiązanym otworem glifu, który można zobaczyć w literach takich jak „e”, rozmiar apertury różni się w zależności od jego implementacji. Ponieważ jednak będziesz zmieniać aperturę, jej efekt zostanie odzwierciedlony w czytelności litery.
  • Apex : Apex to punkt, który znajduje się na górze postaci. Jest to miejsce, w którym spotykają się lewe i prawe pociągnięcia.
  • Linia bazowa : jest to sekcja, w której znajduje się podstawa wielkich liter.
  • Miska : Miska jest uważana za zamknięte części liter, takich jak „b” i „p”.
  • Nawias : Jest to zarys przypominający klin, który jest cenny do przechowywania szeryfu i rdzenia formy czcionki w wielu krojach pisma.
  • Wysokość wersaliki : Wysokość wersaliki to wysokość wielkiej litery nad linią bazową.
  • Licznik : Licznik jest dołączoną lub niekompletną częścią formularza listowego. Licznik można zobaczyć literami typu „c” lub dolną częścią „g” i „e”. Ta sekcja może być pomieszana z miską.
  • Descender : Jest to fragment litery, który schodzi poniżej linii bazowej. Na przykład litery takie jak „p”, „y” i „q”.
  • Ucho : Ucho to niewielka kreska, która rozciąga się od górnej prawej strony muszli.
  • Glyph : Jest to pojedyncza część, która tworzy czcionkę. Zawiera każdy rodzaj pojedynczej części, która pomaga skonstruować czcionkę, niezależnie od tego, czy jest to znak interpunkcyjny, cyfra, litera, czy nawet dingbat. Glify można nazwać budulcem typografii.
  • Gutter : Jest to przestrzeń przewidziana pomiędzy sąsiadującymi stronami Twojej pracy. Rynny często można zobaczyć w kolumnach tekstu.
  • Osierocony : Osierocony to pierwszy wiersz nowego akapitu, który jest umieszczony w wątku na końcu strony. Nie jest to rzecz, którą chciałbyś mieć w swoim projekcie, ponieważ jest to uważane za złą praktykę.
  • Pica : Pica to jednostka miary szerokości kolumny. W jednym pica jest 16 pikseli lub 12 punktów.
  • Czytelność : Określa się ją jako łatwość czytania, która obejmuje użycie bloku tekstu, który można łatwo zeskanować wzrokowo.
  • Serif : Jest to krój pisma z szeryfami. Koniec kreski litery w tym kroju wywodzi się z tendencji rzymskiej.
  • Sans-serif : krój pisma bez szeryfowy to bezszeryfowy lub bezszeryfowy.
  • Kręgosłup : Jest to główny zakrzywiony ruch, który jest pisany małą literą „S”.
  • Ostroga : Jest to małe wybrzuszenie, które pojawia się na krzywiźnie litery. Nazywany jest również brodą lub dziobem. Na przykład – litera „G”.
  • Trzon : Obrys o pełnej długości jest nazywany trzpieniem w przypadku znaków pionowych. Jest pionowy.
  • X-height : wysokość litery „x” pisanej małymi literami w danym kroju pisma to wysokość x.

7 pomysłów na typografię i najlepszych praktyk

Typography Ideas and Best Practices

Poniżej znajdują się najlepsze praktyki typograficzne, których możesz użyć w swojej pracy. Skorzystaj z tych wskazówek w swoich projektach, aby stworzyć własne arcydzieła.

Znaczenie doboru odpowiednich czcionek

Każdy projektant ma listę swoich ulubionych czcionek. Nie oznacza to jednak, że musisz cały czas wybierać czcionkę tylko z listy ulubionych. Każdy krój pisma ma swój własny styl, osobowość i nastrój. Musisz więc zdecydować, która czcionka będzie idealnie pasować do Twojego projektu. Wybór czcionki jest ważny, ponieważ pomaga przekazać wiadomość odbiorcom.

Pamiętaj o swoich odbiorcach

Po wybraniu czcionki, która dopełni ideę Twojego projektu, powinieneś zastanowić się, czy będzie pasować do Twoich odbiorców. Jedna grupa docelowych odbiorców może uważać, że Twoje czcionki są modne, podczas gdy niektórzy uznają je za przestarzałe. Musisz więc zrozumieć, dla kogo projektujesz projekt. Przed podjęciem decyzji o czcionce należy wziąć pod uwagę wiek, płeć, lokalizację i inne czynniki odbiorców.

Skonfiguruj hierarchię

Jak wspomniano wcześniej, hierarchia odgrywa ważną rolę w typografii. Twoja grafika powinna być dobrze zorganizowana i powinna zapewniać łatwą nawigację do czytelników. Hierarchia typografii jest bardzo przydatna do tworzenia projektów z dużą ilością tekstu, takich jak książki, biuletyny, czasopisma i inne tradycyjne publikacje drukowane.

Zwróć uwagę na odstępy i wyrównanie

Odstępy i wyrównanie mogą wydawać się mniej ważne, ale z pewnością tak nie jest. Bez odpowiednich odstępów i wyrównania Twoje projekty będą wyglądać na zagmatwane, zagracone i zwyczajne. Odstępy obejmują użycie interlinii, marginesów, śledzenia i odstępów.

Używaj kerningu, kiedy tylko tego potrzebujesz

Wielu projektantów myli się między śledzeniem a kerningiem. Jednak oba są różnymi terminami. Kerning pozwala nadać typografii profesjonalny i dopracowany wygląd.

Nie przekraczaj używania krojów pisma, grubości i stylów

Wszyscy lubimy używać różnych czcionek i dostosowywać je, aby wyglądały elegancko. Jednak użycie różnych krojów pisma w jednym projekcie może sprawić, że Twoja praca będzie wyglądać na amatorską i niechlujną. Należy unikać używania więcej niż trzech czcionek w jednym projekcie, aby nadać mu profesjonalny wygląd.

Obserwuj i ćwicz

Jedynym wypróbowanym i przetestowanym sposobem na poprawę umiejętności typograficznych jest zbadanie, w jaki sposób inni projektanci wykorzystują typografię w swojej pracy. Jest to umiejętność, która wymaga praktyki i zwracania uwagi na szczegóły, aby zrozumieć, w jaki sposób ktoś wykorzystał typografię w swoim projekcie i jak będziesz mógł ją wykorzystać w swoich projektach.

To był ostateczny przewodnik po typografii. Mam nadzieję, że ten przewodnik pomógł ci zrozumieć różne koncepcje i praktyki, dzięki którym możesz poprawić swoje umiejętności typograficzne.