czy kiedykolwiek znalazłeś idealną czcionkę dla swojej witryny na innej stronie, obrazie lub blogu, ale nie wiesz, jak znaleźć jej nazwę? Jesteś we właściwym miejscu. W tym przewodniku pokażemy Ci, jak zidentyfikować czcionki na stronie internetowej, aby pomóc Ci znaleźć idealną typografię dla Twojej firmy.

dlaczego warto sprawdzić, jakich czcionek używa strona internetowa?

jeśli pracujesz nad budowaniem swojej strony internetowej lub projektowaniem treści online, zawsze szukasz sposobów na jej ulepszenie. Można to zrobić na wiele sposobów. Najbardziej oczywiste są przy użyciu innego motywu, dodając funkcjonalności i zapewniając lepszą treść. Ale są też inne, nie tak oczywiste rzeczy, które możesz zrobić, aby mieć przewagę nad konkurencją i uczynić swoją witrynę wyjątkową. Czcionka jest jedną z nich.

czcionka, której używasz, znajduje się w całej witrynie i może nie tylko poprawić czytelność, ale także ogólną nawigację. Jeśli twoja typografia wygląda profesjonalnie i jest łatwa do odczytania, odwiedzający są bardziej skłonni pozostać na twojej stronie. Czcionki są często pomijane, ale mogą mieć duży wpływ.

mimo że możesz dodawać czcionki do swojej witryny, możesz użyć typografii, której nie znajdziesz w tradycyjny sposób. Internet jest pełen stron internetowych z piękną typografią, które możesz chcieć wykorzystać na swojej stronie. Jednak trudną częścią jest zidentyfikowanie czcionek używanych przez te witryny. Nie ma łatwego sposobu na znalezienie czcionki, a nawet jeśli jesteś ekspertem, istnieje mnóstwo drobnych różnic w każdej czcionce. Ponadto różnice te można wzmocnić za pomocą stylów czcionek i zmian CSS.

dlatego w tym poście pokażemy Ci, jak używać różnych narzędzi, aby dowiedzieć się, jakich czcionek używa strona internetowa.

Jak zidentyfikować czcionki na stronie internetowej

istnieje wiele sposobów identyfikacji czcionek na stronie internetowej:

1. Korzystanie z narzędzia Inspect
2. z wtyczkami
   1. FFFFallback
   2. Fount
   3. Fontanello
   4. jaka czcionka

niektóre z nich są trudniejsze w użyciu niż inne, a niektóre mogą wymagać zewnętrznych narzędzi i rozszerzeń. Przyjrzyjmy się bliżej tym różnym metodom.

1) Rozpoznawanie czcionek za pomocą narzędzia Inspect

najbardziej podstawowym sposobem identyfikacji czcionek ze strony internetowej jest użycie narzędzia inspect przeglądarki. W tym celu musisz otworzyć narzędzia programistyczne swojej przeglądarki. Zazwyczaj można to zrobić na kilka różnych sposobów:

• naciskając F12 lub Ctrl+Shift + i w przeglądarce
• Otwórz menu przeglądarki klikając prawym przyciskiem myszy, a następnie przejdź do Inspect
• otwierając opcje Narzędzia programisty z menu przeglądarki i przechodząc do Web Developer

gdy znajdziesz czcionkę, którą lubisz, kliknij prawym przyciskiem myszy tekst, który zawiera czcionkę, którą chcesz zidentyfikować, i kliknij Sprawdź Element.

ten element zostanie podświetlony w narzędziu Inspektor, a style i układy zostaną wyświetlone w polach obok Inspektora.

następnie kliknij kartę Computed i przewiń w dół, aby sprawdzić pole Font-Family. To pole powinno wyświetlać czcionkę strony. Na przykład w tym przykładzie czcionką jest Roboto lub SF-Pro Display.

w ten sposób można zidentyfikować czcionki w dowolnej witrynie za pomocą narzędzia Inspektor. Możesz jednak znaleźć strony, w których nie możesz kliknąć prawym przyciskiem myszy ani uzyskać dostępu do narzędzia Inspektor, ponieważ nie zezwalają na to. Jeśli tak jest, jest inna alternatywa. Możesz również zobaczyć, jakiej czcionki używa strona internetowa za pomocą dedykowanego narzędzia.

rzućmy okiem na niektóre z najlepszych wtyczek, których możesz użyć do identyfikacji czcionek ze strony internetowej.

2) Identyfikuj czcionki za pomocą narzędzi i wtyczek

jeśli nie możesz użyć narzędzia inspektor w witrynie internetowej, identyfikujesz czcionki za pomocą dedykowanych narzędzi i wtyczek. Istnieje kilka narzędzi, więc aby ułatwić Ci życie, wymienimy najlepsze z nich i pokażemy, jak można ich używać do wyszukiwania i rozpoznawania czcionek używanych w różnych witrynach.

2.1) ffffallback

ffffallback jest prostym narzędziem bookmarklet, którego możesz użyć do identyfikacji czcionek na dowolnej stronie. A najlepsze jest to, że nie musisz niczego instalować. Wystarczy zapisać bookmarklet na karcie zakładki i kliknąć jego zakładkę w dowolnej witrynie, aby sprawdzić czcionki. Narzędzie wykorzystuje Javascript do skanowania CSS i identyfikacji typografii, a także jej stylu czcionki.

