Создание иконок для сайта онлайн-редактором X-Icon Editor

Блог Владимира Шишкова

Как создать, раскрутить и зарабатывать на своем блоге

Дизайн и графика

Создание иконок для сайта онлайн-редактором

Создание иконок для сайта онлайн-редактором
5 (100%) 34 голос[ов]

Создание иконок для сайта онлайн-редактором

Приветствую друзья. В данной статье мы с Вами поговорим о том, как просто создавать различные иконки с раcширением .ico для своих сайтов. Данные иконки отображаются на вкладке браузера при открытии сайта, что придает сайту большую привлекательность. Картинку для иконки можно скачать в интернет или создать ее самому. Давайте возьмем любую картинку в формате .png или .jpeg и создадим иконку.

Картинка для создания иконки

Для примера я возьму картинку “Торт” в формате .png, хотя данный формат обычно больше по объему, чем формат .jpeg, но у .png можно сделать прозрачный фон, для того чтобы на иконке была видна только картинка без фона. Обычно прозрачный фон я делаю в программе Photoshop. Итак наша картинка будет выглядеть вот так:

Картинка Торт

Онлайн-редактор X-Icon Editor для создания иконок

Теперь для того, чтобы сделать из этой картинки иконку для сайта, заходим в онлайн редактор X-Icon Editor:

Онлайн-Редактор иконок

Импорт картинки в онлайн-редактор

Нажимаем на кнопку “Import” и выбираем нашу картинку.

Импорт картинки в онлайн-редактор

Чтобы картинка полностью помещалась в выделенном фрагменте (п. 2), нужно чтобы стороны картинки были одинаковые и составляли квадрат. Также здесь (п. 3) Вы можете выбрать размер иконки поставив необходимые галочки. Обычно выбирают иконку со сторонами 32х32, но Вы можете выбрать любую, какая Вам понадобиться. После того, как Вы выбрали размер иконки нажимаем на кнопку ОК.

Импортированная иконка

Просмотр готовой иконки в браузере

Теперь нажимаем кнопку “Preview”, что означает просмотр и смотрим как наша иконка будет выглядеть в различных браузерах.

Просмотр иконки в браузере

Как мы видим в просмотре наша иконка выглядит очень хорошо. Теперь переходим к следующему шагу. Это экспорт нашей иконки на компьютер.

Скачивание иконки на ПК

Экспортируем готовую иконку на компьютер

Нажимаем кнопку “Export” и в появившемся окне нажимаем на кнопку “Export your icon”.

Окно экспорта иконки

Теперь наша иконка скачана на компьютер.

Иконка скачанная на ПК

Заходим в папку, куда была скачана наша иконка, чтобы посмотреть на нее.

Папка со скаченной иконкой

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

Буду рад Вашим вопросам и комментариям

Успехов Вам
С уважением Владимир Шишков

Если вы нашли ошибку, пожалуйста, выделите фрагмент текста и нажмите Ctrl+Enter.

Создание иконок для сайта онлайн-редактором
5 (100%) 34 голос[ов]

Дизайн и графика

Рекомендую статьи

Добавить комментарий

Войти с помощью: 

Ваш e-mail не будет опубликован.



Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: