
Власна іконка для сайту Favicon виглядає набагато привабливіше, допомагає користувачеві швидко знайти ваш сайт у вкладках, додає впізнаваність і персоналізацію бренду. Деякі браузери, такі як Яндекс, відображають іконку одразу біля пошукового сніпета в результатах видачі. Сайт з іконкою виглядає професійно, сама іконка повинна відповідати логотипу компанії або відображати тематику сайту.
У цьому посібнику ви дізнаєтеся кілька способів, як додати favicon на ваш сайт.
1. Які вимоги до розміру та формату іконки
Взяти будь-яку картинку, що сподобалася, і з ходу використовувати її як Favicon не вийде. Потрібно дотриматися двох нескладних вимог: вибрати відповідне розширення і розмір.
Рекомендовані формати зображень для іконки:
- .ico (.icns в macOS) - свого роду стандарт, використовується повсюдно.
- .png - сучасніший варіант, теж широко поширений і підтримується навіть у багатьох старих браузерах.
Чи можна використовувати й інші формати? наприклад, jpeg чи gif. Через особливості браузерів та різних ОС ми рекомендуємо вибирати ico. Найкращий канонічний формат, з яким точно не помилитеся.
Рекомендовані розміри для іконок:
- 16 на 16 px
- 32 на 32 px
- 192 на 192 px
- 512 на 512 px
2. Як і де створити іконку для сайту
Можливо, у вас вже є підготовлена іконка — тоді пропустіть цей розділ і переходьте до кроку 3. Якщо іконки у вас ще немає, ви можете самостійно створити її у зручному редакторі або скористатися одним із онлайн сервісів:
https://icons8.com - Відмінний сервіс з великим вибором іконок та зручним пошуком. Вам досить просто знайти іконку, що сподобалася, і скачати її.
https://iconsflow.com — на цьому сайті, крім великого вибору макетів, ви також можете відредагувати іконку: змінити її форму, додати фон, стиль відображення та ін.
3. Як додати іконку на сайт
Є кілька варіантів, щоб додати іконку на сайт.
Варіант 1 - Завантажити іконку у форматі favicon.ico у кореневий каталог сайту. Всі браузери автоматично розпізнають цей файл і відобразять зображення як іконку на вкладці. Файл потрібно завантажити в корінь сайту через файловий менеджер або FTP, формат файлу обов'язково має бути ico.
Варіант 2 - Вказати шлях до іконки в блоків шапки сайту. У цьому випадку можна використовувати файли різних форматів. Вам потрібно відкрити редактор коду сайту, знайти блоки всередині нього розмістити наступний код з посиланням на зображення іконки:
Варіант 3 - Скористайтеся стандартним завантажувачем CMS. Всі популярні платформи для розробки сайту WordPress, Joomla, Opencart вже мають вбудований функціонал для завантаження іконок. Вам достатньо відкрити налаштування сайту та завантажити іконку стандартним способом.
У цьому посібнику ви дізналися кілька способів, як швидко створити та додати іконку для вашого сайту. Правильно підібрана іконка додасть сайту більш привабливого вигляду і виділити його серед конкурентів.
