5 bezpiecznych czcionek internetowych, których możesz użyć w swojej witrynie

Jeśli jesteś właścicielem witryny, powinieneś wiedzieć, że czcionka HTML odgrywa ważną rolę w Twojej witrynie. Wszystkie strony internetowe posiadają treść tekstową w takiej czy innej formie, odpowiednio dobrana dobra czcionka może podnieść estetykę strony oraz pozytywnie wpłynąć na czytelność treści, dlatego projektowanie i tworzenie strony internetowej jest rzeczywiście jednym z najważniejsze aspekty, aby ożywić każdą firmę. Zła czcionka negatywnie wpływa na wydajność Twojego pakietu, wszystko zależy od tego, czy używasz bezpiecznej czcionki internetowej, czy nie.

Co to jest bezpieczna czcionka internetowa?

Czcionka jest czytelna i wygląda tak samo w dowolnej przeglądarce lub urządzeniu (telefonie, tablecie itp.) tylko wtedy, gdy czcionka jest zainstalowana na tym urządzeniu. Bezpieczne czcionki internetowe to czcionki, które są zwykle preinstalowane na dowolnym urządzeniu — komputerach, telefonach komórkowych, konsolach do gier, tabletach i inteligentnych telewizorach.

Polecane dla Ciebie: 20 wspaniałych czcionek do projektowania logo, których potrzebuje każdy wielki projektant.

Dlaczego bezpieczne czcionki internetowe mają znaczenie?

W idealnym świecie możesz wybrać dowolną czcionkę dla swojej witryny. Jednak w zależności od systemu operacyjnego urządzenia mają własne, wstępnie zainstalowane opcje czcionek. Problem polega na tym, że ich konstrukcja zazwyczaj różni się w zależności od używanego systemu. Urządzenia działające w systemie Windows mogą mieć jedną grupę, MacOS może mieć inną, a Android Google ma inną inną wersję.

Kiedy otwierasz witrynę internetową, czcionka widoczna w widocznym obszarze niekoniecznie musi być czcionką zamierzoną przez projektanta. Znaczenie: powiedzmy, że projektant używa czcionki, która jest stosunkowo niejasna. Jeśli nie masz zainstalowanej tej czcionki, Twoja witryna powróci do standardowej czcionki zdefiniowanej przez system i możesz nawet o tym nie wiedzieć, dla Ciebie wyglądałoby to po prostu nieprzyjemnie.

Bezpieczne czcionki internetowe to zbiór czcionek, które są dostępne we wszystkich systemach i dają projektantowi możliwość określenia czcionki, z której należy skorzystać w przypadku, gdy urządzenie nie ma potrzebnej czcionki. Daje to możliwość sprawienia, aby witryna wyglądała tak samo na różnych urządzeniach.

Czym jest pięć rodzin czcionek?

W typografii wszystkie czcionki są klasyfikowane do jednej z pięciu rodzin czcionek na podstawie ich podobieństw projektowych. Są to:

1. Cursive (np. Zapf-Chancery)

Rodzina czcionek Cursive imituje pismo odręczne człowieka z literami zwykle połączonymi płynnie. Często kojarzony jest z osobami z kaligrafią i szybszym pisaniem.

2. Fantasy (np. Gwiezdne wojny)

Czcionki z rodziny Fantasy na ogół mają elementy dekoracyjne w każdej literze, ale nadal reprezentują postać. Tytuły wielu fikcyjnych książek i filmów używają czcionek z tej rodziny, aby wzmocnić niuanse treści.

3. Serif (np. Times New Roman)

Najbardziej zauważalną cechą rodziny czcionek Serif jest mała linia na końcu dużej kreski w literze lub symbolu. Tworzy poczucie elegancji i formalności. Jest szeroko stosowany do tekstu podstawowego przez wiele stron internetowych.

4. Bezszeryfowe (np. Helvetica)

W przeciwieństwie do czcionek z rodziny Serif, czcionki z rodziny Sans-serif nie mają małej kreski dołączonej do każdej litery. Większość czcionek należących do tej rodziny ma podobną szerokość kreski, dzięki czemu jest minimalistyczna i nowoczesna.

5. Monospace (np. Courier)

