Сдираем клеймо новичка! Или как создать и установить Favicon на Блогспот, чтобы за твой блог не было стыдно

LеV -
0
Как изменить стандартную иконку Blogger на свой фавикон.

Разбераемся что такое Favicon зачем он нужен на блоге и как установить на Blogger

Серьезно? Посмотри наверх, на вкладку своего браузера. Что ты там видишь? Если там до сих пор висит этот унылый оранжевый квадрат с буквой "B" - у меня плохие новости.

Ты кричишь всему интернету: "Эй, мне плевать на мой сайт! Это просто черновик!"

Читатели это чувствуют. Поисковики это видят. Это называется "кустарщина". А кустарщина не продает и не читается. Хочешь играть по-взрослому? Тогда давай прямо сейчас разберемся, как создать и установить Favicon на твой блог Блогспот, который превратит твою домашнюю страничку в нормальный медиа-ресурс.

Дел на 5 минут, а респект - вечный. Погнали!

Зачем тебе этот малепуський Favicon? (Аргумент для ленивых)

Ты спросишь: "Лев, да кому какая разница, какая там картинка 16 на 16 пикселей?"

Зачем нужен фавикон для сайта пример в браузере.
Найти сайт без иконки - тот еще квест. Выделяйся!

Огромная разница! Представь, что у твоего читателя открыто 20 вкладок (а так обычно и бывает).

  • Без фавикона: Твой сайт - это серый безликий лист. Его потеряют и закроют.
  • С фавиконом: Твой логотип маячит перед глазами. Это якорь. Это навигация. Это бренд.

Если у тебя нет своего лица, тебя никто не запомнит. Точка.

Забудь про форматы из каменного века

Раньше вебмастера страдали, конвертируя картинки в древний формат .ico. Забудь это как страшный сон. Наш "Динозавр" (Blogger) эволюционировал.

Всё, что тебе нужно знать про техническую часть:

  1. Формат: Обычный PNG на прозрачном фоне.
  2. Форма: Строго квадрат.
  3. Размер: Не мелочись. Делай 512x512 пикселей. Гугл сам сожмет как надо, зато на iPhone и крутых мониторах твой значок будет четким, а не превратится в мыльное пиксельное месиво.
Главное правило: Не пытайся впихнуть в иконку "Войну и мир" или сложный пейзаж. В размере спичечной головки это будет выглядеть как грязь на мониторе. Чем проще - тем круче. Первая буква названия или жирный, яркий символ. Всё.

Где взять иконку? (Рабочие инструменты)

Не умеешь рисовать? Нет Фотошопа? Не проблема. Нам нужен результат, а не диплом дизайнера. Вот подборка проверенных сервисов под разные задачи, которые помогут создать и установить Favicon без нервов:

📒 Если есть готовая картинка (Генераторы)

У тебя уже есть логотип или фото, и нужно просто превратить его в правильный файл для сайта? Используй это:

  • RealFaviconGenerator - Самый мощный. Создает идеальные иконки под все устройства (iOS, Android, Windows). Интерфейс на английском, но там одна кнопка: "Select your Favicon image". Справится даже ребенок.
  • PR-CY Генератор - Самый простой. Русский интерфейс. Загрузил картинку - получил архив. Ничего лишнего. (СОВЕТУЮ)

🎨 Если иконки нет (Готовые библиотеки)

Нужно найти красивый символ по теме блога (ракета, ноутбук, кот)? Не ищи в Google Картинках (там мусор), иди в проф. библиотеки:

  • Icons8 - Отличный поиск на русском языке. Главная фишка: можно перекрасить любую иконку в цвета твоего блога прямо перед скачиванием.
  • Flaticon - Самая большая база в мире. Миллионы вариантов. Качай в формате PNG (размер ставь 512px).

✏️ Если хочешь создать с нуля (Графические редакторы)

Хочешь нарисовать красивую букву на цветном фоне или сделать уникальный логотип? Paint - это прошлый век.

  • VistaCreate - Мощный графический редактор. Куча шаблонов, шрифтов и элементов. Выбирай формат "Логотип", твори, скачивай в PNG. Намного удобнее и быстрее Фотошопа.
  • Favicon.cc - Если нужна пиксельная графика (стиль 8-бит). Рисуешь по клеточкам прямо в браузере.

Бонус-уровень: Делаем "Трушный" ICO (Для перфекционистов)

Я уже говорил, что PNG работает отлично в 99% случаев. Но если ты старой закалки, или хочешь, чтобы твой фавикон гарантированно отображался даже в браузере Internet Explorer на компьютере твоей бабушки тогда конвертируй в .ico.

Это займет ровно одну минуту:

  1. Заходи на сайт ICO Converter (он старенький на вид, но работает как часы).
  2. Жми Choose File и грузи свой красивый PNG (тот самый, 512x512, который мы сделали выше).
  3. Ничего не меняй в настройках, просто жми кнопку Convert.
  4. Скачивай готовый файл favicon.ico.

Всё! Теперь у тебя есть файл, который поймет любой утюг с выходом в интернет.

Внедряем в "Динозавра" или как установить Favicon на Blogger: Финальный шаг

Картинка есть? Сохраненная? Красивая? Теперь самое вкусное инструкция, как создать и установить Favicon в недра Blogger.

  • Залетаешь в панель управления блогом.
    • Где находятся настройки фавикона в панели управления Blogger.
    Не заблудись: Настройки - Основное - Значок.
  • Жмешь Настройки (Settings).
  • Сразу сверху ищешь ссылку Значок (Favicon). Кликай!
    • Инструкция: Как загрузить файл favicon.ico в Blogger
    Окошко старое, но рабочее. Грузи картинку и жми Сохранить.
  • Откроется окно приветом из 2000-х. Не пугайся. Жми Выберите файл, грузи свой шедевр (PNG или ICO) и кнопку Сохранить.
⚠️ Эй, Лев! Я всё сделал, а там старая иконка! Без паники! Ты не сломал интернет. Браузеры - существа хитрые. Они кешируют (запоминают) старые картинки, чтобы не грузить их каждый раз заново.

Как проверить, что ты красавчик? Открой свой блог в режиме Инкогнито (Ctrl+Shift+N). Видишь новую иконку? Значит, всё работает! А в обычном браузере она обновится сама через пару часов.

Если не хочешь ждать очистите кэш браузера сочетанием Ctrl + F5. Перезагрузите страницу блога и убедитесь, что новый favicon появился во вкладке.

Итог: Хватит читать. Иди и сделай. Убери букву B. Сделай своему блогу лицо. Прямо сейчас!

🚀 Что делать дальше? Не останавливайся!

Ты убрал клеймо с вкладки браузера, но работы еще непочатый край. Чтобы твой блог окончательно перестал выглядеть как черновик, держи план действий:

Tags

Отправить комментарий

Новые Старые