05.08.11

5 інструментів для створення красивих шрифтів за допомогою CSS3

Ще до недавно зайшовши на будь який сайт ви бачили стандартні шрифти (Arial, Verdana, Tahoma, Times New Roman чи Georgia). Це пов'язано з тим що за відображення шрифтів відповідають браузери, і якщо написати текст красивим шрифтом а його не буде на комп'ютері відвідувача сайту то цей шрифт ніхто не побачить.
В стандартних шрифтах нічого поганого немає, але деколи хочеться зробити текст більш красивішим. І віднедавна це стало можливо. В Інтернеті появилось декілька інструментів які завдяки CSS3 допоможуть використовувати красиві не стандартні шрифти, і якщо відвідувачі сайту використовують остані версії популярних браузерів то будуть бачити шрифти без проблем.


1. Google Web Fonts
Один з найкращих інструментів це Google Web Fonts. Google надає у ваше розпорядження більше ніж 200 безкоштовних шрифтів.
Завдяки технологіям HTML, CSS і JavaScript ви можете без проблем замінити свої шрифти на сайті. Цей інструмент працює досить швидко, тому ваші відвідувачі не відчують жодних затримок поки будуть відкривати сторінки сайту.
Один з мінусів цього сервісу що там використовуються лише безкоштовні шрифти, але в пропонованій базі є досить широкий вибір і кириличних шрифтів.

2. Font Squirrel
Font Squirrel є хорошою альтернативою Google Web Fonts. Особливо якщо ви переживаєте на яких умовах Google надає свій інструмент для комерційного використання шрифтів. Font Squirrel надає сотні якісних шрифтів для комерційного використання. Ви можете завантажити TTF, EOT, WOFF і SVG шрифти. Поставити їх свій сайт відповідний код і все це буде ідеально працювати на всіх основних браузерах.
Також ви можете додати свої комерційні шрифти, і потім використовувати їх своєму сайті. І все це є повністю безкоштовно.

3. Font Dragr
Ви знайшли якийсь красивий шрифт і захотіли поставити його на свій сайт, але це не значить що він так само буде красиво відображатись на вашому сайті. Стандартні шрифти, такі як Verdana чи Tahoma, були розроблені так що при будь якому розмірі відображаються досить якісно. Але як взнати наскільки якісно будуть відображатись не стандартні шрифти на екранах відвідувачів сайту, особливо це актуально при малих розмірах шрифта.
Для цього і потрібен інструмент Font Dragr. Він дозволяє перевірити як буде відображатись шрифт на вашому екрані в різних розмірах, перед використанням його на сайті.

4. FFFFallback
Все ж таки не всі користувачі зможуть оцінити ваш красивий шрифт. Особливо це стосується тих хто користуються старими браузерами, або мобільними пристроями. На щастя CSS в таких випадках дозволяє замінювати такі шрифти на стандартні.
Але всерівно різні шрифти мають різні розміри, різну відстань між буквами чи словами. Тому існує небезпека що при перегляді вашого сайту дизайн дуже сильно зміниться і стане не читабильним.
Інструмент FFFFallback.com дозволяє показати ваш сайт як він буде виглядати при заміні шрифтів на стандартні. Він накладає дві версії сайту і ви зможете оцінити наскільки ваш сайт змінився.

5. WhatFont
Дуже часто бувають випадки коли ви ходячи по різних сайтах знаходити красивий шрифт, і одразу виникає бажання використати його на своєму сайті. Інструмент WhatFont допоможе вам визначити що це за шрифт і його розмір. Просто запустіть інструмент і наведіть курсор на текст або натисніть на кнопку миші, що ще може бути простіше.

Бонус
Якщо у вас є час і бажання FontStruct і Bitfontmaker дозволять зробити власні шрифти. Обидва інструменти пропонують ряд безкоштовних красивих шрифтів як приклад.

Сайти Font Matrix і Common fonts пропонують список шрифтів які завжди присутні в операційних системах Windows чи Mac. Тому якщо ви хочете використати якийсь шрифт спочатку перевірте наявність його в цих списках. Якщо шрифт по замовченню присутній на більшості операційних систем то вам немає потреб використовувати веб-інструменти для генеруванню шрифтів.
  • rss
  • Del.icio.us
  • Digg
  • Twitter
  • StumbleUpon
  • Reddit
  • Share this on Technorati
  • Post this to Myspace
  • Share this on Blinklist
  • Submit this to DesignFloat

0 коментар(ів):

Дописати коментар

 
Copyright 2011 St@sDesign