Wybór odpowiednich czcionek dla witryny — przewodnik
Opublikowany: 2022-05-06Nigdy nie masz drugiej szansy na zrobienie pierwszego wrażenia.
Jest to coś, o czym słyszeliśmy, jak ludzie powtarzają i aplikują w prawie każdym aspekcie naszego życia. Obejmuje również nasze strony internetowe.
Nie ma znaczenia, czy jesteś marką SaaS czy e-commerce, ale kiedy odwiedzający po raz pierwszy odwiedza Twoją witrynę, pierwszym aspektem, który zauważa, jest układ i czcionka. Dlatego kluczowe staje się trafienie w dziesiątkę podczas projektowania witryny.
Projektowanie to intensywne i kłopotliwe zadanie, ponieważ obejmuje szereg aspektów, które współpracują ze sobą.
Niektórzy mogą preferować czcionki Google, podczas gdy inni mogą wybrać typografię lub kursywę. Ale czy to działa, czy nie, zależy od innych czynników zaangażowanych w proces projektowania. Masz nawigację, czcionkę, układ, schemat kolorów, czytelność i wiele więcej.
Czcionki są wszechobecne na stronie internetowej. Znajdziesz je jako nagłówki, teksty główne i wszędzie indziej. Tak więc wybór odpowiednich czcionek może wpłynąć na ogólny wygląd witryny.
Dziś porozmawiamy o tym, jak dobierać czcionki do stron internetowych.
Znaczenie wyboru najlepszych czcionek dla strony internetowej
Twoja czcionka jest ambasadorem Twojej marki
Masz tylko 0,5 sekundy, aby upewnić się, że odwiedzający ma pozytywną opinię na temat Twojej witryny i wybranych czcionek. Większość z nich, 94% zależy od elementów projektu.
Konieczne jest zrozumienie, że każda czcionka ma unikalny zestaw cech. Jeśli więc chcesz przekonać odwiedzających do swojej wiedzy, konieczne jest zrobienie tego poprzez wybór języka projektowania witryny i czcionki.
Pomaga zwiększyć ogólne wrażenia użytkownika
Dlaczego poświęcamy czas i zasoby na budowę strony internetowej? Ponieważ chcemy, aby nasi goście czuli się komfortowo podczas korzystania z niego.
Zbudowanie nienagannego doświadczenia użytkownika będzie wymagało od Ciebie zwracania uwagi na szczegóły. Oznacza to również wkroczenie w buty odwiedzających i sprawdzenie, czy dany wybór projektu będzie dla nich odpowiedni.
Wybór dobrych czcionek do projektowania stron internetowych jest integralną częścią tego wszystkiego. Może pomóc w generowaniu większej liczby odwiedzających, wyższych konwersji i poprawie ogólnej satysfakcji.
Klasyfikacja czcionek dla strony internetowej

