Favicon ico готовые: Коллекция favicon.ico (фавикон) на Favicon.by

Что такое фавикон, зачем он нужен и как его создать

11 мин — время чтения

Янв 17, 2020

Поделиться

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

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

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

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

Что такое фавикон и где он используется

Фавикон (favicon) — это в дословном переводе с англ. «значок для избранного» (FAVoritesICON). Именно так называются закладки в браузере Internet Explorer, где впервые стали использоваться визуальные иконки для быстрого поиска нужного сайта. 

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

Где же можно увидеть фавикон?

1. На открытых вкладках перед названием сайта. Если вы не загрузили фавикон, у вашего сайта будет стандартный значок в виде черно-белой планеты.

2. В истории просмотров браузера.

3. На панели закладок.

4. В избранном, куда вы сохраняете все интересные страницы.

5. В мобильной и десктопной выдаче Google. Фавиконы на мобильных экранах появились еще весной 2019 года, а вот в десктопной выдаче — буквально в первые недели 2020 года.  

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

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

Краткая техинструкция по фавиконам

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

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

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

Раньше Internet Explorer поддерживал только этот формат, сегодня же практически все известные браузеры распознают иконки в PNG, некоторые — в GIF, JPEG, SVG. Исключение — Internet Explorer 10 и более ранние версии браузера, которые принимают только ICO-файлы.

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

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

Узнать, какие именно форматы фавиконов поддерживают разные браузеры, можно с помощью онлайн-сервиса Can I Use. Например, вы сможете увидеть, какие браузеры поддерживают или не поддерживают фавиконки в формате PNG и SVG.

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

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

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

Не так давно некоторые веб-мастера получили от Google письмо с рекомендацией увеличить разрешение фавикона до 192×192. 

В письме речь шла о том, что более качественные фавиконы могут принести в 2 раза больше кликов по новым вкладкам в Chrome и на главной странице Android. Согласитесь,  на расплывчатый фавикон вряд ли захотят кликать — значит, низкое разрешение иконки не вариант для хорошего пользовательского опыта.

Несколько общих правил, которых стоит придерживаться:

  • Использовать квадратный значок сайта.
  • Не использовать фавикон чужой компании или неприемлемого характера (например, свастика) — иначе поисковик будет отображать картинку по умолчанию – бесцветную планетку.
  • Фавикон должен быть доступным для сканирования поисковыми роботами.

Пять лет назад с релизом HTML5 появился атрибут sizes, который значительно облегчает работу с фавиконами. Этот атрибут нужно указывать в формате ширина х высота без единиц измерения (если их несколько, используйте пробел). Например:

<link rel="icon">
<link rel="icon">

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

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

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

Как этого избежать?

Способов создать фавикон для сайта несколько:

1. Сделать его в графическом редакторе, например, в Photoshop с помощью специального плагина Favicon.ico. 

2. Нарисовать фавикон в специальных онлайн-сервисах (например, Katvin или favicon.cc) и потом скачать его оттуда в уже подходящем формате.

3. Воспользоваться имеющимся у вас изображением (например, вашим логотипом) и загрузить его в онлайн-генератор фавиконов — например, Favicon.by, Realfavicongenerator.net и др.

4. Скачать готовые фавиконы для сайта из специальных банков иконок — например, галерея Findicons. Данная сборка насчитывает более 500 тысяч иконок. 

Когда вы скачаете сгенерированный фавикон, остается только добавить его на ваш сайт. 

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

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

После этого нужно просто вставить следующий код в мета-тег <head></head>:

<head>
  ...
  <link rel="icon" href="https://yoursite.ru/favicon.png" type="image/x-icon">
  <link rel="shortcut icon" href="https://yoursite.ru/favicon.png" type="image/x-icon">   ... </head>

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

Дизайн фавикона — когда проще не значит хуже

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

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

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

Можете ли вы в размере 16*16 четко сказать, что изображено на фавиконе? Постарайтесь, чтобы ваш фавикон не содержал мелких деталей, был хорошо различим и не пестрил всеми цветами радуги.

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

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

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

Как проверить фавикон и исправить основные ошибки

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

  • https://www.google.com/s2/favicons?domain=mysite.ru

Есть еще один вариант для проверки фавикона на разных устройствах — с помощью специальных сервисов, например, Realfavicongenerator. 

