Что такое фавиконы?

Сегодня вкратце о фавиконах, для чего они нужны?

Фавикон (произносится как «fave-icon») — это небольшое иконическое изображение, представляющее ваш сайт. Фавиконы чаще всего встречаются в адресной строке вашего веб-браузера, но их также можно использовать в списках закладок в веб-браузерах и агрегаторах каналов.

Что такое фавиконы?

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

Какой тип изображения является значком?

Хотя большинство современных браузеров распознают форматы PNG, GIF и JPG для фавиконов, в настоящее время Internet Explorer этого не делает. Рекомендуется использовать формат Microsoft ICO, который работает во всех браузерах.

Какого размера должен быть мой значок?

Другая хорошая причина использовать формат ICO состоит в том, что он может содержать несколько значков разных размеров в одном файле ICO. Лучше всего иметь как минимум версию 16×16 пикселей. Я обычно также включаю 32×32 и 48×48 версии. Таким образом, если пользователи перетаскивают закладку на рабочий стол, они видят хорошо масштабированную версию иконки вместо растянутой версии 16×16. Чтобы узнать, как создать значок нескольких размеров, см. Раздел «Как создать значок» ниже.

Ниже: 16×16, 32×32 и 48×48 версии значка сайта Beautiful Site. Каждое изображение встроено в один файл favicon.ico.

Фавикон в нескольких размерах

Наиболее распространенные размеры фавиконов:

  • 16×16
  • 32х32
  • 48×48
  • 64×64
  • 128х128

Как создать иконку

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

Как сделать ссылку на ваш значок

Теперь, когда вы создали симпатичный небольшой значок, вам нужно сообщить веб-браузерам и другим приложениям, где его найти. Добавление этой строки в раздел <head> вашего HTML гарантирует, что ваш значок будет найден:

<link rel = «ярлык» href = «/ favicon.ico» type = «image / x-icon» />

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

Если вы добавите значок избранного без ссылки на него в своем HTML-коде, вы можете заметить, что некоторые браузеры все равно найдут и отобразят его. Это происходит только в том случае, если значок находится в корневом каталоге. Не стоит полагаться на этот метод, поэтому, если вы хотите, чтобы приложения видели ваш значок, <ссылка> на него!

Наши работы

Контакты