@ Fontface: Vyjádření to s písmem dle Vašeho výběru a použití WebFonts

CSS dokončeno 10 let existence tohoto roku! Ti, kteří byli nějakou dobu, si vydělávají na chléb (nebo ne) pomocí CSS, pak byste měli vědomi toho, jak jsme byli hladoví po dobrým výběrem písma. I s nedostatkem písma designéři jako ty, na CSS Zen Garden využili obrázků na pozadí CSS nahradit fonty ve snaze o tom nějakou spravedlnost do svých návrhů. Také jsme se pokusili Flash / JavaScript ® hacky k dosažení našich cílů návrhu. V žádném případě to je špatný způsob, jak dostat fonty jsme žádost do našich návrhů, ale rozhodně není způsob, jak nejvíce žádoucí. a více let web designer, stejně jako já, plně spoléhal na deset nebo tak písma pro jejich provedení.

Poslední vývoj na webových standardů a formátů písem, aby bylo možné učinit HTML text v písmech jiných než stejné výchozí starých písem. Dodává se v "@" fontface decleration CSS.

@ Fontface provids řešení propojení na aktuální fontu a získat jej z webu. Pomocí znak @ fontface mohou návrháři pomocí písma, aniž by museli zmrazit text jako obrázky na pozadí. Implementace je velmi přímočará, jak je uvedeno níže, ale jako všechny dobré věci mají CON část k němu, ne všechny prohlížeče podporují jeden "typ písma". Pokud plánujete používat znak @ fontface v místě s křížovou prohlížeče vyžaduje podporu, pak budete muset poskytnout zdroje pro různé typy písma vedlejší stejné.

  1. TrueType - formát navržen tak, aby vypadal dobře na obrazovce. Doporučeno především pro Windows prohlížečů (Chrome).
  2. OpenType (CFF) - Tento formát je lepší pro tiskové práce a ne vždy vypadat dobře na Windows.
  3. EOT - Potřebujete tento formát, pokud chcete zaměřit Internet Explorer. IE nebude používat jiný formát. Naše EOT je by bylo považováno za "Lite", protože nejsou ani komprimované, ani domény omezena.
  4. SVG - toto je XML formát, který podporuje některé prohlížeče včetně iPhone.
  5. WOFF - Tento kříž-browser, web pouze formát písma je lehký (písma data komprimovaný ZIP) a mohou být sestaveny buď TrueType nebo PostScript (CFF) obrysy. To je v současné době podporuje Firefox 3.6 +.

Použití znak @ fontface

 @ Font-face {font-family: "CalligraphyFLFRegular", src: url ("CalligraphyFLF.eot '); src: místní (" CalligraphyFLF "), místní (" CalligraphyFLF "), url (" CalligraphyFLF.woff ") formát ( "woff"), url ("CalligraphyFLF.ttf") formát ("TrueType"), url ("# CalligraphyFLF.svg CalligraphyFLF") formát ("SVG");} @ font-face {font-family: "Vaše písmo "src: url (" / font_filename.eot písma "); src: místní (" Alternativní jméno "), místní (" Alternatename "), url (" / font_filename.woff písma ") formát (" woff "), url ("písma / font_filename.otf") formát ("OpenType"), url ("Písma / font_filename.svg Č. font_filename") formát ("SVG");} h2 {font-family: "Vaše písmo", Gruzie, serif ;} 

Jak můžete vidět z výše uvedeného příkladu, který zahrnuje zvolený font písma, je třeba se odkaz na soubor fonttypes za stejné písmo. Proto lidé se odkazují na to jako "Písmo Kit".
Tam jsou k dispozici sady písma, který výslovně umožňuje propojení s CSS @ font-face vlastnictví k němu na základě licenční smlouvy s koncovým uživatelem (EULA).

Užitečné WebFont zdroje:

  • Fonty jsou k dispozici pro @ font-face vnoření stránky wiki na http://webfonts.info/wiki/index.php?title=Main_Page~~pobj
  • Ray Larabie . On je známý designér písma, který učinil stovky zajímavých TrueType fontů volně k dispozici pro použití na webu. Jeho písma jsou elegantní, dekorativní a hravé.
  • Dieter Steffmann je další velká písma designér. On také dělal mnoho krásných fonty dostupné pro každého, kdo se má použít.
  • Font obchod : nabízí písma určené speciálně pro webové použití. Více než 30 z nejúspěšnějších FontFont rodiny jsou nyní dostupné jako webové FontFonts. FontShop také má detailní WebFont uživatelská příručka http://www.fontshop.com/blog/newsletters/pdf/webfontfontuserguide.pdf~~dobj
  • Font veverka : vitríny všechna písma Font Veverka nabízí pro použití s @ font-face vkládání CSS. Písmo Veverka nabízí impozantní množství typu, je to mrtvý jednoduché vybrat jedno ven, a hravě nabízí "výstroje" - písmo vašeho výběru, v několika formátech, balený s demo HTML a CSS, které používá velmi aktuální @ font-face syntaxe . Nabízejí také způsob, jak vytvořit svůj vlastní @ font-face sestavy . Pokud písmo chcete použít byl licencován správně (ty, které přijdou s počítačem nemusí být nutně v pořádku), generátor vyrábí EOT, SVG, a hele! WOFF soubory.

Dovolená jeden Namítat

NDK domů | Vyjádření IT | Vyjádření patra | Vyjádření Penmenship | Vyjádření Awe | Vyjádření Myself