Создать фавикон онлайн | favicon.ico для сайта

X

• Новости Be1.ru
• Новости SEO

Be1 Вконтакте

1251 подписчиков

Be1 Facebook

1567 подписчиков

Новости

Сообщить о проблеме

Favicon — (от англ. FAVorites ICON в переводе «значок для избранного») — значок веб-сайта размером 16x16px или 32x32px, который отображается браузером в адресной строке или рядом с сохраненной закладкой. Традиционно название и расширение иконки используется favicon.ico.

Наш сервис способен конвертировать выбранное Вами изображение (размером до 175 Кб) в иконку значка сайта (размерами 16x16px или 32x32px). После генерации необходимо лишь загрузить favicon.ico в нужный каталог хостинга сайта.

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

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

Куда загрузить фавикон чтобы он был онлайн?

Для отображения созданного Вами favicon.ico в виде значка сайта необходимо загрузить его в корневой каталог сайта (либо в любой каталог) и указать в коде шаблона сайта абсолютный или относительный путь к нему (подробнее на Wikipedia), пример кода:

Зачем указывать путь к Фавикону?

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

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

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

Отзывы об инструменте

Оценка:

3.6 5 5

23.10.2022  18:16

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

Ответить

20.03.2020  16:00

Не работает, загружаю png 32х32, конвертирую в 32х32. Результат отображается, при скачивании пишет — Ошибка: файлы отсутствуют…

02.05.2017  11:48

Сделал себе отличную фавиконку. Все понятно и удобно. Классно придумали!

Ответить

29.01.2021  10:55

Коллеги, привет!

Инструмент вместо пустого фона вставляет ЧЁРНЫЙ ФОН. Представьте вашу фирменную единичку на черном фоне.

Рука не повернулась единицу поставить, потому что пользуюсь другими инструментами вашего сайта.

Ответить

09.06.2017  00:19

Было бы неплохо, если бы Вы сделали генератор favicon для всех устройств, в т.ч. и ретина-устройств

Ответить

\n’ + ‘

\n’ + ‘

\n’ + ‘ 0\n’ + ‘ \n’ + ‘

\n’ + ‘

\n’ + ‘ 0\n’ + ‘ \n’ + ‘

\n’ + ‘

\n’ + ‘ ‘+item. author+’\n’ + ‘

Создать Favicon

Создать Favicon

Генератор Favicon — это бесплатный онлайн сервис, который позволяет создавать иконки и значки (файл favicon.ico) для вашего сайта.
Данный инструмент позволяет создавать Favicon всех популярных размеров, таких как: 16х16, 32х32, 48х48, 64х64, 128х128.

Назад к инструментам

Инструменты

Генератор Favicon — это бесплатный онлайн сервис, который поваляет создавать иконки и значки (файл favicon.ico) для вашего сайта. Данный инструмент позволяет создавать Favicon всех популярных размеров, таких как: 16х16, 32х32, 48х48, 64х64, 128х128. Выберите размер и изображение (JPG, GIF, PNG), которое вы хотите конвертировать в формат ICO с вашего компьютера и нажмите Создать.

Создать фавикон

Выберите размер

16px x 16px32px x 32px48px x 48px64px x 64px96px x 96px120px x 120px128px x 128px144px x 144px

Выберите фотографию

Для создания favicon необходимо:

1. Выберите размер вашего фавикона
2. Выберите файл и нажмите Создать Favicon
3. Сохраните полученный Favicon на свой компьютер

Как добавить Favicon на сайт?

1. После создания Favicon через наш инструмент, скачайте его на ваш компьютер.
2. Загрузите фавикон в корневую директорию вашего сайта, чтобы он был доступен по адресу https://yoursite.com/favicon.ico
3. Скопируйте код ниже и вставьте в ваш HTML внутри тегов HEAD

   rel - тип ресурса: icon или icon shortcut
   href - адрес файла
   type - тип передаваемых данных. Зависит от формата файла.
   • image/x-icon — для формата ICO;
   • image/gif — для формата GIF;
   • image/jpeg — для формата JPEG;
   • image/png — для формата PNG;
   • image/bmp — для формата BMP.

Примечание. Если в HTML-коде страницы ссылка на фавиконку прописана несколько раз, робот выберет иконку на свое усмотрение. Например, указаны 2 разные иконки, чтобы соответствовать разным поисковым системам.

Требования Яндекса к фавиконке

Примечание: Для отображения в результатах поиска Яндекс загружает фавиконку с HTTPS-версии сайта, если она доступна. Если нет — фавиконка не отображается.

• Размер: 16×16, 32×32, 120×120 пикселей.
• Формат: ICO (рекомендуемый), GIF, JPEG, PNG, BMP.

Требования Google к фавиконке