Если ваш фавикон не отображается в Google, начните с проверки таких моментов:

  1. Графическое изображение в формате ico, png или gif находится в корне ресурса?
  2. Код, ведущий к изображению, на страницах ресурса прописан правильно?
  3. Иконка не размытая и уникальная?
  4. Доступен ли файл с фавиконом для сканирования поисковых роботов?

Обратите внимание, что от пути к изображению напрямую зависит его отображение. Если хотите удалить или изменить фавикон, необходимо просто удалить или изменить файл favicon.ico (jpeg, gif, png).

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

Почему фавикон нужен каждому сайту

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

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

Если фавикон есть, а аудит его не видит — значит, проблема с индексацией или адресом иконки. Проверьте все еще раз. 

Наши англоязычные коллеги говорят: «Дьявол — в мелочах». И фавикон — та самая маленькая деталь, которая может влиять на восприятие вашего сайта и бренда, на их узнаваемость и даже количество переходов из поиска.  

Хороший фавикон — неотъемлемая часть бренда и технический стандарт каждого сайта, и точно стоит потраченного на него времени.   

3355 views

Как создать фавикон самостоятельно

30617 2

How-to – Читать 9 минут

Прочитать позже

ЧЕК-ЛИСТ: ТЕХНИЧЕСКАЯ ЧАСТЬ — ИСПРАВЛЕНИЕ

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

Содержание

  1. Что такое favicon для сайта
  2. Зачем нужен favicon
    — Технические требования к фавиконам
  3. Как создать favicon онлайн
  4. Как добавить фавикон на сайт
  5. Распространенные ошибки
  6. FAQ

Заключение

Что такое фавикон для сайта

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

Пример фавикона на сайте

А также в истории просмотров:

Фавиконы сайтов в истории браузера

В некоторых версиях браузера фавикон также появляется в адресной строке перед URL сайта. В выдаче Яндекса также отображаются фавиконы:

Фавиконы сайтов в Яндексе

Кроме логотипа, в фавикон для сайта иногда вставляют значок, символизирующий тематику ресурса, связанный с названием сайта, первую букву названия компании и т.п. Размер фавикона обычно составляет 32х32 или 16х16 пикселей.

Зачем нужен favicon

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

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

Пример сайта без фавикона

Следует установить фавикон и по другим причинам, обеспечивающим ряд других преимуществ:

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

Узнаваемость. Favicon — это удобный поиск. Когда пользователь ищет нужную ему вкладку в браузере, страницу из закладок браузера или истории, первое, что бросается в глаза, — это иконка. Никто не обращает внимания на текст. Представим, что вы что-то ищите, когда в браузере открыто 20 вкладок: кроме иконки не будет видно практически ничего.

Фавиконы сайтов во вкладках браузера

Продвижение. Это преимущество применимо только к поисковику Яндекс. Страница без фавикона в поисковой выдаче просто сливается с белым фоном и никак не выделяется среди остальных. В топе выдачи редко можно встретить страницу без иконки.

Сайт без фавикона в выдаче Яндекса

Проверка фавикона в аудите Serpstat

Хотите узнать, как найти и обезвредить ошибки на сайте с помощью Serpstat?

Заказывайте бесплатную персональную демонстрацию сервиса, и наши специалисты вам все расскажут! 😉

Оставить заявку!

Технические требования к фавиконам

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

Формат фавикона различается в зависимости от того, для чего он предназначен:

  • для устаревших браузеров: favicon.ico такого размера:16х16, 32×32;
  • для современных браузеров: один фавикон SVG формата для светлой и темной версии. Большинство браузеров поддерживают SVG формат, который более эффективен для больших изображений;
  • для устройств Apple: фавикон размера 180×180 в формате PNG;
  • для устройств Android: фавикон 192×192 в формате PNG, используемый на главной странице сайта и 512×512 — для загрузки прогрессивных WEB-приложений.

Узнать, какие именно браузеры поддерживают современные форматы фавиконов можно с помощью сервиса Caniuse:

Сервис Can I Use для проверки поддержки различных фавиконов браузерами

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

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

Все подобные сервисы предельно просты в использовании. Мы собрали несколько инструментов, с помощью которых вы быстро и бесплатно сделаете фавикон.

Pr-Cy.ru

Простой и понятный генератор: фавикон создается в два шага. Выбираем картинку на компьютере и превращаем ее в мини-логотип.

