Сьогодні питання про те, як зробити favicon для сайту є одним з найпопулярніших серед початківців блогерів і власників сайтів. Фавикон – дуже важливий елемент будь-якого дизайну. Він являє собою невелике квадратне зображення з розміром 16х16 пікселів, яке використовується для закладки в різних Інтернет-браузерах. Таким чином, незважаючи на свої маленькі розміри, він виконує дуже важливу роль.

В даний час створені спеціальні онлайн-сервіси, що дозволяють швидко створити фавикон для сайту або блогу. Тому зробити його досить просто. До того ж є можливість просто завантажити вже готову міні-іконку ico для сайту, яку в подальшому необхідно завантажити на свій ресурс. Слід зазначити, що абсолютно неважливо який движок та хостинг ви використовуйте, адже встановити favicon можна скрізь.

Крім того фавикон використовується в якості логотипу для торгової компанії.

Таким чином, ви можете виділитися із загальної сірої маси. Відвідувачі дізнаються про ваш сайт, глянув лише на одне зображення favicon. Міні-картинка використовується також пошуковими системами. Вони висвічують їх зліва від результату видачі. Це дозволяє сайтів і блогів краще виглядати на тлі всіх існуючих проектів.

Виглядає фавикон в пошуковій видачі так:

Online сервіси і готові колекції favicon

Дізнавшись, що таке favicon для сайту і навіщо він потрібен, необхідно зрозуміти, як же його можна зробити?

Можна скористатися декількома способами:

  • скачати вже готовий міні-зображення з спеціальній галереї;
  • створити самостійно за допомогою генератора фавикон;
  • зробити іконку з готового зображення за допомогою favicon generator’а.

Скачати вже готовий міні-зображення з спеціальній галереї можна на наступних сайтах: thefavicongallery.com; iconj.com; favicon.co.uk або favicon-generator.org. На даних ресурсах представлена величезна кількість різних іконок, тому кожен зможе знайти ту, яка підійде йому більше всього.

Якщо ви не змогли знайти нічого підходящого, що малоймовірно, то можна зробити favicon на сайт з нуля самостійно. Слід зазначити, що створені вами зображення виглядають на проекті значно краще. Для цієї мети створені спеціальні Favicon Generators, які дозволяють нам створювати красиві міні-картинки в режимі реального часу.

«favicon.cc» є одним з найпопулярніших і простих сервісів, який дозволяє швидко впоратися з поставленим завданням. З його допомогою у вас є можливість самостійно намалювати кожен піксель вашої майбутньої фавіконки. Всього їх налічується 256.

Після переходу на сервіс у вас відкриється робоче вікно, де ви і будете експериментувати:

Створюємо favicon для сайту

Зеленим кольором на скріншоті, який розташований вище, показується ваша робоча область. Це місце призначене для створення самої іконки для блогу чи сайту. Нижче показується аналогічне зображення в зменшеному масштабі, що вказує дійсні розміри майбутньої фавіконки.

Після створення зображення його необхідно завантажити, активувавши спеціальну кнопку.

Принцип роботи заснований на тому, що вам потрібно самостійно зафарбувати кожен піксель (квадратик) своїм кольором. Вибирати колір можна за допомогою палітри, яка розташовується зліва від робочої області.
Робота даного сервісу настільки спрощена, що кожен зможе впоратися з поставленим завданням.

На даному ресурсі ви можете створювати безліч різних favicon в режимі реального часу.

Це один з багатьох онлайн-генераторів, який знаходиться у вільному доступі. Існує також безліч інших. Ось деякі з них: amichurin.appspot.com; favicon-generator.org/editor. Принцип їх роботи аналогічний наведеному прикладу.

Установка favicon на сайт

Створивши міні-іконку, залишається тільки відповісти на питання про те, як встановити іконки на сайт?

Перш за все, потрібно перевірити формат зображення. Він повинен бути тільки «.ico».

Для цього досить вставити ваш файл в «корінь» сайту або блогу. Як правило, папка називається «DOCUMENT ROOT». Після виконання цих дій павуки і браузери самостійно визначать нову інформацію про те, що з’явився новий файл favicon.ico.

Цей спосіб є найбільш простим, тому його дуже часто використовують для встановлення міні-зображення на свій ресурс.

ОСТАВЬТЕ ОТВЕТ

Please enter your comment!
Please enter your name here