• Размер: значок сайта должен быть квадратным и иметь размеры, кратные 48 пикселям, например: 16×16, 48×48, 96×96, 144×144 пикселей
• Формат: ICO (рекомендуемый), GIF, JPEG, PNG, BMP.
• Убедитесь, что значок сайта хорошо выглядит при разрешении 16×16 пикселей, так как для показа в результатах поиска масштаб значка будет изменен. Учтите, что добавлять значок размером 16 x 16 пикселей не следует.
• Значок сайта должен служить графическим представлением вашего бренда. Это поможет пользователям быстро узнать ваш сайт при ознакомлении с результатами поиска.

Отображение фавиконки

Если робот загрузил favicon, она появится в результатах поиска в течение двух недель.

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

9 лучших генераторов фавиконок | Блог Webflow

Фавиконы могут быть маленькими, но они имеют большое влияние — они показывают посетителям сайта, где они находятся, и помогают узнаваемости бренда.

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

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

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

1. RealFaviconGenerator

В таких операционных системах, как Android и iOS, а также в веб-браузерах, таких как Internet Explorer и Firefox, предъявляются разные требования к своим фавиконам, задача создания работающего фавикона может быть довольно сложной. RealFaviconGenerator сразу же заверяет вас, что их генератор favicon работает для «всех браузеров. Все платформы. Ваши любимые технологии».

Все, что нужно, это загрузить изображение размером не менее 70x70 пикселей (хотя они рекомендуют 260x260), а RealFaviconGenerator сделает все остальное.

После загрузки файла изображения вы попадаете на экран, показывающий, как он будет выглядеть в различных приложениях, таких как рабочий стол, iOS, Android Chrome и MacOS Safari. У вас также будет возможность поместить файл favicon.ico в корневой каталог или указать ссылку в href, указывающую на другое место назначения.

2. Фавви

‍

Если вы уже используете Figma в процессе проектирования, Favvy — фантастический плагин. Это позволяет экспортировать zip-файл фавиконов прямо из Figma — и все это за то время, которое требуется, чтобы сделать глоток кофе. Favvy прост в использовании, предлагает полную настройку и генерирует необходимые фрагменты HTML-кода, которые вам понадобятся.

3. Favicon.io

Favicon.io выделяется своей простотой. На домашнем экране представлены три различных варианта создания фавикона: с файлом png, текстовым файлом или эмодзи. Все, что вам нужно сделать, это перетащить файл изображения в их конвертер, и вы получите zip-файл с файлом favicon.ico, несколькими версиями Android-Chrome, несколькими favicon pngs и бонусной иконкой Apple-touch для iPad и iPhone. . На Favicon.io также есть полезные обучающие разделы с ответами на часто задаваемые вопросы.

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

4. Looka

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

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

5. Favic-o-matic

Нам нравится Favic-o-matic, потому что это простой в использовании генератор фавиконок с красивым макетом и индивидуальностью. Они предлагают два варианта: «только старый добрый favicon.ico» (стандартные 16x16 и 32x32 px) и «каждый проклятый размер, сэр!» который включает, как вы уже догадались, все размеры и форматы ico, в том числе несколько значков Apple-touch, Microsoft mStiles и favicon pngs.

Большая кнопка «Загрузить изображение» — еще одна приятная часть этого пользовательского интерфейса. После нажатия открывается ваш файловый браузер, чтобы вы могли найти изображение в формате jpeg, png или другое изображение, которое хотите загрузить.

6. Favicon Generator

Favicon Generator славится тем, что является оригинальным веб-сайтом, генерирующим favicon. Они предлагают все распространенные размеры favicon, которые работают с современными браузерами и устройствами. Просто загрузите png, gif, jpg, графику или логотип, чтобы создать фавиконы и необходимые фрагменты html-кода.

7. Faviator

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

8. Formito

Хотите создать значок в стиле Stripe? Formito делает вещи простыми, что делает его немного менее универсальным, чем другие генераторы favicon, но это неплохо. То, что он делает, он делает хорошо, позволяя создавать минималистичные фавиконы, которые легко читаются.

9. Favicon.cc

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

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

Не забывайте о фавиконках в веб-дизайне

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

Хотите узнать больше? Ознакомьтесь с записью в блоге Webflow Фавиконы: все, что вам нужно знать в 2022 году, чтобы погрузиться глубже.

21 июня 2022 г.

Ресурсы

8 лучших бесплатных генераторов Favicon для вашего веб-сайта (2021 г.)

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

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

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

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

Пойдем!

Краткое введение в то, как работают генераторы favicon

Как правило, генераторы фавиконов предлагают несколько различных вариантов создания фавикона:

1. Загрузить изображение — если у вас уже есть изображение, вы можете загрузить его, чтобы преобразовать в оптимизированный формат/размер для фавикона.
2. Шрифт — вы можете выбрать собственный шрифт и текст, а также цвет фона. Например, вы можете использовать одну или две буквы на цветном фоне.
3. Emoji — вы можете использовать любой смайлик в качестве фавиконки, с цветным фоном или без него.