Wspomnieliśmy już, że każdy styl czcionki ma swoją własną historię i cechy, co oznacza, że można je podzielić na kilka grup. Ponadto istnieje mnóstwo płatnych i bezpłatnych czcionek do wyboru i dodania do swojej strony internetowej.
Czcionki internetowe możemy podzielić na następujące kategorie –
Szeryf
Przykłady – Times New Roman, Garamond, MS Serif, Merriweather, Abril Fatface, Playfair Display, Georgia
Czcionki szeryfowe są jednym z najstarszych typów czcionek znanych ludziom. Czcionki inspirowane renesansem słynęły w dawnych czasach z wysokiej czytelności.
Współczesne czcionki Serif mają tę samą spuściznę, choć również cyfrowo. Rozpoznasz je, zauważając zakończenia linii poprzecznych lub ukośnych. Dodaje elegancji językowi projektowania i czyni go doskonałym wyborem do książek i formalnych stron internetowych.
Większość projektantów używa tych czcionek do dodatkowych elementów treści lub tych, które pojawiają się na ich stronach internetowych. Więc jest bardziej prawdopodobne, że znajdziesz je jako nagłówki, napisy, logo i podobne teksty.
Bezszeryfowy
Przykłady – Arial, Alegreya, Open Sans, Montserrat, Comic Sans, Verdana, Oswald, Roboto, Lato, Helvetica
Kroje pisma Sans-serif są nowoczesną iteracją Serif. Jak sama nazwa wskazuje, są one dostępne bez szeryfów, podnosząc minimalistyczny charakter. W początkowych dniach wyświetlacze komputerowe nie były wystarczająco zaawansowane, aby przedstawiać szeryfy w ich oryginalnej formie. Dlatego projektanci odkryli czcionki, które wygodniej prezentują się do odczytu cyfrowego.
Sans-serif również nie męczy czytelników i oferuje projektantom elastyczność, docierając do szerszego grona odbiorców. Najpopularniejsi użytkownicy tych czcionek są adresowani do młodego pokolenia i chcą być postrzegani jako nowocześni i profesjonaliści w swoim podejściu.
Segoe UI, domyślna czcionka systemu operacyjnego Windows, to styl czcionki bezszeryfowej. Base 9 i 12 to jedne z najpopularniejszych typów czcionek Adobe, z którymi możesz się spotkać, i należy do kategorii bezszeryfowej. Do tej kategorii należy również SF Pro, jeden z najpopularniejszych krojów pisma na platformie Apple.
Płyta szeryfowa
Przykłady - Sentinel, Clarendon, Adelle, Arvo
Rodzaj czcionki Serif, znany również jako Slab Serif jako czcionka Egipcjan. Są to blokowe i solidnie wyglądające style czcionek o niższym współczynniku kontrastu niż tradycyjny szeryf.
W zależności od wybranego stylu czcionki, mogą one wahać się od oldschoolowego retro do bardziej współczesnego wyglądu. Zwykle znajdziesz Slab Serif jako część wyświetlanego tekstu, ale można ich również użyć do ustawienia tekstu podstawowego.
Scenariusz
Przykłady – Arizonia, Mandarynka, Great Vibes
Jak sama nazwa wskazuje, czcionki skryptowe są najbardziej zbliżone do ludzkiego pisma. Są ozdobne i często można je znaleźć przy nagłówkach, logo i podobnych krótkich frazach.
Można je również uznać za nieformalne. Najbardziej ekscytującym faktem dotyczącym czcionek Script jest ich wysoki ładunek emocjonalny. Mogą one wywołać reakcję (w większości przypadków konkretną) i przyciągnąć uwagę odwiedzających.
Ze względu na swoją złożoność mają ograniczone zastosowanie. Jednak większość dobrze zaprojektowanych witryn korzysta z nich, aby poprawić ogólne wrażenie.
Dekoracyjny

Przykład – Helios, Casandra, Cherie Bomb, Wieś
Czcionki dekoracyjne, znane również jako czcionki ekranowe, odnoszą się do różnych czcionek, które niekoniecznie mają wspólne cechy. Jedynym wspólnym sposobem ich identyfikacji jest zauważenie ich kunsztownego kształtu i wysokiej ornamentyki.
Stały się one popularne w XIX wieku i od tego czasu stały się stałym elementem projektowania stron internetowych i celów reklamowych.
W przeciwieństwie do innych czcionek, które potrafią się zasymilować w różnych sytuacjach, czcionki dekoracyjne mają swoje ograniczenia, tzn. każdy z nich emanuje określonymi emocjami (szczęście, przerażeniem lub innymi). Są to oryginalne czcionki, które są bardzo wyraziste i łatwo rozpoznawalne.
Są to pogrubione czcionki, których można używać tylko w nagłówkach i odradzamy używanie ich w tekście głównym witryny. Wchłonięcie ich w minimalistyczny sposób do projektowania stron internetowych pozwoliłoby stronie wyróżnić się i wywrzeć trwałe wrażenie na odwiedzających.
Różnica między krojem pisma a czcionką
Powszechnie uważa się, że krój i czcionka mają to samo znaczenie, ale nie są to synonimy. Pierwsza odnosi się do rodziny czcionek o wspólnych cechach i cechach, podczas gdy druga odnosi się do indywidualnej czcionki.
Na przykład Arial to krój pisma, a 16pt Arial Bold to czcionka.
O czym należy pamiętać przy wyborze domyślnych czcionek dla witryny internetowej
Wszyscy wiemy, że na świecie jest mnóstwo nieskazitelnych płatnych i bezpłatnych czcionek. Ale podczas projektowania strony internetowej gra jest o wiele więcej rzeczy i nie możesz wybrać tej, którą kochasz. Wybór najlepszej czcionki dla stron internetowych jest sprawą całościową i wymaga dokładnych badań i zrozumienia innych elementów w grze.

