10 zasad idealnego projektowania czcionek za każdym razem
Czy zauważyłeś kiedyś, że niektóre projekty wydają się świecić świetnym typem? Niektórzy projektanci mają pewien talent do projektowania idealnej typografii dla każdego projektu.
Ty też możesz to zrobić. Za pomocą kilku prostych zasad możesz poprawić wygląd i projekt typografii we wszystkich swoich projektach, zarówno cyfrowo, jak i drukowo. Jeśli masz problem z wybieraniem czcionek i parowaniem czcionek, te zasady pomogą Ci zaprojektować idealny typ za każdym razem. (Pamiętaj tylko, aby ich przestrzegać).
Poznaj elementy Envato
1. Ustaw cele projektu
Dobra typografia zaczyna się od dokładnego zrozumienia tego, co powinien zrobić Twój projekt. Zanim zaczniesz przeglądać czcionki Google lub Typekit, zanotuj odpowiedzi na kilka pytań.
- Do kogo chcesz dotrzeć z tym projektem?
- Co użytkownicy powinni zrobić z tym projektem?
- Jakie są punkty konwersji?
- Jaki jest nastrój projektu?
- Czy potrzebujesz dopasowywać lub koordynować z innymi projektami lub brandingiem?
Odpowiedzi pomogą Ci ustalić, jakiej typografii szukasz. (Oto przewodnik po znaczeniu i nastroju krojów pisma w projektach).
2. Poszukaj podobnych kształtów
Jeśli chodzi o dopasowanie wielu krojów pisma w projekcie, coś tak prostego, jak kształt litery, może stworzyć lub złamać kombinację czcionek.
Jak więc upewnić się, że to zrobisz?
Poszukaj krojów o podobnych kształtach. Zastanów się, czy każdy krój pisma jest bardziej okrągły, owalny, gruby czy cienki, ma krótką lub wysoką wysokość x lub zawiera nachylenie lub pochylenie.
Wybierz główny lub bryłowy krój, który ci się podoba, a następnie dopasuj kroje uzupełniające o podobnych kształtach.
- Spójrz na małe litery „o” w każdej rodzinie typów. Czy wewnętrzna „miska” jest okrągła czy owalna? Dopasuj kroje pisma, w których wnętrze „o” jest takie samo.
- Można parować grube i cienkie kroje pisma. Lepiej jest sparować gruby lub cienki i regularny krój pisma.
- Poszukaj czcionek o podobnych wysokościach x (rozmiar pionowy „x”).
- Nie bój się mieszać i dopasowywać różnych stylów. Wypróbuj kombinację serif i sans serif. Upewnij się tylko, że jeśli jeden krój jest złożony, drugi jest prosty. I użyj prostego kroju pisma dla najszerszej aplikacji, takiej jak tekst podstawowy.
- Zwróć uwagę na pochylenie i kursywę. (Możesz ponownie spojrzeć na środek litery „o” jako wytyczną). Nie używaj więcej niż jednego skośnego kroju pisma i unikaj par czcionek skośnych w przeciwnych kierunkach. Mogą być denerwujące dla użytkowników.
Nadal nie jesteś pewien? Oto przewodnik po mieszaniu krojów pisma.
3. Ustaw skalę rodzaju dla rozmiaru
Rozmiar liter może spowodować lub zniszczyć projekt. Jeśli tekst jest zbyt duży, powoduje nienaturalne wzorce czytania ze zbyt dużą liczbą pauz i zatrzymań. Jeśli tekst jest zbyt mały, może męczyć oczy i powodować, że użytkownicy opuszczą projekt.
Gdy tekst jest odpowiedni, użytkownicy swobodnie poruszają się po słowach.
Tekst o odpowiednim rozmiarze również zawiera skalę dla różnych rozmiarów w projekcie. Treść ma jeden rozmiar, nagłówki mają inny rozmiar, a podtytuły to kolejny rozmiar. Wszystkie rozmiary i zastosowanie powinny być spójne w całym projekcie.
Dla użytkowników oznacza to, że wszystko jest łatwiejsze do odczytania.
- Rozmiar tekstu uszeregowuje informacje priorytetowo według ważności. Większy typ jest ważniejszy i jest bardziej prawdopodobne, że zostanie usunięty przez większość użytkowników.
- Skala zwiększa czytelność tekstu, aby użytkownicy mogli szybko na niego spojrzeć.
- Powiązane elementy mają taki sam wygląd.
- Większe elementy tekstowe, takie jak podtytuły, pomagają rozbijać długie bloki tekstu, ułatwiając czytanie.
4. Zwróć uwagę na odstępy
Nie jest to typ per se, ale odstępy między rodzajami mają znaczenie.
Kerning, prowadzenie, śledzenie i wypełnianie mogą pięknie uczynić Twój typ lub zmienić go w gorący bałagan.
Dobrze jest ustawić odstępy w odpowiedni sposób. Wiele z nich zależy od rzeczywistych użytych kombinacji liter, rozmiaru i kroju pisma. Nie ma żadnej reguły kerningu - poza zrobieniem tego w razie potrzeby - i nie ma idealnej ilości dopełnienia dla tekstu i innych elementów.
Będziesz musiał to zobaczyć.
Test jest odczuwalny. Jeśli projekt wydaje się „wyłączony” w sposób, którego nie można wskazać, można obwiniać problematyczne odstępy. Wystarczy tylko ćwiczyć - i mieć dobre oko - aby zrobić to dobrze.
5. Wyrównaj do lewej do czytania
W języku angielskim, a także w innych językach, użytkownicy czytają od lewej do prawej. To także idealne wyrównanie do optymalizacji czytelności w blokach kopiowania.
Małe fragmenty tekstu - elementy menu lub nagłówki bohaterów - nie muszą być wyrównane do lewej, ponieważ można je szybko odczytać. Duże ilości kopii - cokolwiek więcej niż zdanie - prawdopodobnie powinny zostać wyrównane. (Usprawiedliwienie jest uzasadnione, chociaż może być przyczyną pewnych problemów z odstępami, jeśli nie będziesz bardzo ostrożny.)
6. Wybierz dwie rodziny typów
Ta reguła prawdopodobnie została już wbita w twoją głowę: użyj tylko dwóch krojów pisma dla projektu.
Zostało to powtórzone tutaj, ponieważ tak niewielu projektantów faktycznie zwraca uwagę na tę zasadę. Zeskanuj stronę internetową lub portfolio, a zobaczysz wiele projektów z „dzikimi czcionkami!”
Jeśli planujesz złamać tę zasadę, pomyśl jeszcze raz. Co zyskujesz, dodając do miksu kolejny krój? Zamiast tego spójrz na wybrany krój pisma i sprawdź, czy inny styl - pogrubiony, cienki lub kursywowy - może być lepszym rozwiązaniem.
7. Nie zmieniaj czcionek
Nigdy nie rozciągaj, nie skręcaj ani nie pochylaj kroju pisma. Jeśli potrzebujesz czegoś innego niż to, co masz, wybierz inną opcję.
Projektanci czcionek spędzają dużo czasu na tworzeniu napisów, które działają zgodnie z prezentacją. Zmiana formy liter szkodzi czytelności i może powodować „rozpadanie się” czcionek w sposób, w jaki zdjęcie jest pikselowane, gdy używasz rozmiaru większego niż oryginalny.
8. Użyj opcji Duży kontrast
Jedną z rzeczy, która wpędza projektantów w kłopoty, jest umieszczanie tekstu na elemencie obrazu lub tła. Działa tylko wtedy, gdy masz duży kontrast między elementami, aby utworzyć separację i zapewnić czytelność.
Jeśli musisz dodać cień do napisu, kontrast jest niewystarczający.
Światło w ciemności lub ciemność w świetle może zapewnić czytelność. Pomaga również używać kroju pisma o regularnym lub szerszym pociągnięciu.
Ale nie zawsze tak jest. Zdjęcie może zawierać jasne i ciemne przestrzenie, a nałożenie może obejmować grube i cienkie pociągnięcia.
Dostępne opcje to tekst bokserski, wybranie cięższego kroju pisma lub dodanie kolorowej nakładki do obrazu. Wszystkie te techniki mogą pomóc zwiększyć kontrast i zwiększyć czytelność tekstu. (Ponadto mają tendencję do zatrzymywania się, gdy są używane w wielu elastycznych punktach przerwania, w których przemieszczają się tekst i obrazy).
9. Pamiętaj o typografii mobilnej
Jeśli chodzi o typografię dla Internetu, głównym problemem powinna być czytelność na urządzeniach mobilnych. Zabawne techniki, takie jak dodawanie wzoru lub tekstury do liter, mogą działać w druku i na niektórych ekranach pulpitu, ale nie wystarczą na mniejszych urządzeniach.
Musisz pomyśleć o tym, jak czcionki będą renderowane we wszystkich zastosowaniach. (Wróć do skali typografii i pamiętaj, aby podać specyfikację tekstu na dużym i małym ekranie).
Typografia mobilna jest często trochę za duża i zawiera nieco więcej odstępów niż typografia na komputerach stacjonarnych. Pomaga również, jeśli akapity są krótsze, aby nie skończyć się blokami tekstu, których odczyt wymaga wielu zwojów, co może zastraszyć użytkowników.
10. Trzymaj się przewodnika po stylu
Gdy masz już dobre pojęcie o tym, jak typ powinien wyglądać w projekcie, utwórz przewodnik po stylach ze wszystkimi dokładnymi zasadami użytkowania.
Robić kopie. Umieść go online w dostępnym miejscu. I używaj go, gdy wprowadzasz zmiany w projekcie.
Spójność jest kluczowym elementem doskonałego projektu typografii.
Wniosek
Zaletą dobrej i złej typografii jest to, że większość użytkowników może zidentyfikować jedną lub drugą. Wiedzą tylko, kiedy projekt jest po prostu niewłaściwy.
Kluczową kwestią przy tworzeniu idealnej typografii jest czytelność. Tekst musi być łatwy do odczytania i zrozumienia. Powinien pasować do nastroju kopii. I powinien być prawie niewidoczny dla użytkowników; działa, gdy nie muszą o tym myśleć i potrafią czytać z łatwością.
