Любой Ваш проект, будь то сайт, презентация или стильная визитка имеет в своем составе различный текст. При этом стиль текста имеет огромное значение – он может, как украшать общую композицию, внося в нее гармонию, так и внести дисбаланс  своим аляповатым или несочетающимся видом. Поэтому подбор шрифта зачастую носит очень длительных характер. Также проблемой является то, что разработка нового шрифта, как правило, очень трудоемкий процесс, соответственно  найти легально качественный и красивый шрифт довольно проблематично. На просторах интернета существует полно ресурсов предлагающих скачать различные шрифты, но вот на сколько они легальны для использования – это вопрос открытый. Но выход есть всегда – в сети есть прекрасный сайт с легальным содержанием в виде огромной подборки различных шрифтов.
Представляю Вам один из старейших ресурсов посвященный различным шрифтам - Dafont.com

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

Огромным достоинством ресурса является наличие боле 50 кирилистических шрифтов, что делает особенно актуальным данный ресурс для нашего региона.
Благодаря меню опций вы не только можете вписать текст для предпросмотра, но и выбрать количество отображаемых шрифтов на странице, их размер, тип шрифтов, возможность просмотра всех вариантов одного шрифта и многое другое.

Также присутствует возможность сортировать шрифты, как по популярности, названию,  так и по дате добавления.

Вы конечно можете нейти еще не один десяток ресурсов с различными подборками шрифтов, но как правило они представляют из себя сплошной плагиат и требуют постоянного мониторинга новых поступлений, здесь же все на виду и главное абсолютно легально!

Для презентаций и различных графических решений Dafont.com это конечно выход, но как быть с различными сайтами и веб-приложениями? Конечно, при создании сайта вы можете использовать любой понравившийся Вам шрифт, но где гарантия, что они установлены у конечного пользователя? Ведь стандартный набор шрифтов поддерживаемых любым браузером довольно скуден -Arial, Verdana, Times New Roman, Georgia, Trebuchet MS, Courier New, Comic Sans MS. До недавнего времени эта проблема была довольно острой, но с появлением уникального сервиса от Google, многие веб-дизайнеры смогли здорово облегчить себе жизнь. Представляем Вашему вниманию Google Web Fonts – уникальный сервис дающий возможность вставлять различные шрифты на Ваш сайт посредством JavaScript.

На данный момент ресурс содержит более 500 различных шрифтов, и это не предел – постоянно идет пополнение новыми поступлениями. Также не забыли и о кириллице – их конечно не так много как хотелось бы, не более 40, но это лучше чем ничего.

Сайт Google Web Fonts содержит большое количество различных фильтров помогающих отсортировать шрифты по необходимым именно Вам параметрам.

Также сайт имеет возможность предпросмотра выбраной подборки различных шрифтов, для удобства пользователей реализована функция ввода необходимого Вам текста для оценки его внешнего ввида. При этом Вы можете изменять размер шрифта, сортировать шрифты по популярности, дате добавления и другим параметрам.

Выбранный вами шрифт будет доступен для использования в разделе Quick Use.

Quick Use, представлен 4-мя пунктами:

1. Выбор стиля шрифта и оценка его скорости загрузки.

2. Выбор типа набора символов.

3. Выбор варианта кода для вставки в ваш сайт.

4. Код для вставки в вашу таблицу стилей.

Огромным преимуществом такого типа работы с шрифтами является скорость загрузки – шрифты грузятся с серверов Google, не нагружая ваш личный веб-хостинг, да и стабильность серверов поискового гиганта как правило выше обычного хостинга.
Кроме данного способа Вы также можете скачать необходимые Вам шрифты в формате .ttf нажав на кнопку «Download your Collection», но перед этим не забудьте добавить их в Коллекцию посредством кнопки «Add to Collection».

Онлайн сервис Google Web Fonts не стоит на месте – благодаря абсолютно бесплатной свободной лицензии, дающей возможность встраивать набор шрифтов от Google в любой веб-проект и универсальной кроссбраузерности,  данный сервис получил огромное распространение  среди веб-разработчиков, что несомненно дает возможность сервису динамично развиваться  и пополняться новыми различными шрифтами.

Если среди вышеперечисленных двух проектов Вы не нашли то что искали, или у Вас уже есть подобранный шрифт в Dafont.com но он отсутствует в Google Web Fonts не отчаивайтесь, есть еще один волшебный способ для добавления любого шрифта на сайт!

Представляю Вашему вниманию javascript плагин Cufon. Его работа основана на преобразовании любого шрифта в SVG или VML объект. Рассмотрим подробнее что это. Для интеграции красивого шрифта в сайт ранее дизайнеры использовали его вставку в виде изображений. Плагин Cufon по сути делает тоже самое только посредством JavaScript – в браузерах поддерживающих SVG отрисовывается в виде данных элементов, в других браузерах которые не поддерживают это решение применяется технология VML – где шрифт превращается в графическую картинку посредством JavaScript.

Плагин конечно не идеален, у него есть существенные недостатки - невозможно скопировать и выделить текст, не всегда корректно работает с большими объемами текста, замедленная реакции скрипта – до того как он загрузится  и обработает текст пользователь увидит стандартный шрифт. Несмотря на это на данный момент это одно из лучших решений благодаря кроссбраузерности, простоте применения и возможности редактирования текста стандартными инструментами с применением обычных параметров шрифта, поддержке классов hover, text-shadow, возможности  защиты от копирования.
Стоит отметить также небольшой вес библиотек скрипта благодаря чему скорость загрузки сайта практически не изменится.

Для работы с плагином необходимо скачать JavaScript  библиотеку JavaScript cufon-yui.js.
Теперь нам необходимо создать шрифт посредством Generator. Для начала загружаем фалы с доступными шрифтами (поддерживаются расширения .TTF, .OTF, .PFB).

 Далее выставляем необходимые опции такие как тип шрифта, ограничение использованием другими доменами итд.

 В итоге вы получите файл расширением .js котрый необходимо будет встроить в Ваш сайт вместе с библиотекой cufon-yui.js.

Пример (вставьте перед закрывающимся тегом </head>)

1
2
3
4
5
6
7
8
9

<script type="text/javascript" src="cufon-yui.js"></script>
 
<script type="text/javascript" src="Сгенерированный файл.js "></script>
 
<script type="text/javascript">
 
Cufon.replace("h1");
 
</script>

Данный плагин имеет стандартные опции и методы запуска приведенные в таблицах ниже взятых с сайта xiper.net.

Методы запуска плагина

Опции плагина

 Как Вы видите использование стильных и нестандартных шрифтов при разработке сайта стало просто как никогда. Да и веб-технологии не стоят на месте, предлагая нам все больше творческой свободы при реализации различных задумок. Надеюсь Вы почерпнули что-то новое для себя! Дерзайте.