ЯК зробити значок для сайту

Значок для сайту, або, як його частіше називають, іконка - це те, що можна побачити в куточку біля назви вкладки в браузері. Також значок відбивається навпроти назви сайту в списку «Вибране», ще його можна побачити, коли пошукова система показує ваш сайт у видачі.

Вам знадобиться

- логотип сайту,
- Photoshop,
- favicon-конвертер.

Інструкція

Відкрийте логотип вашого сайту в програмі Adobe Photoshop. Якщо логотипу немає, можна взяти будь-яку іншу картинку, важливо лише, щоб вона асоціювалася з вашим сайтом. Обробіть зображення, прибравши всі зайві деталі, а тепер зменшите його розмір до 32 або 16 пікселів по кожній стороні. Потім збережіть зображення як графічний файл у форматі png або gif.

Краще всього, якщо ви створите в підсумку файл з дозволом 32х32 пікселя, так як користувачі іноді зберігають ярлики вподобаних сайтів на «Робочому столі», а там картинки 16х16 пікселів виглядають недостатньо деталізованими. Тим не менш, майте на увазі, що в браузері ваша іконка все одно буде приведена до розміру 16х16 пікселів, саме такі картинки відображаються в «обраних» і в заголовку.

Тепер потрібно перетворити картинку в ico-файл. Зробити це можна за допомогою будь-якого плагіна для Photoshop або, скориставшись безкоштовним інтернет-сервісом, наприклад, https://favicon.ru/. І плагінів, і сервісів існує величезна безліч, працюють вони практично однаково, так що радити якийсь конкретний немає сенсу. Такі сайти називаються favicon-генераторами.

Отриманий в результаті файл перейменуйте, щоб його ім`я було favicon.ico.

Тепер зайдіть в панель управління вашим сайтом і знайдіть кореневу директорію, де лежить перша сторінка. Зазвичай це index.html або інший файл, який генерує система управління контентом. Там вже може лежати іконка з ім`ям favicon.ico. У цьому випадку видаліть стару іконку і помістіть замість неї свою.

Якщо коренева директорія вам недоступна, а також у тих випадках, якщо код для сайту ви писали самі, то потрібно відредагувати всі сторінки сайту, на яких повинна з`явитися іконка. Відкрийте сторінку в редакторі і в розділі head додайте запис

Якщо іконка розташовується не в кореневій директорії, а де-небудь ще, то в параметр href пропишіть повний шлях файлу.