Cufón a použití vlastních fontů na stránce
Cufón slouží k použití vlastního fontu na webových stránkách, je to Javascriptový nástroj a jeho správná funkčnost je tudíž podmíněna zapnutým Javascriptem.
Pro použití si musíme stáhnout ze stránek cufon.shoqolate.com soubor cufon-yui.js, který připojíme do dokumentu, tímto jsem splnili první část, druhá část je o vytvoření souboru se samotným fontem, který si vygenerujeme na výše uvedené stránce.
S vyplněním poliček asi nikdo nebude mít problém, ale i kdyby přesto, tak dejte vědět do komentářů nebo e-mail, rád poradím, asi jediný problém je s výběrem „glyphů“, já vybírám Basic Latin, Latin-1, Latin A a Latin B, stačí odzkoušet a otestovat, zda fungují všechny znaky a diakritika.
Po úspěšném stáhnutí souboru a nahrání do stránek, si oba soubory připojíme do dokumentu:
Tímto jsme dostali cufón do stránky, teď ho musíme ještě spustit na daných elementech.
Nejjedodušší zápis, pro nadpis H2, vypadá takto:
Pokud děláme klikací nadpis H2 a chceme hover nad cufónem, tak musíme při volání cufónu zavolat atribut hover a nastavit ho na true:
Musíme ještě pro IE zavolat JS funkci, která nám odstraní bug, který vykresluje cufón se zpožděním, umísťujeme ho nad ukončovací tag </body>:
Popisovat jednotlivé další nastavení nemá cenu, když na oficiálních stránkách je výborná dokumentace.
Pokud Vám i přesto není ještě něco jasné, tak se můžete podívat na stránky, kde jsem cufón hojně použil www.mytendon.cz a www.lanex.cz.
A teď potom všem vysvětlování přejdu k nevýhodám, hlavní je, že text nemůžete označit (v IE s trochou štěstí jde), proto není dobré používat na celé bloky textů, maximálně nadpisy a některé prvky, u kterých se nepočítá s kopírováním.
Celkově je cufón efektní Javascriptový nástroj, který se snad používá a posouvá web do úplně jiného levelu. Určitě doporučuji minimálně zkusit a ošahat si co umí a co se s ním dá všechno dělat
Pro neznalé ještě doplním, že JS funkce
Cufon.now();
se vkládá nad ukončovací tag elementu body.
Jinak s Cufonem mám dobré zkušenosti, můžu ho doporučit.
On tam umístěný byl, ale editor ho převedl jako na tag body a vložil do HTML
Takže opraveno, díky
Jako jo, jen kdyby to nevkladalo ty inline styly
Ale co už.
Přidat komentář