Hezké fonty na webu
30. ledna 2010
Nemožnost používání libovolných písem, která jsou dostupná pro DTP, je „odvěkým“ omezením webových stránek. Potřeba ozvláštnit stránku neobvyklým písmem se nejčastěji týká nadpisů. Použít místo skutečného nadpisu (h1, h2, ...) obrázek s nadpisem je sice možné, ale zcela neprofesionální, protože zvláště nadpisy jsou důležité pro SEO.
Jaké máme tedy možnosti?
- Obrázkový nadpis, který je pomocí CSS pozicován tak, aby vizuálně překrýval nadpis h1, h2 atp.
- @font-face – CSS deklarace umožňující plnohodnotně použít libovolný font (písmo je umístěno na serveru, nikoliv v počítači návštěvníka webu)
- Cufón – písmo převedeno do JS a zobrazeno pomocí JS knihovny Cufon
- sIFR – JS + SWF řešení; písmo převedeno do SWF, JS parsování DOMu a nahrazení elementů s „hezkým písmem“
- Jsou tu další možnosti a postupy se shodným principem jako Cufon (např. typeface.js) nebo dynamické generování obrázkových nadpisů na serveru (FLIR).
CSS3 a HTML5: Když dnes znamená zítra
10. ledna 2010
Aneb jak se připravit na CSS3 a HTML5 již dnes.
Ačkoliv historie CSS3 dle W3C specifikace sahá až do roku 2001, ne všechny nové prohlížeče mají plnou podporu CSS3, případně je v každém prohlížeči podpora určité vlastnosti (například průhlednosti nebo zakulacených rohů) implementována jinak. Žádná nebo problematická podpora CSS3 vlastností vede k obcházení CSS3 složitějšími, ale paradoxně jistějšími postupy.
Pokud nechceme každou vlastnost CSS3 řešit jiným CSS2 nebo Javascriptovým trikem (workaroundem), máme ještě (minimálně) dvě možnosti a to použít JS knihovnu:
- Modernizr – a zobrazovat „šikovnějším“ (rozuměj podporujícím CSS3 a HTML5) prohlížečům modernější kód, při zachování funkčnosti ve starších prohlížečích
- eCSStender – a kompletně emulovat chybějící podporu CSS3 javascriptem
