Jaki font (czcionka) został użyty na stronie?
Zastanawiałeś się kiedyś po wejściu na jakąś stronę jakiego kroju fontu (czcionki elektronicznej) na niej użyto.
Zapewne spotkało cię to już nieraz w końcu obecnie istnieje wiele ciekawych fontów, które można spotkać na stronach. W brew pozorom ustalenie jaki to krój czcionki nie jest w cale trudne – powiedziała bym, że jest bardzo proste. Nie musisz też specjalnie instalować jakiś aplikacji.
Jak sprawdzić nazwę fonta z pomocą narzędzi dla developera?
Na początek uruchamiamy przeglądarkę internetową np. Google Chrome lub Firefox. Następnie otwieramy w niej witrynę, na której chcemy sprawdzić krój czcionki.
Teraz klikamy prawym klawiszem myszy w tekst z interesującą nas czcionką. W nowo wyświetlonym panelu wybieramy opcje „ZBADAJ”.
W nowo otwartym panelu zobaczycie teraz kilka kolumn zawierających różne informacje o stronie (np. kod strony, błędy w witrynie).
Nas jednak interesuje pole mieszczące się po prawej stronie.
W polu tym powinny znajdować się informacje os stylach CSS dotyczących sprawdzanego przez nas elementu.
Teraz przechodzimy do zakładki panelu Computed (druga zakładka po Styles). To co zobaczymy będzie przypominać to co znajduje się na obrazku powyżej.
Dla wygody rozciągnęłam to pole, ale nie trzeba tego robić. Jeżeli panel jest wystarczająco duży.
Jak widać nazwy właściwości są tutaj uporządkowane alfabetycznie, i zgodnie z tą zasadą szukamy parametru o nazwie „font-family„.
W tym momencie można już zobaczyć, że na omawianej stronie użyto czcionki „Oswald”. Klikając na umieszczoną z boku strzałkę możemy uzyskać nieco więcej informacji.
Dodatkowo informacja o foncie znajduje się również na samym dole tego panelu:
Jak widać sprawdzenie jakiego kroju jest font nie było trudne – trzeba było jedynie wiedzieć gdzie to sprawdzić.
Jak zamknąć panel?
W celu zamknięcia panelu klikamy na krzyżyk w górnym prawym rogu lub klikamy F12 na klawiaturze komputera.
Dodatkowe uwagi
Po prawej stronie znajduje się przycisk z trzema kropkami – mieści się tam informacja o położeniu panelu – najprościej ustawić ją tak jak na obrazku.
Jak sprawdzić krój tekstu z pomocą wtyczki dodawanej do przeglądarki?
Inną opcją jeśli nie czujecie się na siłach jest zainstalowanie w przeglądarce wtyczki np. WhatFont, Fontface Ninja.
Oczywiście i w tym przypadku nauka was nie ominie. Jednak prawdopodobnie szybciej uzyskacie informację na temat wykorzystywanego kroju pisma.
Dodatkowe tagi:
jaka czcionka, jaki font została użyta na przeglądanej witrynie www
W branży IT jestem już od 2007 roku. W tym czasie zajmowałam się głównie tematyką pozycjonowania i budowy stron internetowych. Hobbistycznie zajmuje się fotografią, podróżami (głównie tymi mikro). Interesuje się mitologią (Nordycką, Grecką i Rzymską) i historią.
