Favicon.ico — це файл-іконка, яку браузер відображає поруч із назвою сайту у вкладках, у закладках та в історії перегляду. Якщо ви хочете зробити свій сайт впізнаваним, варто додати favicon.
Ось покрокова інструкція, як завантажити favicon.ico і підключити його до сайту.
1. Створіть favicon.ico
Є кілька безкоштовних онлайн-сервісів:
- https://favicon.io
- https://realfavicongenerator.net
- https://www.favicon-generator.org
Як це працює:
- Завантажте своє зображення (рекомендовано квадратне, 512×512 або 256×256 px).
- Сервіс автоматично згенерує файл favicon.ico.
- Завантажте архів або окремий файл .ico.
2. Куди зберігати favicon.ico
Збережіть файл favicon.ico у кореневій директорії вашого сайту.
Це дозволяє браузерам автоматично знаходити його за адресою:
https://ваш_сайт.com/favicon.ico
3. Як підключити favicon.ico на сайті
У файлі index.html (або в <head> шаблону сайту) додайте цей рядок:
<linkrel=”icon”href=”/favicon.ico”type=”image/x-icon”>
Або для кращої сумісності:
<linkrel=”shortcut icon”href=”/favicon.ico”type=”image/x-icon”>
4. Перевірте, чи працює
- Очистіть кеш браузера (або відкрийте сайт в режимі інкогніто).
- Зайдіть на сайт — favicon має з’явитись у вкладці.
- Якщо не видно — перевірте, чи збережено файл у правильному місці, і чи правильно прописано шлях у HTML.
Поради
- Файл .ico може містити одразу кілька розмірів (16×16, 32×32 тощо).
- Якщо ваш сайт підтримує PWA або мобільні іконки — краще згенерувати повний набір фавіконів через RealFaviconGenerator.
Найцікавіше з нашого блогу:
Корисні посилання