aby użyć tego narzędzia, musisz otworzyć tę stronę. Następnie kliknij przycisk FFFFALLBACK i przeciągnij go do paska zakładek, jak pokazano poniżej. Jeśli pasek zakładek nie jest wyświetlany w przeglądarce, naciśnij Ctrl+Shift + B, aby go włączyć.

teraz otwórz witrynę, na której chcesz zidentyfikować czcionki i kliknij ikonę Bookmarklet, którą właśnie zapisałeś na pasku zakładek. Powinien pokazać rodzinę czcionek i styl witryny w nowej kolumnie, jak pokazano poniżej. Upewnij się, że wybrałeś czcionkę internetową jako opcję na górze.

2.2) Fount

Fount jest podobny do FFFFALLBACK, ale pozwala również sprawdzić czcionki określonych tekstów. W ten sposób możesz określić, które teksty chcesz sprawdzać czcionki.

aby użyć Fount, przejdź do tej strony i zapisz Bookmarklet ze swojej strony internetowej, przeciągając go do Zakładki Zakładki.

następnie otwórz dowolną witrynę, dla której chcesz sprawdzić czcionki, i kliknij zakładkę Fount. Spowoduje to zmianę kursora na plus. Po prostu kliknij dowolny tekst, a pokaże Ci zidentyfikowaną czcionkę w prawym górnym rogu ekranu.

po zapoznaniu się z czcionką dla tego tekstu możesz ponownie kliknąć pole czcionki, aby wyłączyć kursor i przeglądać stronę jak zwykle.

2.3) Fontanello

jeśli wolisz korzystać z rozszerzeń przeglądarki, Fontanello jest idealnym narzędziem do identyfikacji czcionek z dowolnej strony internetowej. Po prostu zainstaluj rozszerzenie Fontanello na Chrome lub Firefox i aktywuj je.

aby zidentyfikować czcionki na stronie, po prostu kliknij prawym przyciskiem myszy dowolny tekst i wybierz opcję Fontanello. Menu rozwijane pokaże rodzinę czcionek, a także ich styl i warianty.

2.4) jaka czcionka

Alternatywnie możesz użyć rozszerzenia WhatFont w podobny sposób. Najpierw zainstaluj rozszerzenie w przeglądarce Chrome lub Firefox. Następnie kliknij ikonę Narzędzia WhatFont na pasku narzędzi przeglądarki i kliknij dowolny tekst, aby sprawdzić jego czcionkę. Dobrą rzeczą jest to, że możesz wybrać inny tekst i zobaczyć, jakiej typografii używają jednocześnie.

po zakończeniu naciśnij Exit WhatFont, aby zamknąć wyskakujące okienka czcionek i jak zwykle korzystać ze strony internetowej.

teraz, gdy widzieliśmy, jak identyfikować czcionki z tekstu, możesz się zastanawiać, czy można zrobić to samo z obrazów. Odpowiedź brzmi: tak! Zobaczmy, jak to zrobić.

jak rozpoznać czcionki z obrazu

oprócz rozpoznawania czcionek z tekstu, można również zidentyfikować czcionki ze strony internetowej za pomocą obrazów. W tym celu użyjemy internetowego narzędzia o nazwie WhatTheFont.

jaka czcionka

to narzędzie online pozwala przesłać dowolny obraz, analizuje tekst obrazu i mówi, jakiej czcionki używa.

aby to zrobić, przejdź do tej strony i przeciągnij lub prześlij obraz na narzędzie (upewnij się, że jest w formacie JPG lub PNG.) Następnie określ pole przycinania dla tekstu, a narzędzie pokaże właściwą czcionkę tekstu. Ponadto WhatTheFont zapewnia również strony internetowe, na których można kupić czcionki, a nawet umożliwia testowanie czcionek za pomocą niestandardowego tekstu.

w ten sposób możesz sprawdzić czcionki ze zdjęć lub zrzutów ekranu. Dodatkowo posiada aplikację mobilną, za pomocą której można identyfikować czcionki z telefonu komórkowego.

wnioski

Podsumowując, czcionka, której używasz, może mieć duży wpływ na Twoją stronę. Może pomóc poprawić czytelność, ogólną nawigację i utrzymać odwiedzających na dłużej. Przejrzystość i czytelność są ważnymi aspektami każdej witryny, a im więcej wysiłku w nią włożysz, tym lepsze wyniki uzyskasz.

w tym przewodniku widzieliśmy różne sposoby identyfikacji czcionek ze strony internetowej:

• Korzystanie z narzędzia przeglądarka Inspect
• Korzystanie z narzędzi Bookmarklet
• poprzez rozszerzenia przeglądarki
• korzystanie z dedykowanych narzędzi online do identyfikacji czcionek z obrazów

po znalezieniu odpowiednich czcionek, to Ty decydujesz, jak dodać je do swojej witryny. Po wybraniu typografii, której chcesz użyć, zalecamy zapoznanie się z naszym przewodnikiem na temat zmiany czcionki w WordPress, aby szybko przełączyć się na nową czcionkę.

Jeśli szukasz więcej sposobów na poprawę czytelności i nawigacji w swojej witrynie WordPress, możesz również spojrzeć na te artykuły:

• Jak dodać bułkę tartą w WordPress
• organizowanie produktów WooCommerce według marek
• jak dodać WordPress mega menu