Вам понадобится
- Готовое изображение для иконки или любой графический редактор для ее создания.
Инструкция
1
Выберите подходящую картинку, из которой будет создана иконка favicon.ico.
- квадратное изображение
- небольшого размера
- простое, без мелких деталей
- размер файла – не больше 300 кБ.
Лучше использовать один легкоузнаваемый предмет, с четкими границами и контрастным фоном. Например, логотип компании или другое простое изображение.
Вы можете создать эту картинку сами, с помощью любого графического редактора.
Можно подобрать несколько изображений, и затем выбрать из получившихся иконок самую лучшую.
- квадратное изображение
- небольшого размера
- простое, без мелких деталей
- размер файла – не больше 300 кБ.
Лучше использовать один легкоузнаваемый предмет, с четкими границами и контрастным фоном. Например, логотип компании или другое простое изображение.
Вы можете создать эту картинку сами, с помощью любого графического редактора.
Можно подобрать несколько изображений, и затем выбрать из получившихся иконок самую лучшую.
2
Создание иконки.
Существует много онлайн-сервисов, которые предлагают такую услугу. Задайте поиск в любой поисковой системе по словам «favicon.ico». Выберите понравившийся вам сервис.
Разберем создание иконки на примере сайта favicon.ru.
- Зайдите на сайт.
- Появляется окно создания иконки. Нажмите кнопку «Обзор...» и выберите файл на своем компьютере, который нужно преобразовать в favicon.ico.
- Нажмите «Создать favicon.ico!»
- Появляется окно - вид адресной строки с получившейся иконкой.
- Если результат вам понравился – нажмите «Скачать favicon.ico!». В появившемся окне загрузки выберите «Сохранить», чтобы сохранить иконку на жестком диске.
Если вы хотите что-то изменить:
– нажмите «Редактировать иконку» - и в появившемся простом графическом редакторе внесите изменения.
- либо выберите «Создать еще одну иконку» - и попробуйте создать ее из другого файла.
Существует много онлайн-сервисов, которые предлагают такую услугу. Задайте поиск в любой поисковой системе по словам «favicon.ico». Выберите понравившийся вам сервис.
Разберем создание иконки на примере сайта favicon.ru.
- Зайдите на сайт.
- Появляется окно создания иконки. Нажмите кнопку «Обзор...» и выберите файл на своем компьютере, который нужно преобразовать в favicon.ico.
- Нажмите «Создать favicon.ico!»
- Появляется окно - вид адресной строки с получившейся иконкой.
- Если результат вам понравился – нажмите «Скачать favicon.ico!». В появившемся окне загрузки выберите «Сохранить», чтобы сохранить иконку на жестком диске.
Если вы хотите что-то изменить:
– нажмите «Редактировать иконку» - и в появившемся простом графическом редакторе внесите изменения.
- либо выберите «Создать еще одну иконку» - и попробуйте создать ее из другого файла.
3
Добавляем иконку на сайт.
Закачайте иконку в корневую директорию вашего сайта.
- Например, "www" или "public_html". Если вы не знаете точный путь к корневой директории - уточните его в службе поддержки.
Пропишите на каждой странице сайта между тегами и две строки:
(Сейчас этот этап необязателен. Браузеры могут найти favicon.ico и без этих строк).
Закачайте иконку в корневую директорию вашего сайта.
- Например, "www" или "public_html". Если вы не знаете точный путь к корневой директории - уточните его в службе поддержки.
Пропишите на каждой странице сайта между тегами и две строки:
(Сейчас этот этап необязателен. Браузеры могут найти favicon.ico и без этих строк).
Обратите внимание
Чтобы убедиться, что иконка добавлена и отображается:
- наберите в строке браузера http://yoursite.ru /favicon.ico (где yoursite.ru – адрес вашего сайта).
Если иконка в браузере загрузилась – значит, все сделано правильно.
- обновите страницу браузера – иконка появится в адресной строке.
- в результатах выдачи Яндекса иконка появится не сразу, может пройти несколько дней.
- наберите в строке браузера http://yoursite.ru /favicon.ico (где yoursite.ru – адрес вашего сайта).
Если иконка в браузере загрузилась – значит, все сделано правильно.
- обновите страницу браузера – иконка появится в адресной строке.
- в результатах выдачи Яндекса иконка появится не сразу, может пройти несколько дней.
Полезный совет
Если вы не придумали, что именно должно быть изображено на иконке:
- поищите картинку в интернете.
- посмотрите иконки на сайтах, близких по тематике вашему – и придумайте похожую.
- используйте букву, цифру, символ, имеющие отношение к вашему сайту. Позже вы сможете заменить изображение, когда подберете более подходящий вариант.
Яндекс показывает favicon.ico в результатах поиска рядом с названием сайта.
Если ваша иконка выделяется на фоне остальных – пользователь охотнее кликнет и перейдет именно на ваш сайт.
- поищите картинку в интернете.
- посмотрите иконки на сайтах, близких по тематике вашему – и придумайте похожую.
- используйте букву, цифру, символ, имеющие отношение к вашему сайту. Позже вы сможете заменить изображение, когда подберете более подходящий вариант.
Яндекс показывает favicon.ico в результатах поиска рядом с названием сайта.
Если ваша иконка выделяется на фоне остальных – пользователь охотнее кликнет и перейдет именно на ваш сайт.
Источники:
- Часто задаваемые вопросы по созданию favicon.ico
- как создать иконку ico