Некоторые инструменты предоставляют все три варианта, а другие — только один или два.

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

Лучшие бесплатные генераторы favicon

Теперь, когда вы знаете, как работают эти инструменты, давайте выберем восемь лучших бесплатных генераторов фавиконок…

• Favicon.io
• Генератор реальных фавиконок
• Favicon-Generator.org
• Ionos Favicon Generator
• Formito Favicon Maker
• Favicomatic
• Genfavicon
• Themeisle Logo Maker

1. Favicon.io

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

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

Если на вашем сайте нет логотипа, вы попали по адресу. Favicon.io также позволяет вам выбирать из более чем 800 вариантов шрифтов из Google Fonts, выбирать цвет фона и даже предпочитаемую форму. Например, вы можете выбрать квадрат, круг или закругленный фон.

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

Попробуйте Favicon.io

2. Генератор реальных фавиконок

Генератор Real Favicon позволяет создать собственный значок за считанные минуты. Ваш фавикон подойдет для любого браузера и будет выглядеть лучше всего на всех платформах и устройствах.

Все, что вам нужно сделать, это загрузить свое изображение в формате .svg , .jpg или .png , и генератор мгновенно покажет вам результаты. Например, он покажет вам, как ваша новая иконка будет выглядеть на Android, iOS и во всех популярных браузерах.

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

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

Попробуйте настоящий генератор фавиконок

3. Favicon-Generator.org

Далее у нас есть инструмент, называемый просто Генератор Favicon. Он позволяет преобразовать файл изображения в значок значка или выбрать из обширной библиотеки готовых значков.

Если у вас есть собственное изображение, вы можете просто загрузить его в формате .jpg , .png

или .gif . Вы также можете сохранить его первоначальные размеры или изменить его размер, чтобы он стал квадратным. Ваш значок будет совместим со всеми браузерами, а также с устройствами Android, Microsoft и iOS.

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

Попробуйте генератор фавиконок

4. Генератор Favicon Ionos

Ionos Favicon Generator — еще один отличный вариант, который поможет вам создать фавикон за считанные минуты. Это позволяет вам преобразовать существующее изображение, создать пользовательскую графику из букв или даже нарисовать предпочтительную форму.

Если у вас уже есть логотип, вы можете загрузить его в формате .jpg , .jpeg или .png . Генератор преобразует его в уменьшенную версию, которую вы сможете использовать во всех браузерах и на всех устройствах. Обратите внимание, что для достижения наилучших результатов вам потребуется квадратное изображение размером не менее 310 × 310 пикселей.

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

Попробуйте генератор фавиконок Ionos

5. Средство создания фавиконок Formito

Наша следующая рекомендация — Formito Favicon Maker. Этот интуитивно понятный инструмент позволяет вам создать собственный значок для вашего веб-сайта на основе инициалов или эмодзи.

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

В качестве альтернативы, если вы предпочитаете что-то более индивидуальное, вы можете выбрать эмодзи и настроить его размер и фон в соответствии со стилем вашего веб-сайта. Когда вы будете довольны, вы можете экспортировать его как . svg или .png или скопируйте его HTML-код, чтобы добавить на свой веб-сайт.

Попробуйте Formito Favicon Maker

6. Фавикоматик

Favicomatic — еще один быстрый инструмент для создания фавикона из изображения или логотипа по вашему выбору.

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

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

Попробуйте Фавикоматик

7. Генфавикон

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

Как и другие генераторы в этом списке, вы можете просто загрузить существующий логотип или изображение в формате .jpeg , .gif или .png . Затем вы выберете нужный размер и обрежете изображение.

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

Попробуйте Genfavicon

8. Создатель логотипа Themeisle

Наша последняя рекомендация — наш собственный Logo Maker. Этот отличный бесплатный инструмент позволяет создать профессиональный логотип без каких-либо дизайнерских навыков.

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

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

Попробуйте Themeisle Logo Maker

Попробуйте один из этих бесплатных генераторов favicon сегодня

Фавикон — это как вишенка на вершине стратегии брендинга вашего сайта. Это помогает вашему сайту выглядеть более законным, и пользователи смогут легко его распознать.

К счастью, вам не нужны какие-либо дизайнерские навыки, так как вы можете быстро создать фавикон онлайн.

В этой статье мы обсудили восемь лучших бесплатных генераторов favicon. Напомним, Favicon.io, Ionos Favicon Generator и Formito Favicon Maker — отличные инструменты для преобразования существующего логотипа или создания фавикона с буквами или смайликами. Кроме того, вы можете использовать наш собственный конструктор логотипов, если хотите создать как профессиональный логотип, так и фавиконку для своего сайта.