Как установить favicon в HTML-код

Чтобы установить favicon в HTML-код, выполните следующие шаги:

  1. Создайте и подготовьте иконку favicon. Иконка favicon должна быть квадратной и иметь формат .ico, .png или .gif. Рекомендуемый размер иконки составляет 16×16 пикселей или 32×32 пикселя.
  2. Сохраните иконку favicon в корневой папке вашего веб-сайта. Обычно это папка, где находится ваш файл index.html или другой основной файл вашего сайта.
  3. Вставьте следующий код внутри тега <head> вашего HTML-документа:
				
					<link rel="icon" href="название_иконки.ico" type="image/x-icon">
				
			

 

  1. Сохраните HTML-файл с внесенными изменениями.
  2. Загрузите ваш HTML-файл на веб-сервер и проверьте результат. Иконка favicon должна отображаться во вкладке браузера рядом с названием вашего сайта.

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

Читайте также: Как установить favicon на сайт? (WordPress)

АтрибутОписание Возможные значения
relТип ресурсаicon;
shortcut icon
href Адрес файлаДля описания кириллического адреса фавиконки используйте Punycode. Например для адреса https://мой-сайт.рф/favicon.ico нужно указать https://xn----8sbzclmxk.xn--p1ai/favicon.ico.
typeТип передаваемых данных. Зависит от формата файла image/svg+xml — для формата SVG;
image/x-icon или image/vnd.microsoft.icon — для формата ICO;
image/gif — для формата GIF;
image/jpeg — для формата JPEG;
image/png — для формата PNG;
image/bmp — для формата BMP.
Типы сайтов

Веб-сайты могут быть разных типов в зависимости от своей функциональности

Читать далее