Icon Font Generators, которые современный веб-дизайнер должен использовать

  1. Зачем их использовать?
  2. Варианты
  3. Какой выбрать?

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

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

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

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

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

Зачем их использовать?

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

@ font-face может помочь вам создать необходимые правила CSS, связанные с каждым значком. В основном правила использования значков шрифтов ничем не отличаются от тех, которые определяют использование других шрифтов. Генераторы шрифтов значков позволяют создавать классификации значков и добавлять несложную разметку HTML.

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

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

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

Варианты

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

Fontello

Fontello

Fontello - это сложный генератор шрифтов иконок, который сочетает в себе простоту использования и включает в себя одиннадцать бесплатных наборов иконок (например, Font Awesome и Iconic).

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

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

Fontastic

Если вы только начинаете изучать настройку шрифтов значков, Fontastic станет отличным выбором для экономии времени. Он позволяет загружать свои собственные значки в виде файла SVG, конвертируя их за считанные секунды в один файл шрифта.

Затем Fontastic позволяет придать иконкам стиль при изменении их масштаба и цвета. Добавление теней или анимации - это бриз с этим впечатляющим продуктом.

Реклама

Pictos

Pictos

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

Сервер Pictos вставит ваш уникальный шрифт на вашу страницу простым вырезанием и вставкой в ​​ваш HTML. Вам не нужно полагаться на Javascript, когда вы используете их простой CSS-тег «link».

Pictonic

Pictonic

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

Все иконки Pictonic полностью настраиваются в зависимости от размера, цвета и тени. Все, что вы делаете, это выбираете значки и нажимаете кнопку «Продолжить». Мгновенно ваш пакет файлов шрифтов, в зависимости от того, сколько вариантов вы сделали, будет преобразован в один или несколько ваших собственных файлов, которые загружаются вместе с CSS, SVG, PNG и т. Д.

Пользовательский шрифт

Пользовательский шрифт

Работая на Ruby, Font Custom создает действительно уникальные файлы шрифтов вместе с соответствующими файлами CSS. Не требуя настройки, Font Custom позволяет вам быть настолько креативным, насколько вы хотите.

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

IconVault

IconVault

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

IcoMoon

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

Загрузка вашего собственного графического дизайна SVG и шрифтов позволит вам полностью погрузиться в индивидуальную настройку.

Мы любим иконочные шрифты

Заинтересованы в создании вашей существующей библиотеки шрифтов? Попробуйте каталог с открытым исходным кодом We Love Icon Fonts и с легкостью создайте свой собственный набор первоклассных значков шрифтов.

Когда вы сделали свой выбор и готовы к работе, просто нажмите кнопку «Добавить», и все готово. Вам будет предложено использовать CSS, который поможет вам сделать ваш новый значок шрифта еще более специфичным для ваших нужд.

Имейте в виду, что для того, чтобы использовать иконки, выбранные из набора, вам необходимо встроить весь шрифт. С учетом вышесказанного, We Love Icon Fonts позволяет новичкам выполнять профессионально выглядящую работу без особых хлопот.

Font Combiner

Font Combiner

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

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

iconmelon

iconmelon

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

Какой выбрать?

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

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

Зачем их использовать?
Зачем их использовать?
Какой выбрать?