Skip to main content

Omówienie podstaw typografii

Typografia, dlaczego jest ważna? (Czerwiec 2026)

Typografia, dlaczego jest ważna? (Czerwiec 2026)
Anonim

Aby użyć najbardziej podstawowego wyjaśnienia, typografia polega na projektowaniu i używaniu krojów pisma jako środka komunikacji. Wiele osób uważa, że ​​typografia zaczęła się od Gutenberga i rozwój ruchomego typu, ale typografia sięga znacznie dalej. Ta gałąź designu ma swoje korzenie w odręcznych literach.

Typografia obejmuje wszystko, od kaligrafii przez typ cyfrowy, który widzimy dzisiaj na stronach internetowych wszelkiego rodzaju. Sztuka typografii obejmuje również projektantów typów, którzy tworzą nowe formy listew, które następnie są przekształcane w pliki czcionek, które inne projekty mogą wykorzystywać w swojej pracy, od dzieł drukowanych do wyżej wymienionych stron internetowych. Tak różne, jak te dzieła, podstawą typografii są wszystkie.

Elementy typografii

Jeśli kiedykolwiek rozmawiałeś z projektantem stron internetowych, który wykorzystuje typografię w swojej pracy, prawdopodobnie słyszałeś słowa "krój pisma" i / lub "czcionka". Wiele osób używa tych dwóch terminów zamiennie, ale faktycznie istnieją pewne różnice między tymi dwoma elementami.

Typeface to termin nadany rodzinie czcionek (takich jak Helvetica Regular, Helvetica Italic, Helvetica Black i Helvetica Bold). Wszystkie różne wersje Helvetica tworzą kompletny krój pisma.

Czcionka jest terminem używanym, gdy ktoś odnosi się tylko do jednej wagi lub stylu w obrębie tej rodziny (np. Helvetica Bold). Tak wiele krojów pisma składa się z wielu pojedynczych czcionek, z których wszystkie są podobne i podobne, ale różnią się w pewien sposób. Niektóre kroje czcionek mogą zawierać tylko jedną czcionkę, podczas gdy inne mogą zawierać wiele odmian form literowych, które składają się na czcionki.

Jeśli wydaje się to mylące, nie martw się, jeśli ktoś nie jest ekspertem od typografii, najprawdopodobniej użyje określenia "czcionka", bez względu na to, które z tych terminów tak naprawdę oznacza, a nawet wielu profesjonalnych projektantów używa tych dwóch terminów zamiennie. Jeśli nie rozmawiasz z czystym projektantem typu o mechanice rzemiosła, prawdopodobnie jesteś całkiem bezpieczny, używając dowolnego z tych dwóch terminów, które preferujesz. Biorąc to pod uwagę, jeśli rozumiesz rozróżnienie i potrafisz właściwie używać właściwych terminów, to nigdy nie jest złe!

Klasyfikacje czcionki

Czasami nazywany "ogólnymi rodzinami czcionek", są to duże grupy krojów pisma oparte na wielu ogólnych klasyfikacjach, w których różne czcionki się znajdują. Na stronach internetowych istnieje sześć rodzajów klasyfikacji czcionek, które prawdopodobnie zobaczysz:

  • Serif
  • Sans-serif
  • Scenariusz
  • Monospaced
  • Kursywny
  • Fantazja

Istnieje również wiele innych klasyfikacji czcionek, które są ich pochodną. Na przykład czcionki "slab serif" są podobne do czcionek szeryfowych, ale wszystkie mają rozpoznawalną konstrukcję z grubymi, grubymi serifami na literach. Serif i sans-serif to dwie najczęstsze klasyfikacje czcionek, które są używane w większości witryn internetowych.

Anatomia kroju pisma

Każda czcionka składa się z różnych elementów, które odróżniają ją od innych krojów, co określa się mianem anatomii kroju pisma. Jeśli nie masz zamiaru wchodzić w typ projektowania i chcesz tworzyć zupełnie nowe czcionki, projektanci stron internetowych muszą po prostu znać podstawy terminologii krojów pisma.

Na poziomie podstawowym elementami anatomii kroju pisma, o których powinieneś wiedzieć, są "cap" i "x-height" oraz "downcenders" i "ascenders".

Cap i x-height to wysokość wielkich liter w kroju pisma i wysokość litery x. Mówi ci, jak wysokie będą największe litery, a także jak wielkie będą małe litery. Wszystkie czcionki są sortowane według tych dwóch cech.

