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

22.03.20

Favicon - значок веб-страницы. Самый простой способ добавления его на страницу - это положить иконку c название favicon.ico размером 16х16 пикселей в корень сайта. Или же задать путь с помощью записи в секции <head> в одну строку

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

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

  • стандартный .ico 16x16
  • для современных браузеров .png 32x32
  • для apple .png 180x180
<link rel="apple-touch-icon" sizes="180x180" href="/images/favicons/apple-touch-icon-180x180.png">
<link rel="icon" type="image/png" sizes="32x32" href="/images/favicons/favicon-32x32.png">
<link rel="shortcut icon" href="/images/favicons/favicon.ico">

Код необходимо вставить между тегами <head>

Сервис для генерации favicon: https://realfavicongenerator.net/

blog comments powered by Disqus