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

Наш помощник в создании иконки — сервис xiconeditor. Этот сервис позволяет нарисовать иконку самому или сделать ее из готового изображения. Скриншот сайта:

skrin-sajta-ikonok

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

Картинку для иконки можно найти в Яндекс.Картинки. Давайте для примера создадим иконку для женского сайта, именно эта тематика в последнее время очень популярна в интернете.

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

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

Для примера мы возьмем вот этот цветочек:

flower-icon

Выбранную картинку нужно сохранить на компьютер. Затем перейдите на сервис xiconeditor — перейти. Затем выполните следующие действия:

  • нажимаем Import
  • нажимаем Upload
  • выбираем выбранную картинку и нажимаем открыть
  • растягиваем квадрат на изображении по максимум, захватывая весь цветочек
  • нажимаем ОК

Теперь вы можете посмотреть результат:

  • нажимаем Preview
  • нажимаем Preview your icon

У нас получилось:

skrin-sajta-ikonok-resultat

Если вас иконка устраивает, остается лишь ее сохранить. Для этого:

  • нажимаем Export
  • нажимаем Export your icon
  • сохраняем картинку на компьютере

Всё, иконка создана. Осталось только ее разметить на своем сайте. Мы напомним, как это сделать.

Между тегами <head>ЗДЕСЬ</head> размещаем следующий код:

<link rel="shortcut icon" href="ССЫЛКА НА ИКОНКУ"/>

Поздравляем! Вы научились создавать уникальные иконки для сайта + размещать их.

 

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *

*

Не пропусти новые статьи
Ваш e-mail:
Рубрики