Oto rzeczy, które należy wziąć pod uwagę przy wyborze najlepszych czcionek na stronę internetową –
Zapoznaj się z podstawami dobrze
Zanim zaczniesz szukać dobrych czcionek dla stron internetowych, musisz posortować inne związane z tym rzeczy. Obejmują one;
- Zrozumienie grupy docelowej
- Cel serwisu
- Powód istnienia Twojej marki
- Osobowość, którą nosi
Marka taka jak Amazon nie będzie używać czcionki Horror (z wyjątkiem określonych okazji, takich jak Halloween). Rodzaj używanej czcionki zależy głównie od grupy docelowej i emocji, które chcesz wygenerować.
Na przykład – czcionki bezszeryfowe oznaczają minimalizm i prostotę. Wywołują również skłonność do tradycyjnych wartości i elastyczności. Kroje pisma szeryfowego mają ozdobną kreskę, która reprezentuje formalną reprezentację.
Upewnij się, że Twój wybór jest zgodny z celem projektu
Za wszystkim kryje się cel, a projekt Twojej witryny też go ma. Twój wybór będzie ostatecznie zależał od grupy docelowej i ogólnego nastroju, który chcesz wywołać za pośrednictwem swojej witryny. Ponadto kilka elementów projektu odgrywa istotną rolę w ogólnej prezentacji Twoich stron internetowych.
Oto elementy, o których będziesz musiał pamiętać –
Kerning, prowadzenie i śledzenie
Te trzy terminy odnoszą się do elementów odstępów na stronie internetowej. Kerning oznacza odstęp między dwiema sąsiednimi literami. Interlinia określa odstępy między wierszami tekstu, a odstępy między grupami liter nazywa się śledzeniem. Wybrane odstępy umożliwiają sprawdzenie wyglądu kroju pisma.
Kontrast
Kontrast w odniesieniu do stron internetowych odnosi się do prezentacji tekstu. Projektanci stron internetowych używają wielu subtelnych technik, aby wyróżnić niektóre elementy. Obejmują one kolor, formę, rozmiar, strukturę i wagę, aby wzmocnić krytyczne obszary.

Wyrównanie
Wyrównanie odnosi się do sposobu umieszczania tekstu na stronie internetowej. Może być lewy, prawy lub środkowy. W pełni uzasadniony tekst prezentuje bardziej sformalizowane podejście, podczas gdy metoda poszarpana pasuje do strony internetowej, która ma być bardziej nieformalna i przyjazna.
Zazwyczaj najbardziej czytelny jest tekst wyrównany do lewej. Innym aspektem, o którym należy pamiętać, jest odległość między bokami bloku tekstu. Możesz ustawić optymalną długość linii, ustawiając średnią liczbę znaków do 80 znaków (wliczając spacje).
Jeśli szukasz bardziej formalnego wyglądu, możesz wybrać w pełni wyjustowany tekst. Wyrównuje krój pisma równomiernie po obu stronach i eliminuje poczucie dezorientacji.
Rozsądnie używaj krojów pisma
Biorąc pod uwagę mnogość oferowanych krojów i czcionek, istnieje duże prawdopodobieństwo, że zgubisz się podczas dokonywania wyborów projektowych. Musisz więc cofnąć się o krok i zrozumieć produkt końcowy, który chcesz stworzyć.
Następnym krokiem jest odpowiedni styl kroju pisma. Te wybory projektowe odzwierciedlają odbiorców, do których się żywisz, i służą podstawowemu zrozumieniu podejścia Twojej marki.

