V této příručce vám vysvětlím různé metody, které máte k dispozici, abyste zjistili typografii webových stránek.
V této příručce vysvětlím několik triků, které vám umožní poznat, jakou typografii má webová stránka. Všechny jsou zcela zdarma a velmi snadno proveditelné. Ať tak či onak, ať už chcete objevit nejlepší písma pro webové stránky, která najdete při jejich prohlížení, nebo je chcete použít ke změně typografie v systému Android či jiném systému, zůstaňte se mnou až do konce. To, co zde vysvětluji, vás bude velmi zajímat.
Zjistit typografii webové stránky z prohlížeče
Nejjednodušší způsob, alespoň pokud prohlížíte web z počítače, je použít vývojové nástroje prohlížeče. Jedná se o malé utility určené pro webové designéry, které vám však mohou podat pomocnou ruku, pokud jde o vyhledání písma. Měli byste vědět, že kód a styly webových stránek jsou uživateli zcela vystaveny, alespoň pokud jde o obsah načítaný prohlížečem. Proto je poměrně snadné zjistit, jak je prvek dlouhý, jakou má přesně nastavenou barvu nebo jaké písmo je použito.
Pokud používáte prohlížeč Google Chrome, jsou kroky ke zjištění písma velmi jednoduché. Nejprve je třeba otevřít webovou stránku, na které jste viděli písmo, které se vám líbí. Poté na něj klikněte pravým tlačítkem myši a vyberte možnost Inspect.
Poté se otevřou vývojové nástroje. Zde bude vybrán daný odstavec, ale můžete jej změnit na jiný opětovným klepnutím na příkaz Inspect. Jde o to, abyste se podívali do sekce Styly, kde najdete písmo, které je v textu použito.
Je zde několik možností. Atribut font-family můžete vidět hned po výběru textu. Je to proto, že písmo bylo nastaveno pro tento konkrétní text nebo pouze pro odstavce. Pokud však bylo písmo nastaveno na obecné úrovni, je obvykle spojeno se značkou HTML body. To je případ příkladu uvedeného na následujícím obrázku:
V systému Andro4all se používá písmo Inter. Bylo implementováno na celé webové stránce změnou obecných stylů tagu body. Ostatní prvky mohou mít nakonfigurováno vlastní písmo.
Mimochodem, zajímavostí je, že tyto atributy můžete upravovat. Vývojáři pomocí tohoto nástroje mohou aplikovat úpravy stylů a vidět výsledky v reálném čase, aniž by museli změny nahrávat na server. Jedním tahem tak aplikují konečné změny v souboru CSS webové stránky. Jak je vidět na obrázku výše, pokud je atribut font-family deaktivován, webové stránky Andro4all již nepoužívají písmo Inter, ale výchozí písmo prohlížeče.
Nakonec byste měli vědět, že možnosti vývoje jsou přítomny ve všech prohlížečích. Pokud je nemusíte speciálně aktivovat, jako je tomu v Safari, umožňují všechny prohlížeče kontrolovat prvky a znát použité styly z kontextové nabídky.
Zjištění typografie webové stránky pomocí rozšíření
Dalším snadným způsobem, jak zjistit písma použitá na webových stránkách, je rozšíření specializované na extrakci písem. Zde je několik takových, které fungují opravdu dobře.
Fontanello
Fontanello je rozšíření pro Chrome, které funguje jako kouzlo. Je integrováno do kontextové nabídky. Stačí kliknout pravým tlačítkem myši na část textu a poté umístit kurzor na Fontanello. V kontextové nabídce, která se otevře, se zobrazí všechny informace o písmu. Kromě názvu se dozvíte i velikost a použité barvy.
Vyhledávání písma
Nemůžeme říci, že by Find Font bylo rozšíření s nejzáhadnějším názvem. I přes nedostatek fantazie svého tvůrce však svou práci odvádí dokonale. Stejně jako Fontanello přidává tento nástroj do kontextové nabídky prohlížeče Chrome tlačítko, které umožňuje rychle zjistit písmo použité v odstavci. Poté se zobrazí selektor, který umožňuje vybrat příslušný fragment textu, a také horní upozornění informující o použitém písmu.
Dotaz na písmo webové stránky v aplikaci ChatGPT
Vševěd ChatGPT umí také identifikovat písma, alespoň ta nejoblíbenější. Musím říci, že po několika testech jsem dospěl k závěru, že to není nejspolehlivější metoda. Pokud však chcete s chatbotem OpenAI experimentovat, stačí pořídit snímek obrazovky s písmem, vložit ho do textového pole a zeptat se ho na něco jako „jaké je to písmo?
Na obrázku výše správně určil první z nich (jak by ne, když se jedná o Comic Sans). Ve druhém se však spletl a zaměnil Clarendon za Times New Roman. Nakonec opět správně trefil Helveticu. Výsledek: 2 správné odpovědi ze 3 dotazů. To není špatné.
Bezpochyby se jedná o další trik ChatGPT, který byste si měli zařadit do svého seznamu. Nezapomeňte, že obrázky můžete nahrávat také do aplikace Microsoft Copilot, takže se jedná o další alternativní nástroj.
Použití vyhledávače webové typografie
Posledním řešením, které navrhuji, je použití specializovaného vyhledávače písem. Na trhu jich je mnoho, i když zde doporučuji tři, které jsou velmi dobré:
- Co je to za písmo. Vyhledávač spuštěný webem MyFonts, který se specializuje na písma. Umožňuje vložit adresu URL nebo nahrát obrázek a zjistit typ písma.
- Písmo v logu. Vyhledávač, který se zaměřuje na zjišťování písem nejoblíbenějších log. Na obrázku výše můžete vidět, že písmem loga Netflix je Bebas Neue, velmi oblíbené a zcela bezplatné písmo.
- Vyhledávač písma Fontspring. Tento nástroj vám pomůže vyhledat písma na webových stránkách a snímcích obrazovky.