Як Додати Favicon для Сайту
- Вступ Більшість сайтів мають свої особливі логотипи і в більшості випадків вони використовуються,...
- Варіант 1 - Дозволити браузеру автоматично додати favicon (немає необхідності в зміні коду сайту)
- Варіант 2 - Використовувати звичайну картинку і вказати її в коді сайту
- висновок
Вступ
Більшість сайтів мають свої особливі логотипи і в більшості випадків вони використовуються, як favicons (іконки). Якщо ви не знаєте, що таке favicon, ось візуальний приклад однієї з таких: 
Мати свою favicon на сайті набагато краще, ніж стандартну іконку порожнього документа в браузері, до того ж, ваш сайт буде виглядати набагато професійніше. У цьому керівництві ви дізнаєтеся кілька способів, як додати favicon на ваш сайт.
Що вам знадобиться
Перед тим, як ви почнете це керівництво, вам знадобиться наступне:
- Квадратне зображення, яке ви хочете додати, як favicon для вашого сайту
- Доступ до файлів вашого сайту
Варіант 1 - Дозволити браузеру автоматично додати favicon (немає необхідності в зміні коду сайту)
Більшість браузерів автоматично знаходять файл favicon.ico в каталозі вашого сайту і встановлюють його в якості favicon. Це найлегший шлях для додавання favicon.
- По-перше, щоб зображення нормально відображалося в браузері, воно повинно бути квадратної форми в будь-якому з представлених форматів (jpg, bmp, gif, png). Звичайно, можливо використання не квадратного зображення, але виглядати воно буде не так акуратно.
- Цей варіант додавання favicon вимагає конвертації вашого зображення в формат .ico. В Інтернеті можна знайти безліч онлайн інструментів для цього, ми скористаємося одним з найпопулярніших - convertico.com .
- Після відкриття сайту convertico.com , Ви побачите кнопку для вибору і завантаження вашого зображення:
- Натисніть кнопку і виберіть потрібний вам файл. Відразу після вибору, ваше зображення буде автоматично конвертовано та стане доступним для завантаження в правій частині сайту:
- Скачайте ваше зображення натиснувши на білу стрілку і збережіть ваш файл .ico на комп'ютері.
- Тепер перейменуйте файл в favicon.ico, щоб браузер міг розпізнати даний файл.
- Останнім етапом стане завантаження зображення в каталог вашого сайту. Для завантаження ви можете використовувати Файловий менеджер або FTP клієнт . У хостингах на базі Linux, це зазвичай каталог public_html. Однак він може відрізнятися у різних хостингів, або в зв'язку з вашими власними настройками. В такому випадку краще проконсультуватися у постачальник послуг хостингу.
Як тільки отриманий файл favicon.ico буде завантажений в каталог вашого сайту, браузери автоматично додадуть і покажуть зображення.
ВАЖЛИВО! Якщо ви не бачите новий favicon, очистіть кеш вашого браузера і перезапустіть його.
Варіант 2 - Використовувати звичайну картинку і вказати її в коді сайту
Якщо ви думаєте, що конвертація зображення це не для вас. Ви можете використовувати звичайне зображення в якості favicon для вашого сайту.
- По-перше, щоб зображення нормально відображалося в браузері, воно повинно бути квадратної форми в будь-якому з представлених форматів (jpg, bmp, gif, png). Звичайно, можливо використання не квадратного зображення, але виглядати воно буде не так акуратно.
- Завантажте зображення в каталог вашого сайту. Для завантаження ви можете використовувати Файловий менеджер або FTP-клієнт . У хостингах на базі Linux, це зазвичай каталог public_html. Однак він може відрізнятися у різних хостингів або в зв'язку з вашими власними настройками. В такому випадку краще проконсультуватися у постачальник послуг хостингу.
- Тепер вам необхідно визначити зображення, яке буде використовуватися в якості favicon в коді вашого сайту. Додайте цей рядок між тегами <head> </ head> в код вашого сайту:
<Link rel = "shortcut icon" type = "image / png" href = "/ favicon.png" />
ВАЖЛИВО! Змініть png на формат вашого зображення в type = "image / png" і favicon.png на ім'я вашого зображення.
HTML код буде виглядати приблизно так:
Тепер ваше зображення має відображатися в якості favicon для вашого сайту.
ВАЖЛИВО! Якщо ви не бачите новий favicon, очистіть кеш вашого браузера і перезапустіть його.
висновок
У цьому керівництві ви дізналися 2 способи, як додати favicon для вашого сайту. Можливо це не настільки складне завдання при створенні вашого сайту, але вона дозволить йому мати більш привабливий вигляд.