Pochyłacze i wznoszące się fragmenty to fragmenty liter, które znajdują się poniżej linii X-height. Zazwyczaj odnosi się to do małych liter. Na przykład litera "b" ma wznoszący się (element, który "wystaje" w górę z litery), podczas gdy litera "p" ma podcięcie (części, które zanurzają się "w dół" od litery).

Rozstawianie listów

Istnieje kilka korekt, które można wprowadzić między literami i wokół nich, które wpływają na typografię. Czcionki cyfrowe są tworzone z wieloma tymi cechami, a na stronach internetowych mamy ograniczone możliwości zmiany tych aspektów czcionki. Często jest to korzystne, ponieważ zazwyczaj preferowany jest domyślny sposób wyświetlania czcionek.

  • Kerning: Pozioma przestrzeń między poszczególnymi literami
  • Śledzenie: Przestrzeń między grupami liter
  • Prowadzący: Pionowa przestrzeń między wierszami typu (jest to tak zwana wysokość wiersza w terminach witryny)
  • Zmierzyć: Długość linii tekstu
  • Wyrównanie: Wizualne umieszczanie tekstu w lewo, w prawo, wyśrodkowany lub usprawiedliwiony
  • Ligatury: Litery poruszały się tak blisko siebie, że ich anatomie są ze sobą połączone, zasadniczo przepływając jedną literę do drugiej

Więcej elementów typografii

Typografia to coś więcej niż kroje pisma, które są używane, oraz białe znaki wokół nich. Są też inne rzeczy, o których należy pamiętać przy tworzeniu dobrego systemu typograficznego dla dowolnego projektu:

"Dzielenie wyrazów" to dodanie łącznika (-) na końcu linii, aby pomóc uniknąć problemów z czytelnością lub poprawić wygląd uzasadnienia. Chociaż najczęściej w drukowanych dokumentach większość projektantów stron internetowych ignoruje dzielenie wyrazów i nie używa ich w swojej pracy, ponieważ nie jest to coś, co jest obsługiwane automatycznie przez przeglądarki internetowe.

"Szmata" jest nierównomierną pionową krawędzią bloku tekstu. Zwracając uwagę na typografię, powinieneś spojrzeć na bloki tekstowe jako całość, aby upewnić się, że szmatka nie wpływa na projekt.Jeśli szmatka jest zbyt nierówna lub nierówna, może wpłynąć na czytelność bloku tekstu i rozproszyć go. To jest coś, co jest automatycznie obsługiwane przez przeglądarkę pod kątem tego, jak owija tekst od linii do linii.

Jedno słowo na końcu kolumny to wdowa, a jeśli znajduje się na górze nowej kolumny, to jest sierota. "Wdowy" i "sieroty" wyglądają źle i mogą być trudne do odczytania.

Zapewnienie perfekcyjnego wyświetlania linii tekstu w przeglądarce internetowej jest męczącą propozycją, zwłaszcza gdy masz responsywną stronę internetową i różne wyświetlacze dla różnych rozmiarów ekranu. Twoim celem powinno być sprawdzenie witryny w różnych rozmiarach, aby spróbować stworzyć najlepszy możliwy wygląd, jednocześnie akceptując, że w niektórych przypadkach Twoje treści będą miały okna, sieroty lub inne, mniej niż idealne wyświetlacze. Twoim celem powinno być zminimalizowanie tych aspektów projektu danego typu, jednocześnie będąc realistycznym w tym, że nie możesz osiągnąć doskonałości dla każdego rozmiaru ekranu i wyświetlania.

Kroki, by sprawdzić swoją typografię

  1. Starannie dobieraj kroje pisma, patrząc na anatomię typu, a także rodzaj rodziny, w której się znajduje.
  2. Jeśli tworzysz projekt za pomocą tekstu zastępczego, nie zatwierdzaj ostatecznego projektu, dopóki nie zobaczysz prawdziwego tekstu w projekcie.
  3. Zwróć uwagę na małe szczegóły typografii, takie jak myślniki i myślniki.
  4. Spójrz na każdy blok tekstu, jakby nie zawierał w nim żadnych słów. Jakie kształty tworzy tekst na stronie? Upewnij się, że te kształty przenoszą cały projekt strony do przodu.