Что такое favicon и как его добавить на сайт

Faviconфавикон — favorites icon — иконка сайта в строке браузера, также иконка в избранном. У большинства сайтов он есть. Для фавикона обычно используется файл с расширением .ico и с размерами 16×16 32×32 48×48

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

Можно также в ручную указать в коде страницы, где лежит ваш favicon с помощью html-кода (нужно расположить внутри тега <head>), если у вас иконка в другом формате или вы не доверяете автоматизму браузеров.

<link rel=»icon» type=»image/png» href=»/nameicon.png» />

где вместо /nameicon.png вы впишите путь к своему файлу. Картинки могут использоваться не только формата ICO, но и PNG, GIF, Анимированный GIF, JPEG, APNG, SVG.  Самым стабильным остается конечно ICO, с этим форматом дружат все версии всех браузеров. Также, чтобы картинка была более качественная и четкая желательно использовать не расширение 16×16, а 32×32 или даже больше. Но не увлекайтесь, чтобы ваш фавикон не грузился дольше самого сайта.

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

Обсуждение: 4 комментария

  1. BlackSabbat:

    Мне кажется, такая картинка нужна каждому сайту

    Ответить
  2. А я добавил с помощью плагина 🙂

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

      На самом деле на данный момент даже код прописывать не обязательно. Все браузеры и поисковики видят файл favicon.ico в основной директории

      Ответить
      1. Люблю знаешь автоматизацию 🙂

        Ответить

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

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

Этот сайт использует Akismet для борьбы со спамом. Узнайте как обрабатываются ваши данные комментариев.

© 2020 Miroslavs.com ·  Дизайн и техподдержка: Goodwinpress.ru