Иконка сайта: Иконки интернет сайт — 116,399 бесплатных иконок

html — Как установить иконку для сайта?

Вопрос задан 10 лет 7 месяцев назад

Изменён 4 года 2 месяца назад

Просмотрен 7k раз

Почему-то в разделе head HTML-документа написал:

<link rel="shortcut icon" href="icon/favicon.ico">

Разместил в папке файл «favicon.ico«, но всё равно иконка не отображается!

Кто-нибудь, подскажите, в чём причина, пожалуйста.

• html
• icon

3

Ну, во-первых, надо убедиться, что icon/favicon.ico — верный путь до иконки. Ну если все в порядке, то значит браузер виноват, т.е. кэш. Бывало такое. Но попробуй обмануть, в обоих случаях помогает, так как код страницы меняется.

<link rel="shortcut icon" href="icon/favicon.ico" type="image/x-icon" />

или так (задать абсолютный путь)

<link rel="shortcut icon" href="/icon/favicon.ico">

У вас какой сервер? Если апач, то кинте favicon.ico в корень сайта и будет вам счастье.

1

Попробуй вот так:
<link rel="icon" href="./icon/favicon.ico" type="image/x-icon">

1

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

https://realfavicongenerator.net/

Я всегда вставляю следующим образом (обычно ложу в корень сайта, туда же куда и index. html или index.php:

<link href="favicon.ico" rel="icon"         type="image/x-icon" />
<link href="favicon.ico" rel="shortcut icon"    type="image/x-icon" />

Многие поисковики и браузеры, сами ищут эту иконку в корне сайта по имени favicon

В вашем случае код должен быть таким (если вы указываете относительный путь):

<link href="icon/favicon.ico" rel="icon"        type="image/x-icon" />
<link href="icon/favicon.ico" rel="shortcut icon"   type="image/x-icon" /> 

Да я использую две строки с разными rel=»» атрибутами. Так сложилось исторически из-за браузеров и их «перетягиваний одеяла»

А еще иконка может не показываться, если у неё неверно указан формат. Например сделать иконку в ФШ и сохранить её как .ico почему то не всегда срабатывает. Я делаю иконки в ФШ, сохраняю как jpg а потом программой IcoFX конвертирую их в .ico уже несколько лет так и все отлично работает.

У меня тоже такая проблема была. Короче кидаешь иконку в корень сайта(Не знаю надо или нет но у меня так), прописываешь (С такими скобками< > незнаю как их поставить link rel=»shortcut icon» href=»favicon.

ico» ТЕПЕРЬ! Перезагружаешь сервер свой. У меня Опен Сервер там все просто у тебя не знаю как

1

Зарегистрируйтесь или войдите

Регистрация через Google

Регистрация через Facebook

Регистрация через почту

Отправить без регистрации

Почта

Необходима, но никому не показывается

Отправить без регистрации

Почта

Необходима, но никому не показывается

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

что это, зачем нужен и как создать

Пример полноценного логотипа и фавикона на его основе от дизайнера Mehedi Islam. Источник

Зачем нужен favicon

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

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

С фавиконом бренд запомнят быстрее, поскольку удачно подобранная картинка вызывает ассоциации с ним. Увидев сначала фавиконку, пользователь вспомнит и о бренде. 

Фавикон — часть дизайна целого сайта, поэтому требования к нему предъявляются не меньшие, чем к логотипу. В идеале в фавиконке нужно отобразить миссию и ценности бренда или его основное предназначение. 

Фавикон не влияет на оптимизацию сайта для поисковых систем, однако Яндекс обращает внимание на наличие этой иконки. Если ее нет, то владелец сайта получит сообщение об ошибке в сервисе Яндекс.Вебмастер.

Примеры favicon в результатах поисковой выдачи Яндекса

Правила создания favicon

• Чаще всего для фавиконки берут логотип бренда, адаптируя его под маленький размер. Если логотипа нет, можно взять основные (в идеале контрастные) цвета, используемые для оформления веб-ресурса. В этих цветах создают знак, который будет вызывать у потребителя ассоциации с деятельностью компании. Часто это первая буква названия компании.
• Мелкие детали на фавиконке не будут видны, поэтому текст и другие маленькие элементы лучше не использовать.
• Фавиконка в идеале должна отличаться от конкурентных. Например, яркий цвет или запоминающийся символ, связанный с тематикой бренда, поможет выделить сайт.
• Чтобы favicon в разных местах размещения отображался корректно и в хорошем качестве, его лучше создавать в двух вариантах. Для вкладок в браузере и для поисковой выдачи следует сделать фон прозрачным. Во второй версии лучше использовать сплошную заливку фона.
• Не менее важно соблюсти и технические требования. Причем для разных браузеров и поисковых систем они свои. Подробнее с условиями вы сможете ознакомиться в справках конкретного браузера, Яндекса или Google. Всю важную информацию о разрешении и форматах значков мы приводим ниже.

Варианты иконок приложения в разных цветах от дизайнера Rohanur Rahman Reon. Источник

Размер фавикона

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

У поисковых систем допустимые размеры и рекомендуемые форматы фавиконок отличаются:

• Яндекс рекомендует формат SVG. Он векторный, для него неактуальны конкретные размеры (так как в векторе нет пикселей), и в нем фавикон будет лучшего качества. Можно применять и другие распространенные форматы: ICO, PNG, JPEG и др. Размеры иконок в них — 120×120, 32×32 или 16×16 px.
• В Google есть возможность добавлять фавикон только в мобильную версию. Здесь другие требования. Разрешен размер, кратный 48 пикселям, например 48×48 или 144×144 px. При изменении масштаба качество картинки такого размера не пострадает.

Android-гаджеты с браузером Chrome допускают фавиконки формата png и размером 192×192 px. Операционная система Safari для Apple предусматривает множество вариантов png-иконки в зависимости от размера ссылки на сайт: от 57×57 до 152×152 и даже 180×180 px. На размер фавиконки также влияет и формат. Например, для SVG-формата точных размеров для картинки нет, она просто должна быть квадратной.

Хотя для разных устройств можно сделать единую иконку в формате ICO, PNG или SVG, для удобства пользователей лучше адаптировать фавикон конкретно под те поисковые системы, браузеры и устройства, на которых сайт или приложение будут использоваться.

Фавиконки в разных цветах вместе с пакетом вспомогательных иконок для сайта от bisma shaukat. Источник

Форматы фавикона

Растровые форматы ICO и PNG являются основными для фавиконки. Особенность формата ICO в том, что он в одном файле хранит картинки разных размеров. Но современные браузеры умеют подтягивать нужные размеры из разных файлов, поэтому ICO не так распространен, как раньше. Еще одна причина ухода этого формата — большой вес в том случае, если он хранит в себе много иконок разных размеров. Большинство браузеров, ОС и устройств поддерживает формат PNG. Он более распространен, чем ICO, меньше весит и позволяет создать изображение без фона (с прозрачным фоном).  

Однако совсем отказываться от ICO не стоит. Некоторые старые браузеры, например Internet Explorer версии 10 и ниже, работают только с этим форматом. А если пользователю понадобится сохранить ссылку на сайт на рабочем столе Windows, ICO-файл тоже придет на помощь. Если вы знаете, что юзеры заходят через старые браузеры или сохраняют ссылки на компьютере, — лучше запастись ICO.

Другие разрешенные форматы иконок — SVG, GIF и JPEG — совместимы не со всеми браузерами. Например, формат JPEG в некоторых системах может отображаться некорректно (совсем без картинки или как «битый» файл).

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

Варианты иконок приложения в разных цветах от дизайнера Rohanur Rahman Reon. Источник

Онлайн-сервисы для создания фавиконки

Если вы пока не владеете Adobe Photoshop и Adobe Illustrator — главными графическими редакторами для создания логотипов и иконок, можно попробовать себя в роли дизайнера фавиконок с помощью доступных онлайн-сервисов.

Favicon.by. В программе можно самому нарисовать иконку для сайта по пикселям или подкорректировать уже имеющуюся. Здесь можно загрузить картинку с компьютера или с сайта и потом отредактировать. Просмотр результата возможен до скачивания. В итоге вы получаете фавикон в формате ICO и размере 16×16 px.

Logaster. В приложении можно сделать логотип и на его основе —  фавикон. Для расширенного функционала придется доплатить.Perfectoweb. Чтобы создать иконку, нужно загрузить картинку, выбрать подходящий размер и скачать готовый фавикон. Доступны все популярные размеры.

Favicon.io. Этот сервис позволяет сделать фавикон из текста, картинки и даже эмодзи. Вы можете сами выбрать цвет иконки или общий фон. В результате получаются фавиконы нескольких размеров в формате ICO и PNG. Можно скачать иконку или вставить ее сразу на сайт путем копирования кода.

Пример работы генератора иконок в сервисе Favicon.io. Стрелкой показан будущий вид фавикона в разных размерах.

Faviconit. В приложение надо загрузить картинку (минимальный размер 310×310 px, вес не более 5 Мб). После обработки изображения можно скачать архивом вместе с кодом для вставки. 

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

Favic-o-matic. Здесь можно генерировать фавиконы сразу в 20 вариантах размера или в стандартных размерах: 16х16, 32х32 px. Принимаются исходники размером от 310×310 px. Готовый пакет скачивается автоматически с генерацией кода для сайта.

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

Xiconeditor.com. Полноценный пиксельный графический редактор для иконок. Здесь есть все инструменты: кисти, карандаши, ластики и другие. Если у вас есть готовое изображение, можно загрузить его на сайт для редактирования. Готовый фавикон можно предварительно посмотреть так, как его увидят другие пользователи.

Интерфейс сервиса xiconeditor.com с полем для рисования и инструментами

Antifavicon.com. От перечисленных выше программ отличается тем, что фавиконка генерируется из текста, а не из изображений. Чтобы получить картинку, нужно ввести в поле буквы или числа. Можно поменять цвета фона или самого текста. Здесь нет большого выбора инструментов для дизайна, но редактор отлично подойдет, если нужен простой и незатейливый значок.

Дизайнерские favicon от Sanni Joe. Источник

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

Существуют разные способы добавления фавиконки на сайт в зависимости от системы управления сайтом (CMS).

Если сайт без CMS

1. Между тегами <head>…</head> на главной странице нужно вставить часть кода с адресом фавикона и типом передаваемых данных. Укажите путь к месту хранения картинки (url), имя файла и используемый формат.  
2. Если страница редактировалась не на хостинге, нужно загрузить файл этой редактируемой страницы на хостинг, заменив существующий, и затем сохранить. 
3. Поместите изображение в корневой каталог сайта. Он должен быть доступен по прямой ссылке и отдавать ответ сервера «200 OK». Файл может быть загружен через собственную панель управления или через сторонний менеджер файлов. 

Чтобы посмотреть, как будет выглядеть фавикон в браузерах, нужно добавить адрес следующих сервисов к URL сайта:

• http://favicon.yandex.net/favicon/mysite.ru — для Яндекса;
• http://www.google.com/s2/favicons?domain=mysite.ru — для Google.

Если сайт на CMS

В этом случае фрагмент кода также добавляется между <head>-тегами в файл с шаблоном хедера сайта.

В WordPress можно добавить фавиконку через стандартные настройки:

1. Зайти в раздел «Внешний вид» аккаунта администратора CMS и кликнуть по «Настройкам».
2. Затем кликнуть по кнопке с выбором изображения в разделе иконки сайта.
3. Загрузить изображение.
4. Щелкнуть на кнопку публикации, чтобы сохранить изменения.

Если сайт сделан на конструкторе

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

Дизайн логотипа и иконок на фонах различного цвета от Star Wolfy. Источник

Распространенные ошибки

Если фавикон сайта не отображается, это может говорить об одной или нескольких проблемах:

• Индексация фавикона поисковой системой еще не произошла. Обычно этот процесс занимает от двух недель до двух месяцев.
• Недопустимый размер или формат фавикона. В коде иконки должны быть все обязательные атрибуты.
• Код иконки размещен не в том блоке. Корректный блок для размещения фавикона — <head>.
• Индексация иконки в файле robots. txt не разрешена. Если это так, исправьте Disallow («Не разрешать») на Allow («Разрешить»).
• Недопустимое изображение. На картинке не должно быть запрещенных и похожих на них символов.
• Фавикон низкого качества или скопирован. Если вы скопируете иконку с какого-то другого источника или загрузите ее в плохом качестве, поисковая система может проигнорировать ее.
• Браузерное кеширование. Чтобы устранить проблему, почистите кеш браузера и затем обновите страницу. Воспользуйтесь сочетанием клавиш Ctrl + F5, чтобы остаться при этом на странице.

ИСКРА —
неделя знакомства
с дизайн-профессиями

бесплатно

ИСКРА —
неделя знакомства
с дизайн-профессиями

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

разжечь искру

Другие термины на букву «F»

FigmaFramer

← Все термины

Как добавить и удалить логотип и значок сайта в теме блока WordPress

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

Результаты обучения

Учащиеся смогут…

1. Добавить логотип сайта и значок сайта в тему блока WordPress

Вопросы на понимание

1. Правда или ложь? Значок вашего сайта и логотип сайта должны быть одним и тем же изображением.
2. Правда или ложь? Чтобы добавить значок сайта, вы должны сначала добавить блок логотипа сайта.
3. Правда или ложь? Все логотипы сайта являются хорошими значками сайта.
4. Зачем добавлять тег alt к логотипу вашего сайта?

Стенограмма

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

К концу этого урока вы сможете добавить логотип сайта и значок сайта на веб-сайт, использующий блочную тему. Для начала, что такое логотип и зачем он нужен? Что ж, логотип — это графическое представление вас, вашего бренда, вашей компании или даже просто вашего веб-сайта и всех идей, которые он содержит. Логотип представляет ваш бренд и помогает людям узнавать вас и доверять вам. Как только вы видите логотип известных брендов, таких как Reddit, LinkedIn, WordPress или, возможно, других известных брендов, вы часто сразу понимаете, что это за компания. Или, если вы не знакомы с этой компанией, вы можете сделать некоторые предположения о каждой из них, основываясь на их логотипах и значках сайтов. Теперь логотипы чаще всего появляются в шапке или футере веб-сайта, тогда как значки сайтов чаще всего отображаются во вкладке браузера и на панелях закладок. Для тех из нас, у кого часто открывается слишком много вкладок одновременно, эти значки сайтов помогают быстро определить, какая вкладка нам нужна.

Прежде чем вы сможете добавить значок в тему блока, вам нужно добавить логотип, поэтому мы начнем с этого. Чтобы установить логотип сайта в теме блока, перейдите в раздел «Внешний вид» > «Редактор».

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

Однако что делать, если вы используете новейшую тему 2023 года или другую тему блока, а блок логотипа сайта еще не существует? Вы заметите, что если я разверну часть своего полного шаблона заголовка в теме 2023 года, логотипа сайта не будет. Итак, как я могу добавить один? Первое, что я сделаю, это решу, где я хочу этот логотип. Я думаю, что я хотел бы поставить его перед названием сайта. Поэтому, используя представление списка, я нажму «Заголовок сайта». Выберите эти три точки и нажмите «вставить перед».

Теперь я буду использовать свой вставщик здесь

для поиска логотипа сайта.

Вуаля, добавлено.

Для начала я нажму «логотип сайта» в списке, а затем кнопку «добавить логотип сайта».

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

Когда вы выбираете фотографию, которую хотите использовать в качестве логотипа своего сайта, не забудьте написать альтернативный текст в этом поле. Этот альтернативный текст отлично подходит как для людей с ограниченными возможностями, которые используют программы чтения с экрана, чтобы понять, что происходит на экране, так и для поисковых систем, чтобы найти и перечислить ваш веб-сайт в результатах поиска. Лучшей практикой для логотипов является использование названия вашего веб-сайта или компании и слова «логотип». Так, например, я напишу «Логотип спасения пиратских попугаев».

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

Обязательно включите это. После того, как я выбрал свой логотип и ввел альтернативный текст, я могу нажать «Выбрать». Теперь у меня есть логотип на моей блочной теме.

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

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

Вы также можете очистить его,

вы можете обрезать изображение в различных соотношениях

вы можете заменить свой логотип, нажав кнопку «Заменить», выбрав новый из вашей медиатеки.

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

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

Я могу сделать этот логотип ссылкой, которая

открывается в новой вкладке.

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

Посмотрим, что произойдет, если я использую это как значок сайта.

Обновляю страницу.

И вы видите, иконка моего сайта изменилась и здесь и на этой букве «W» и здесь вверху в моем браузере. А что, если вам нужна иконка сайта без логотипа сайта? Ну, сначала вам нужно установить логотип, но вы всегда можете удалить его позже, и значок вашего сайта останется. Но допустим, я не хотел, чтобы мой логотип соответствовал значку моего сайта. Не все логотипы сайтов могут быть отличными значками. То, что здесь легко прочитать, здесь даже не разобрать. Это что, лягушка? Давайте выберем другой значок.

Я нажму кнопку «Настройки» на значке этого сайта, и я перейду к сокращенной версии настройщика. Если я прокручиваю вниз, у меня есть возможность удалить это изображение. И я также могу полностью выбрать другой значок сайта. Итак, давайте выберем что-нибудь другое. Это немного больше. Так что я собираюсь выбрать это. Он больше похож на попугая, чем на лягушку.

Теперь, если я вернусь в свой редактор,

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

Для получения дополнительных руководств, интерактивных семинаров и курсов посетите сайт Learn.wordpress.org До встречи в следующий раз

Как легко добавить значок на ваш веб-сайт WordPress

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

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

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

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

1. Что такое фавикон в WordPress?

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

2. Как добавить значок на мой сайт WordPress?

Вы можете вручную загрузить изображение в корневой каталог вашего сайта или использовать плагин для добавления фавикона на ваш сайт WordPress. Вы можете установить значок значка в качестве значка вашего сайта в панели администратора WordPress в разделе «Внешний вид»> «Настроить»> «Идентификация сайта» после его загрузки.

3. Какого размера должен быть фавикон WordPress?

Фавиконы WordPress должны иметь размер 32×32 или 16×16 пикселей. Чтобы обеспечить совместимость, важно включать различные размеры вашего значка, поскольку некоторые браузеры могут потребовать их.

4. Какой тип файла мне следует использовать для моего фавикона WordPress?

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

5. Могу ли я использовать пользовательское изображение в качестве фавикона WordPress?

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

6. Как изменить значок WordPress?

Просто загрузите новое изображение фавикона в корневой каталог вашего веб-сайта, а затем установите его в качестве значка сайта в разделе «Внешний вид» > «Настроить» > «Идентификация сайта» панели администратора WordPress.

7. Почему мой значок WordPress не отображается?

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