W rodzinie czcionek Monospace każda litera i symbol zajmuje dokładnie tę samą przestrzeń w poziomie. Dzięki temu są spójne i łatwe do rozróżnienia, dlatego często były używane z maszynami do pisania, a ostatnio z terminalami komputerowymi.

Może ci się spodobać: 11 niesamowitych czcionek Photoshop, które musisz wypróbować (ZA DARMO!).

Popularne czcionki internetowe:

Teraz, gdy mamy wgląd w czcionki, poniżej znajduje się 5 popularnych bezpiecznych czcionek internetowych, które możesz dodać do swojej witryny:

1. Arial

Jedna z najczęściej używanych czcionek bezszeryfowych zarówno w mediach internetowych, jak i drukowanych. To de facto standard. Wersja OpenType 3.0 opisuje to jako:

„Arial, współczesny projekt bezszeryfowy, zawiera więcej cech humanistycznych niż wiele jego poprzedników i jako taki jest bardziej zgodny z nastrojami ostatnich dziesięcioleci XX wieku. Ogólna obróbka krzywych jest bardziej miękka i pełniejsza niż w przypadku większości twarzy bezszeryfowych w stylu industrialnym. Końcowe pociągnięcia są cięte po przekątnej, co pomaga nadać twarzy mniej mechaniczny wygląd. Arial to niezwykle wszechstronna rodzina krojów pisma, która z równym powodzeniem może być używana do oprawy tekstu w raportach, prezentacjach, czasopismach itp., a także do wyświetlania w gazetach, reklamach i promocjach”.

Jest to również domyślna czcionka w dokumentach Google.

2. Times New Roman

Times New Roman to odmiana starej czcionki Times z rodziny czcionek Serif. Zamówiony przez brytyjską gazetę „The Times” w 1931 roku i zaprojektowany przez Stanleya Morisona, doradcę artystycznego Monotype, firmy zajmującej się sprzętem drukarskim, współpracującego z Victorem Lardentem z działu liternictwa ramienia Time's Advertising. Stała się jedną z najpopularniejszych czcionek wszechczasów i jest preinstalowana na większości urządzeń.

Nazwa Roman w Times New Roman nawiązuje do stylu rzymskiego, pierwszej części rodziny czcionek Times New Roman, która ma zostać zaprojektowana. Ma swoje korzenie we włoskiej drukarni końca XV i początku XVI wieku, projekt nie ma związku z Rzymem ani z Rzymianami.

3. Helvetica

Helvetica lub Neue Haas Grotesk to szeroko stosowana czcionka z rodziny czcionek Sans-serif. Opracowany w 1957 roku przez szwajcarskiego projektanta czcionek Maxa Miedingera przy udziale Eduarda Hoffmanna. Został zaprojektowany w neo-groteskowym stylu z wysoką wysokością x, zakończeniem kresek na liniach poziomych lub pionowych oraz bardzo nietypowymi ciasnymi odstępami między literami, co razem nadaje mu solidny, gęsty wygląd. Pierwotnie zaprojektowana do użytku jako neutralna czcionka, która miała dużą przejrzystość, nie miała wewnętrznego znaczenia w formie i mogła być używana w różnych oznakowaniach i nazwana Neue Haas Grotesk (New Haas Grotesque), została szybko licencjonowana przez Linotype i przemianowana na Helvetica w 1960 roku , łacina dla Szwajcarów. Czcionka jest uwielbiana przez projektantów za jej neutralność i preferowana przez wiele znanych marek, takich jak Jeep, Kawasaki, Motorola i BMW.

4. Kurier

Czcionka Courier to czcionka należąca do rodziny czcionek Serif. Zaprojektowany przez Howarda „Buda” Kettlera pierwotnie dla maszyn do pisania IBM, został zaadaptowany do użytku jako czcionka komputerowa i prawie wszystkie komputery są z nim instalowane. Ze względu na skład Monospace w latach 90. XX wieku znalazł ponowne zastosowanie w przemyśle elektronicznym i komputerowym, gdzie kolumny znaków muszą być konsekwentnie wyrównane, na przykład w kodowaniu, gdzie jest domyślną czcionką do pisania lub przedstawiania wszelkiego rodzaju kodu.

