Как сделать фавикон для сайта или блога?

Привет, друзья! Слышали ли вы когда-нибудь про фавикон (favicon)? Если нет, то эта статья для вас.

как сделать фавикон

Фавикон (favicon) – это маленькая иконка, которая отображается во вкладке браузера перед доменным именем сайта, или на странице результатов поиска перед вашей ссылкой.

Слово Favicon сокращенное от англиского FAVorites ICON, что означает значок для избранного. Фавикон имеет стандартный размер 16×16 пикселей и загружается на сайт в формате ICO.

Вот как выглядит фавикон во вкладке браузера:

фавикон в браузере

И на странице результатов поиска:

фавикон в поиске

Фавикон можно сделать и добавить на сайт несколькими способами:

  • Заказать у фрилансера и загрузить собственный уникальный фавикон;
  • Нарисовать онлайн;
  • Уменьшить картинку большего размера и изменить формат на ICO;
  • Взять любой готовый фавикон из библиотеки и загрузить себе;

Я расскажу о нескольких сервисах, где можно сделать фавикон для сайта.

Генератор фавикон – favicon.cc

favicon_cc

Один из лучших генераторов фавикон — favicon.cc (ссылку давать не буду, просто скопируйте домен и вставьте в адресную строку браузера).

Здесь можно самому нарисовать фавикон, правда нарисовать что-то стоящее на 16 квадратиках не получиться.

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

После того как фавикон нарисован, его можно скачать на компьютер.

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

фавикон из библиотеки

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

изменить размер картинки

Генератор фавикон – favicon.ru

favicon_ru

Еще один полностью русскоязычный генератор фавикон — favicon.ru

Можно так же нарисовать свой фавикон, заказать фавикон у профессиональных дизайнеров или сгенерировать из своего изображения.

Генератор фавикон favicon.by

favicon_by

На сайте favicon.by вам не нужно ничего рисовать, можно просто загрузить свое изображение и сгенерировать фавикон как в обычном статичном виде, так и в аннимированном, и скачать его ZIP-архивом. Но сразу хочу предупредить, что аннимированный фавикон поддерживается не всеми браузерами.

Как установить фавикон на сайт?

Чтобы установить фавикон на сайт, нужно его просто загрузить в корневую директорию вашего сайта или блога через FTP клиент или через браузер.

Адрес корневой директории должен быть следующий:

http://ваш сайт/favicon.ico

Зачем нужен фавикон сайту?

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

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

Поделись информацией:
Помогла статья? Оцените её
1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд
Загрузка...
Комментарии
  1. Андрей

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

    • Андрей Назыров

      Зато у вас уникальный фавикон. Редко кто из блоггеров в качестве фавикон ставит свое фото.

  2. Татьяна

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

  3. Даниил Привольнов

    А я фавикончик сам нарисовал. Парусник — это путешествие, чему и посвящен мой блог 😉

    • Андрей Назыров

      😉 отличный фавикончик!

  4. Гульнара

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

    • Андрей Назыров

      Пожалуйста, Гульнара.
      Рисовать в редакторах не у каждого получается. Я несколько раз пытался, но ничего не получилось, поэтому взял готовый фавикончик с библиотеки 🙂

  5. Юрий Йосифович

    Иконочка нужна, вот недавно посмотрел, что у меня её нет, а стандартная выбрасывает ошибку — и теперь как раз задумался сделать, на то лог на хостинге из за того что её нет растет как на дрожжах 🙂

  6. Антон Холкин

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

  7. Ольга

    А я бы не сказала, что редко 🙂 Многие кто советую ставить фото в фавикон. И у меня когда-то стоял, но потом решила обойтись без фото. Все равно качество не очень было))

  8. Алексей

    Фавикон классная штука. Он запоминается посетителям. Правда больше запоминают логотип, но в продвижении важны все мельчайшие детали. Лично мне помогает мой фавикон определять быстрее свои позиции в Яндекс. То есть не по ссылкам смотрю, а на favicon.

  9. Юрий Йосифович

    Я вообще не встречал файвиконы в виде фото — счас же пойду посмотрю что там у Андрея!

  10. Юрий Ваценко

    Фавикон нужная штука, но я не делал его сам, не помню на каком-то сервисе его скачать и все.

  11. Denis

    В идеале в фавиконе должен отображаться логотип.

  12. Елена

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

    • Андрей Назыров

      Пожалуйста, Елена. У вас симпатичный фавикон.

  13. Владимир

    Без фавикона сайт в поисковой выдаче как-то не цепляет глаз (актуально для Яндекса).
    Я делал свой фавикон в сервисе favicon.cc

  14. Александр Череп

    Я где-то скачал уже готовый, уже и не помню где.)))

  15. Александр Рус

    Елена, я тоже самое, люблю на все готовенькое 🙂

  16. Азик

    Я уже ставил фавикон, потом обновил тему и он пропал…
    Надо опять сделать! Спасибо за статью, она очень вовремя!)

    • Андрей Назыров

      Пожалуйста, Азик.

  17. Дмитрий

    Меня берет в смех, когда я вижу стандартный фавикон (типа ucoz, joomla)))

  18. Лара

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

    • Андрей Назыров

      Я просто удивляюсь с тех, кто выводит фавикон плагином 🙂

  19. Никита Волков

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

  20. Лара

    У меня фавикон выведен плагином, я просто на хостинг закачала свою картинку. Я бы не сказала, что это сильно грузит блог, но понимаю, что многие избавляются от плагинов. Возможно, и мне следует)))

  21. Юрий Йосифович

    Юрец, а я сам делал, правда как страшная получилась, но точно уникальная!

    • Иван Зелинский

      Я тоже пробовал сделать себе фавикон очень страшненький и я отказался от затеи самостоятельного изготовления

  22. Юрий ♕

    Я себе в фотошопе недавно нарисовал. Не верх совершенства, но пойдет.

  23. Евгений

    Я себе тоже сделал через генератор фавикон, всё равно хоть как то но с ним блог выделяется)

  24. Женя Климович

    Лично для меня было главной проблемой придумать фавикон, а не реализовать его. Но в целом вы доступно все объяснили, Андрей. Думаю новичкам это пригодиться.

  25. Денис Скрипник

    Пользуюсь favicon.ru. Надо будет, кстати, попробовать заказать у них Favicon — интересна разница. Конечно я её не увижу из-за ограничений по зрению, но родные и друзья смогут сравнить сгенерированную фотографию и созданную под заказ.

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