Be1.ru

Есть возможность задать разрешение картинки (16х16 или 32х32 пикселя). Просто выберите картинку и нажмите «Конвертировать».

Favicon.by

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

Logaster.ru

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

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

Генератор фавикона Pr-Cy.ru

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

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

Однако для надежности при любом разрешении картинки рекомендуется вручную прописать вывод фавикона в HTML-коде страницы. Для этого:

Добавьте файл favicon.ico в корневую папку — каталог сайта.

Пропишите в коде HTML favicon в формате ico.

Он выводится строкой shortcut icon:

<link href="http://ваш-сайт.ru/favicon.ico" type="image/x-icon"> 
<link rel="shortcut icon" href="http://ваш-сайт.ru/favicon.ico" type="image/x-icon">

Браузеры используют кэширование иконок, поэтому, если вам понадобится ее заменить, лучше поставить временный код:

<link rel="shortcut icon" href="http://www.yoursite.com/favicon.ico?v=2" />

Здесь значение v = 2 обозначает версию иконки. Увеличивайте его на единицу каждый раз, когда меняете картинку (v = 3, v = 4 и т.д.). Тогда браузер будет сразу отображать последнюю версию. После того, как вы определились с окончательным вариантом иконки, этот параметр можно смело удалять из кода.

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

Проверить, корректно ли работает фавикон в разных браузерах, можно используя онлайн-проверку для Яндекса и Google, доступную по указанным ниже ссылкам. Предварительно поменяйте «site.

