Ищем шрифты для оформления сайта

22 июля 2014 Антон Кулешов 1337 0

Беря в верстку новый проект, очень часто сталкиваешься с проблемой отсутствия необходимых шрифтов, а если их нет у тебя – веб-разработчика, то, практически со 100% вероятностью, их нет и у рядового пользователя интернета, для которого ты и ваяешь сайт.

Реклама

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

На мой взгляд, возможно, только мой, каждый дизайнер просто жаждет обладать своим уникальным и неповторимым шрифтом, причем, чем сложнее шрифт – тем лучше. Ну да, дизайнеры они такие! Нам же, под гнетом заказчика, приходится как-то реализовывать подобные фантазии в реальные страницы. К нашему великому счастью была придумана директива @font-face, которая позволяет отдавать браузерам шрифты напрямую, вследствие чего страницы стали грузиться быстрее (картинок меньше стало), графика улучшилась. Но и тут не все гладко: не все браузеры воспринимают шрифты одинаково: просто закинуть ttf - файл не получится. Тут то и приходят на помощь герои нашей сегодняшней статьи – сайты конвертеры шрифтов, позволяющие перезаписать наш шрифт во все возможные форматы, и тут-то уже ни один браузер не посмеет отстроить страницу некорректно.

Найти хороший сайт, вмещающий в себя большое разнообразие шрифтов - не простая задача. При этом наличие конвертера на этом же ресурсе, весьма не плохой бонус. Хотя и просто сайт, способный конвертировать шрифты для веба, тоже очень полезен при разработке веб-приложений. Рассмотрим же пару подобных ресурсов, спасибо их создателям за то, что они есть!

Первый сайт freefontconverter – ресурс забугорный, но невероятно простой, фактически даже не требует каких-либо знаний иностранных языков. Ошибиться нереально, на странице просто присутствует форма конвертера шрифтов и ничего лишнего. Загружаем наш шрифт в любом из представленных форматов: pfa, pfb, pt3, sfd, ttf, otf, otb, t42, cef, cff, gsf, ttc, svg, ik, mf, dfont, bin, suit и bdf – проще говоря, загружаем любой имеющийся файл со шрифтом. Выбираем в выпадающем списке расширение, которое хотим получить и жмякаем кнопку «Convert». Через секунду шрифт уже грузится нам на компьютер. Один только минус – нельзя получить шрифт сразу во всех представленных форматах, ну что же, хотим больше – повторяем операцию нужное количество раз.

sajt-freefontconverter

В совершенстве владеете английским? Хах! Второй «клиент» специально для вас – сайт everythingfonts. Мощнейшая штука для работы со шрифтами и не только для веба. На данный момент я даже не могу сформулировать конкретной задачи по отладке шрифтов, которую бы не решил данный сервис. Разработчики на славу постарались – спасибо им.

Третий сайт - fontsquirrel, один из самых популярных сервисов данного функционала. Имеет довольно мощный конвертер, причем все необходимые форматы мы получаем фактически за один клик. Сам конвертер разделен на уровни: basic, optimal, expert - с каким себя ассоциируете, тем и пользуйтесь. Работает несколько дольше, чем наш первый представитель, но и выбор конечного результата у нас несравненно больший. Помимо всего прочего, на сайте представлена огромная библиотека шрифтов, кириллицы среди них, правда, очень мало.

sajt-fontsquirrel

Большой выбор латинских шрифтов это хорошо, но не для нас. Разработка сайтов для Рунета требует кириллицу! К сожалению «русских» шрифтов на порядок меньше, но и тут есть чем похвастаться: два ресурса fonts-online и ph4. Первый – огромная библиотека шрифтов с очень удобной сортировкой. Каждый шрифт имеет свою карточку и его можно сразу просмотреть. Второй – подарок нашим «замечательным» дизайнерам, там не только куча шрифтов, но и прочая «приблуда» для оформительских нужд и не только.

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

Реклама
Комментариев еще не оставлено
no_avatar
Читайте далее

21 эффект для ссылки

3 августа 2015 Антон Кулешов

Как оформить ссылку на сайте? Этот вопрос наверно один из самых простых, возникающих у веб-разработчика, тем более что до недавнего времени и вопроса, как такового и не было – редко кто менял даже стандартный набор цветов. Появление CSS3 внесло значительные изменения в «серые будни» и страницы «расцвели». Мы уже рассматривали ранее множество различных ховер эффектов, сегодняшняя же CSS библиотечка – заточена под ссылки, хотя, приведенные в ней эффекты легко можно применить и для других элементов страницы. Библиотека содержит следующие эффекты: ссылки при наведении вращаются, меняют перспективу, перестраивают бордеры, фиксируют взгляд, создают эффект куба, вызывают всплывающую подсказку, заключаются в скобки и много других причудливых выделений.

Создаем раскрывающиеся блоки тремя способами, используя jQuery, classList API и JavaScript

17 января 2015 Антон Кулешов

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

Ротатор баннеров – пишем сами

30 мая 2015 Антон Кулешов

Реклама – второй двигатель прогресса, первый – человеческая лень! Далеко не секрет, что реклама – составляет фактически 90% сегодняшнего интернета. Проанализируйте, что мы видим «сёрфя» интернет паутину: магазины и сайты каталоги производителей – без комментариев; стартовая страница Яндекса – основной доход компании реклама, причём как директ, так и различные баннеры; наша с вами почта – продающий контент в ней появился сравнительно недавно, но уже прочно укрепился; социальные сети – должно быть самый извращенный вариант скрытой рекламы, поскольку контент в них, пользователем как реклама не воспринимается, и мы сыпем кучу лайков на пост, откровенно содержащий в себе кучу брендов. Собственно, редкий блогер не повесит у себя на сайте баннерную рекламу.