Як додати Favicon

Як додати Favicon

Favicon (Favorite Icon) — це квадратна іконка зі стороною в 16 піксел, яку браузер відвідувача сторінки сайту відображає в адресному рядку. Якщо сторінку додати до вибраного, то картинка буде відображатися і там. Крім того, favicon присутній у пошуковому списку сайтів Яндекса. Все це в комплексі може бути дуже корисно для залучення уваги до сайту.

Інструкція

  1. Створіть іконку, посилання на яку треба буде помістити в сторінки сайту. Для цього підійде будь-який графічний редактор. Використовуйте розмір 16 на 16 піксель — деякі браузери можуть працювати і з іконками великих розмірів, але краще все ж охопити по можливості найбільше число веб-серферів.
  2. Збережіть підготовлене зображення у форматі ico. Сучасні браузери зможуть зрозуміти favicon у файлах з розширенням gif, png, bmp і т.д., але для охоплення максимальної кількості модифікацій браузерів краще використовувати рідну формат іконок цього типу. Якщо ваш графічний редактор не підтримує формат ico, то можна зберегти його, наприклад, у форматі gif, а потім конвертувати в ico за допомогою якого-небудь з онлайн-сервісів. У мережі можна знайти і сервіси, які запропонують вам повний цикл створення іконки в режимі онлайн безпосередньо в браузері.
  3. Завантажте іконку на сервер вашого сайту і збережіть у файл з ім’ям favicon.ico — це ім’я все модифікації браузерів розуміють однаково, хоча деяким з них назва не важливо. Якщо в коді сторінки немає вказівки адреси цього файлу, то браузери і пошукові роботи за замовчуванням шукають її в кореневій папці сайту, тому краще всього помістити файл саме туди.
  4. Вставте в вихідний код сторінок HTML-теги з вказівкою на долучення. Для Internet Explorer цей тег повинен виглядати так:

    <link rel=»icon» type=»image/vnd.microsoft.icon» href=»favicon.ico»>

    Для інших браузерів його слід писати інакше:

    <link rel=»shortcut icon» type=»image/x-icon» href=»favicon.ico»>

    Додайте обидва рядки, щоб забезпечити кросбраузерність. Якщо файл був поміщений не в кореневу папку, то в атрибуті href вкажіть повний шлях до місця його розміщення. Вставити ці рядки слід у заголовну частину веб-документа, тобто між тегами <head> і </ head>.