Висловлюючи IT

CSS завершені 10 років існування в цьому році! Ті, хто були навколо протягом деякого часу, заробляючи собі на хліб (чи ні) за допомогою CSS, то ви, можливо, знають, як ми голодували за хороший вибір шрифтів. Навіть при відсутності шрифтів дизайнерів, таких як ті, в CSS Zen Garden зробили використання зображень CSS фон для заміни шрифтів в прагненні робити деякі правосуддя у свої проекти. Ми також спробували Flash / JavaScript ® хакі для досягнення наших цілей дизайн. Ні в якому разі це неправильний шлях, щоб отримати шрифтів ми хочемо в нашому веб-дизайну, але, безумовно, це не самий бажаний спосіб. і на веб-дизайнером року, як я, повністю покладався на десять або близько того шрифти для своїх проектів.

Новітні розробки в області веб-стандарти і формати шрифтів дозволяють зробити текст в HTML-шрифтів, крім тих же старих шрифтів. Приходить в "@ fontface" decleration CSS.

@ Fontface provids рішення посилання на сам файл шрифту і витягти його з Інтернету. Використання @ fontface, розробники можуть використовувати шрифти без заморожування текст в якості фонового зображення. Реалізація дуже прямо вперед, як показано нижче, але, як і всі хороші речі мають CON частини до нього, не всі браузери підтримують один "тип шрифту". Якщо ви плануєте використовувати @ fontface на сайті з вимогою підтримку крос-браузер, то ви повинні будете надати джерел різних типів шрифтів того ж самого.

1. TrueType - формат, розроблений, щоб добре виглядати на екрані. Рекомендовані особливо для Windows, браузерів (Chrome).
2. OpenType (ФФБ) - це формат краще для друку роботи і не завжди добре виглядати на Windows.
3. СРВ - Ви потребуєте в цьому форматі, якщо ви хочете націлити Internet Explorer. IE не буде використовувати будь-який інший формат. Наші СРВ було б вважати "Lite", оскільки вони не є ні стислі ні доменів обмежена.
4. SVG - це XML-формат, підтримуваний деякими браузерами, включаючи iPhone.
5. WOFF - це крос-браузерна, веб-шрифтів формату тільки легкий (шрифт дані поштову стиснений) і може бути зібраний як з TrueType або PostScript (CFF) описує. В даний час підтримуються FireFox 3.6 +.

Використання @ fontface

  @ Шрифт особі {
 сімейство шрифтів: "CalligraphyFLFRegular;
 SRC: URL ('CalligraphyFLF.eot');
 SRC: місцеві («CalligraphyFLF), місцеві (« CalligraphyFLF), гіперпосилання ('CalligraphyFLF.woff) формату ("WOFF), гіперпосилання (' CalligraphyFLF.ttf) формату (" TrueType "), URL-адресу (" CalligraphyFLF . SVG # CalligraphyFLF) формату ("SVG");
 }
 @ Шрифт особі {
   сімейство шрифтів: "Ваш шрифт";
   SRC: URL ("Шрифти / font_filename.eot");
   SRC: місцеві («Альтернативні назви"), місцеві ("Alternatename"),
     URL ("Шрифти / font_filename.woff») формату ("WOFF"),
     URL ("Шрифти / font_filename.otf») формату ("OpenType"),
     URL ("Шрифти / font_filename.svg # font_filename») формату ("SVG");
   }
 h2 {сімейство шрифтів: "Ваш шрифт", Грузія, засічок;} 

Як ви можете бачити з наведеного вище прикладу, щоб включити вибраний шрифт шрифтом, потрібно пов'язати з набором fonttypes по тим же шрифтом. Тому люди ставляться до нього як "Font Kit".
Є набори шрифтів доступні, що дозволяє явно зв'язок з CSS @ шрифт особі майно під Ліцензійну угоду з кінцевим користувачем (EULA).

Корисні ресурси WebFont:

• Шрифти для @ шрифт особі вкладення вікі-сторінок в http://webfonts.info/wiki/index.php?title=Main_Page
  
• Ray Larabie . Він є відомим дизайнером шрифтів, який зробив сотні цікавих TrueType шрифти у вільному доступі для використання в Інтернеті. Його шрифти елегантний, декоративні, і грайлива.
• Дітер Steffmann ще один чудовий дизайнер шрифту. Він теж зробив багато гарних шрифтів, доступних для будь-якого використання.
• Шрифт магазин : пропонує шрифти, розроблені спеціально для використання мережі. Більше 30 найуспішніших сімей FontFont тепер доступні у вигляді веб-FontFonts. FontShop також має детальну інструкцію WebFont http://www.fontshop.com/blog/newsletters/pdf/webfontfontuserguide.pdf
  
• Шрифт Білка : Вітрини всіх шрифтів, Font Squirrel пропонує для використання з @ шрифт особі вкладення CSS. Font Squirrel пропонує вражаючий кількість типів, робить його мертвим просто вибрати один із, так і звичайним користувачам пропонується "набори" - шрифт за вашим вибором, в декількох форматах, в комплекті з демо HTML і CSS, який використовує дуже поточний @ шрифт особі синтаксис . Вони також пропонують спосіб зробити свій власний @ шрифт особі комплектів . Якщо шрифт ви хочете використовувати була ліцензована (як правило ті, які приходять з вашого комп'ютера, не обов'язково добре), генератор виробляє СРВ, SVG, і агов! WOFF файли.