com» на название своего ресурса:

  • Яндекс – https://favicon.yandex.net/favicon/site.com;
  • Google – https://www.google.com/s2/favicons?domain=site.com

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

    1. Отсутствует изображение фавикона в правильном формате в корневой папке сайта.
    2. Неправильно прописан код фавикона на страницах ресурса.
    3. Фавикон размыт или неуникален.
    4. Файл с иконкой закрыт для сканирования поисковиками.
    5. Сайт находится ниже 15 позиции в Яндекске — в этом случае фавикон не отображается.
    6. Фавикон был загружен недавно — иногда на его отображение в выдаче может потребоваться несколько недель.

    В каком формате сохранять favicon?

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

    Какого размера делать фавикон?

    Стандартный размер фавикона 16×16 и 32×32. Для современных браузеров и мобильных устройств используются более крупные изображения:180×180, 192×192, 512X512.

    Заключение

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

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

    «Список задач» — готовый to-do лист, который поможет вести учет
    о выполнении работ по конкретному проекту. Инструмент содержит готовые шаблоны с обширным списком параметров по развитию проекта, к которым также можно добавлять собственные пункты.

    Начать работу со «Списком задач»

    Serpstat — набор инструментов для поискового маркетинга!

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

    Набор инструментов для экономии времени на выполнение SEO-задач.

    Получить бесплатный доступ на 7 дней

    Оцените статью по 5-бальной шкале

    4.78 из 5 на основе 16 оценок

    Нашли ошибку? Выделите её и нажмите Ctrl + Enter, чтобы сообщить нам.

    Рекомендуемые статьи

    How-to

    Анастасия Сотула

    Что нужно знать об оптимизации сайта под голосовой поиск

    How-to

    Анастасия Сотула

    Как обновить версию протокола TLS на сайте

    How-to

    Анастасия Сотула

    Что такое крауд-ссылки и крауд-маркетинг

    Кейсы, лайфхаки, исследования и полезные статьи

    Не успеваешь следить за новостями? Не беда! Наш любимый редактор подберет материалы, которые точно помогут в работе. Только полезные статьи, реальные кейсы и новости Serpstat раз в неделю. Присоединяйся к уютному комьюнити 🙂

    Нажимая кнопку, ты соглашаешься с нашей политикой конфиденциальности.

    Поделитесь статьей с вашими друзьями

    Вы уверены?

    Спасибо, мы сохранили ваши новые настройки рассылок.

    Сообщить об ошибке

    Отменить

    html — Браузер не показывает favicon.ico, но он существует

    спросил

    Изменено 18 дней назад

    Просмотрено 47 тысяч раз

    Мой сайт http://example.com/en/ Я сделал для него фавикон. В голове у меня есть:

     
     

    Я вижу favicon.ico , используя URL-адрес http://example. com/favicon.ico

    Но ни один браузер не показывает его. Помоги пожалуйста.

    • HTML
    • Интернет
    • Фавикон

    2

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

     
     

    2

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

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

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

    2

    У меня была такая же проблема. Это мой тег фавикона:

     
     

    Не забудьте закрыть.

    Я почистил кеш браузера, но это не решило проблему.

    Я увидел свой значок сразу после перезапуска Chrome и Firefox. На мой взгляд, это странное жесткое кеширование браузера

    Вывод из остальных похожих постов

    Важно закрыть ВСЕ окна для браузера, с которым вы тестируете, и запустить его заново, чтобы увидеть изменения. (Не работает на Edge)

    Примечания в сторону

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

    Некоторые люди не могут избавиться от старого значка: Как очистить кеш значков браузера Chromium

    Другие хотели принудительно обновить: Как принудительно обновить фавикон

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

    1

    CTRL + F5 может помочь в некоторых случаях, поскольку принудительно перезагрузит все элементы на странице. Закрытие и открытие вкладки не всегда помогает.

    У меня была такая же проблема:

    фавикон существует (вы можете получить к нему доступ по его URL-адресу), но не отображается , независимо от того, нахожусь ли я локально (с WAMP) или на реальном веб-сервере.

    У меня был следующий код:

     
     

    Проблема заключалась в том, что я сделал некоторые

    echo и var_dump переменных PHP до того, как отобразился.

    После того, как я удалил все echo и var_dump фавикон сразу заработал как на локальном, так и на веб-сервере.

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

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

    попробуйте использовать только rel=»icon» в вашем rel… no rel=»shortcut icon»

    Строка кода Po Rith у меня сработала. Я добавил на задействованную php-страницу, избегая кавычек, чтобы разместить php, и это сработало отлично.

    echo ""

    стало

    echo ""

    Затем использовал Ctrl+F5 для обхода кеша и загрузки нового изображения… сработало сразу.

    Спасибо, DougieC

    Вы можете попробовать этот способ. У меня была такая же проблема.

     
     

    1

    Вы можете добавить «?» в конце «favicon. ico» в коде:

     
     

    2

    гугл хром — favicon.ico 404 (не найдено)

    спросил

    Изменено 3 месяца назад

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

    Chrome — вкладка исходного кода — я вижу в консоли следующее:

    GET http://localhost/favicon.ico 404 (не найдено)

    Внутри тега head у меня есть следующее:

     
     

    Нажмите на ссылку выше — откроется новая вкладка с изображением ico.

    Также пробовал — безуспешно:

     
     

    Нажмите на ссылку выше, говорит, что не существует.

    Также я заметил, что сообщение об ошибке появляется только при запуске и после нажатия Ctrl F5 , а после нажатия только F5 — оно исчезает.

    Так или иначе, значка на вкладке браузера нет в любом случае.

    Вкладка «На странице» — консоль пуста.

    Другие браузеры не тестировались.

    Итак, как правильно установить значок и как избежать сообщения выше?

    • google-chrome
    • favicon

    У меня были подобные проблемы с веб-серверами под управлением Linux. Иногда вам нужно установить бит выполнения на favicon.ico файл:

     chmod +rx favicon.ico
     

    Мне также пришлось дать разрешения службе/учетной записи веб-сервера на файл:

     sudo chown www-data:www-data /var/www/favicon.ico
     

    2

    Убедитесь, что ваш значок существует, перейдя по адресу http://localhost/ico/favicon.ico

    , а затем попробуйте Ctrl + F5, иногда кеширование может все испортить.

    7

    турецких лир; DR

    Что вам следует попробовать:

    • Протестируйте с помощью Firefox. Если это работает, у вас, вероятно, есть разметка body -only в головке .
    • Используйте абсолютный путь (например, /ico/favicon.ico )

    Пояснения

    Браузеры пытаются получить favicon.ico в корневой каталог по соглашению. Итак, эта строка в консоли разработчика означает, что , а не , ваш браузер не понимает ico/favicon.ico . Это скорее признак того, что разметка favicon не работает по какой-либо причине, поэтому ваш браузер использует «соглашение о корневой папке» в качестве запасного варианта.

    Использование абсолютного пути (например, /ico/favicon.ico вместо ico/favicon.ico ) может помочь вам точно определить проблему, особенно если ваша тестовая страница не / .

Оставить комментарий

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

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