Zgodnie ze standardem branżowym wszystkie scenariusze miały być napisane 12-punktowym kurierem. Departament Stanu USA stosował ją jako standardową czcionkę we wszystkich dokumentach do stycznia 2004 r. Wraz ze wzrostem wykorzystania w branżach cyfrowych firma Courier opracowała warianty z funkcjami takimi jak większe znaki interpunkcyjne, silniejsze rozróżnienie między podobnymi znakami (takie jak cyfra 0 / wielkie O i cyfra 1 / mała litera L), itp. dla lepszej czytelności ekranu.

5. Kalibr

Czcionka Calibri jest członkiem rodziny czcionek Sans-serif zaprojektowanych przez Lucasa de Groota w latach 2002-2004. Został wydany publicznie w 2007 roku, w pakiecie z Microsoft Office 2007 i Windows Vista. Począwszy od pakietu Office 2007, zastąpił Times New Roman jako domyślną czcionkę w MS Word i Arial jako domyślną czcionkę w MS Powerpoint, MS Excel, Microsoft Outlook i WordPad. Jest częścią kolekcji czcionek ClearType zaprojektowanej do współpracy z systemem renderowania tekstu ClearType firmy Microsoft w celu zwiększenia czytelności tekstu na wyświetlaczach ciekłokrystalicznych (LCD).

Narzędzia czcionek do sprawdzenia

Istnieje wiele narzędzi online, których można użyć do przetestowania różnych czcionek przed użyciem ich w witrynie. Jeśli chcesz zapoznać się z dostępnymi typami czcionek lub masz trudności z wyborem czcionki, te narzędzia są bardzo pomocne.

Para czcionek

Font Pair to niszowa strona internetowa zawierająca wiele zasobów związanych z typografią. Istnieją różne eBooki, przewodniki, recenzje, filmy i rekomendacje wtyczek dla czcionek. Mają sekcję poświęconą najpopularniejszym czcionkom dostępnym w Google i dogłębne porównanie, które czcionki są najlepsze razem.

znak słowny.it

Wordmark.it zapewnia szybki podgląd tego, jak wyglądałby Twój tekst z określoną czcionką, a nawet z wieloma czcionkami razem. Po prostu wpisz tekst na pasku i voila, pokaże ci, jak to wygląda z różnymi czcionkami.

Jaka czcionka

WhatTheFont jest dla tekstu tym, czym Reverse Image Search dla obrazów. Pomaga zidentyfikować czcionkę, którą widziałeś. Po prostu prześlij obraz czcionki, a on dopasuje go do ich bazy danych i poda to, co uważa za najbliższe dopasowanie. Możesz także udać się na ich aktywne fora, aby uzyskać pomoc w identyfikacji czcionek, a nawet ogólnych zapytań typograficznych.

Możesz także polubić: 3 różne sposoby dodawania niestandardowych czcionek do motywu witryny WordPress.

Jak dodać bezpieczne czcionki internetowe do mojej witryny?

Teraz, gdy wybrałeś bezpieczną czcionkę internetową, nadszedł czas, aby ją zastosować. Jeśli masz niewielkie doświadczenie w programowaniu, wykonaj następujące kroki, aby dodać bezpieczną czcionkę internetową do swojej strony internetowej:

1. Otwórz plik header.php.

2. Skopiuj kod źródłowy/standardowy czcionki. Zwykle można to znaleźć za pośrednictwem Google.

3. Wklej kod na górze pliku nagłówkowego.

4. Załaduj plik style.css, umieść kod czcionki, aby zmienić wybraną czcionkę.

Pod koniec, twój arkusz stylów powinien wyglądać tak:

 Ten artykuł został napisany przez Abhyank Srinet. Abhyank posiada tytuł magistra zarządzania uzyskany w ESCP Europe oraz tytuł inżyniera ze specjalizacją w oprzyrządowaniu i sterowaniu. Zainteresowanie środowiskiem cyfrowym zmotywowało go do stworzenia internetowego start-upu zajmującego się doradztwem w zakresie aplikacji (MiM-Essay), skupiającego się na rozpowszechnianiu wysokiej jakości informacji o studiach magisterskich na wczesnym etapie kariery.