Więc kiedy finalizujesz elementy projektu, zadaj sobie pytania takie jak:
- Jaka jest natura Twojej marki?
- Chcesz położyć większy nacisk na praktyczność, czy chcesz się wyróżnić?
- Jakie grafiki będzie zawierać Twoja strona internetowa? Jeśli grafika jest ciężka, możesz stonować przednią część i pozwolić, aby reszta zajęła się gadaniem. Jeśli jest odwrotnie, upewnij się, że wybrana czcionka wywołuje pożądane emocje.
- Czy opiera się na projekcie? Jeśli tak, jakiego rodzaju jest to zadanie i jakie są z nim związane wymagania?
Nie zapomnij wziąć pod uwagę czasów ładowania
Wolne witryny to mały ruch. Niewielu ma przepustowość, aby czekać, aż Twoja witryna załaduje jeden element po drugim. Nieprawidłowe elementy projektu lub przesadne dokonywanie wyborów projektowych może spowolnić działanie witryny i osłabić zaangażowanie.
Jeśli cierpisz z powodu długich czasów ładowania, powinieneś przyjrzeć się liczbie przyjętych krojów i stylów. Upewnij się, że wybierasz tylko te niezbędne.
Wybierz czcionki bezpieczne w Internecie
Wybór czcionek witryny internetowej często odzwierciedla sposób, w jaki przedstawiasz swoją markę. Na przykład globalne marki, takie jak Amazon, Microsoft i Disney, używają odrębnych czcionek, które stały się ich synonimami.
Nawet jeśli nie możesz zrobić tego samego dla siebie, koniecznie musisz upewnić się, że Twoje wybory są uważane za bezpieczne w sieci. Termin oznacza zestaw dynamicznych czcionek, które można dostosować do różnych środowisk. Mówiąc prościej, te kroje pisma mogą być wyświetlane na ekranie czytelnika, nawet jeśli nie ma ich zainstalowanych na swoich urządzeniach.
Jeśli nie użyjesz jednego z nich, przeglądarka powróci do standardowej czcionki przechowywanej jako kopia zapasowa i wyświetli w niej zawartość sieci Web. Może powodować problemy z funkcjonalnością i projektem, prowadzić do niekompletnego przekazu i prześladować Twoją markę.
Kilka lat temu znalezienie wystarczającej liczby bezpiecznych czcionek internetowych było trudne, ale dziś istnieje mnóstwo płatnych i bezpłatnych czcionek do wyboru i przyswajania.
Na przykład Times New Roman i Arial są bezpiecznymi czcionkami internetowymi należącymi odpowiednio do kategorii Serif i Sans-serif. Jeśli szukasz czegoś dekoracyjnego, Script MT i Luminari to dostosowywalne czcionki należące odpowiednio do kategorii Cursive i Fantasy.
Nadszedł czas, aby użyć mieszanki czcionek, aby uzyskać najlepsze wyniki
Wybór najlepszych czcionek internetowych dla stron internetowych polega na obliczonym mieszaniu i dopasowywaniu. Ponieważ każda czcionka ma swoje cechy, sugerujemy wybranie do trzech różnych czcionek (podstawowej, drugorzędnej i trzeciorzędnej) w sposób, który ostatecznie emanuje klasą i dlaczego istniejesz.
Dodaj do tego takie czynniki, jak kerning i prowadzenie, a będziesz mieć dużo miejsca na nogi, aby zrobić to dobrze. Ważne jest również, aby zrozumieć, że niektóre czcionki działają dobrze w parach, podczas gdy inne nie. Nie brakuje więc możliwości wyboru, ale będziesz musiał upewnić się, że jest to zgodne z wizją Twojej marki.
Ponadto, biorąc pod uwagę dynamiczny wzorzec użytkowania dzisiejszych użytkowników Internetu, konieczne jest stosowanie bezpiecznych w Internecie czcionek, aby dynamicznie dostosowywać się do rozmiaru ekranu. Zapewnia to, że użytkownicy końcowi zobaczą stronę internetową zgodnie z przeznaczeniem, nawet jeśli nie mają zainstalowanej określonej czcionki.
Ostatecznie wybór czcionki zależy od wielu czynników i będziesz musiał znaleźć odpowiednią równowagę, aby uzyskać najlepsze wyniki.