Egoblog.cz - Petr Kobelka

Náhled fontů před použitím na webu

Hodně písmových serverů nabízí možnost náhled textu ve zvoleném fontu před použitím na webu. Zde je nástroj, když tuto možnost nemáte.


Webdesign | Komentáře (0) | Shlédnuto 806 × | Vloženo: 23. března 2015

Když si, jako webdesignéři, vybíráte font pro použití na novém webu, chcete se podívat, jak bude text v něm napsaný vypadat. To je přirozené a občas i nutné. Nicméně se můžete dostat do situace, že dostanete v e-mailu TTF s pokyny "snažte se". Nestává se to často, ale občas ano.

Vem tohle písmo, ale chci číslice na řádku

Nedávno jsem dostal podobný pokyn s tím, že jsem v musel v šabloně webu odladit požadované chování fontu, konkrétně jeho číslic.Standardně totiž tento font má číslice "rozházené" všude možně. Jedna skáče až na horní účaří, zatím co druhá je pod spodním účařím skoro polovinou své velikosti. pro daný font je to normální, zákazník ale požadoval, aby byly číslice všechny na základní čáře spolu s písmem. Na obrázku je vidět přirozené chování písma:

Náhled nového písma na webu

Když jsem poprvé uviděl skákající číslice, myslel jsem si, že font, který jsem dostal je chybný. Zkoušel jsem dva různé nástroje na konverzi, ale pořád se mi zobrazovala chyba. Nakonec jsem se chtěl podívat na font na webu v nějakém náhledu a našel jsem tuhle službu http://labs.thecssninja.com. Pochází z ní i obrázek výše. Stačí jen požadovaný font přetáhnout do panelu vlevo a hned se vám zobrazí výchozí text v daném fontu.

Řešení problému s číslicemi

A nakonec Vás neochudím o řešení výše popsaného problému. Našel jsem tuto stránku, která mi nakonec dala potřebné instrukce pro CSS preprocesor. https://www.typotheque.com/.

Konkrétně Vás zajímá tato část kódu:

font-feature-settings: 'lnum';
/* vendor-prefixes */
-moz-font-feature-settings: 'lnum=1';
-ms-font-feature-settings: 'lnum';
-webkit-font-feature-settings: 'lnum';
-o-font-feature-settings: 'lnum';

Je tam i vysvětlující obrázek. kompatibilita je ověřená v běžných prohlížečích, pouze Safari od Apple to nezvládá.

Podobné články jako "Náhled fontů před použitím na webu"

Petr Kobelka | Egoblog.cz | Tvorba www stránek - www.petrkobelka.cz

Petr Kobelka
Autor je zkušeným web developerem a programátorem s více než 10 letými zkušenostmi. Pracuje jako programátor pro známou Olomouckou společnost zabývající se tvorbou internetových a intranetových řešení. Spolu se zaměstnáním pracuje na volné noze a zabývá se tvorbou internetových stránek. Ve volném čase rád fotí, jezdí na kole, plave a cestuje.

Komentáře

E-mail je potřeba pouze pro vygenerování Gravataru!

Oups, žádné komentáře? Buďtě první !!!

Blog píše Petr Kobelka

Petr Kobelka - egoblog.cz

Žádám všechny, kteří mají zájem vkládat komentáře, aby se řídili pravidly NETikety. Komentáře, porušující tato pravidla můžou být bez varování smazány.