Создание фавикона для сайта.

5 минут на чтение

создание фавиконаВ этой статье мы разберемся, что такое фавикон, узнаем про создание фавикона и как установить его на свой блог.
Здравствуйте, уважаемые друзья.

Что такое создание фавикона.

Дословный перевод фавикона – это избранная иконка или символ. Когда вы заходите на Яндекс, то вы видите, что напротив сайта есть маленькая иконка или рисунок. Она очень маленькая, всего 16 пикселей. Вот эта картинка и называется фавиконом.

 Практически у каждого сайта есть свой символ – фавикон. Он делает ваш сайт узнаваемым. Любой посетитель побывав у вас на сайте может запомнить ваш фавикон. И увидев его в поисковике может снова зайти на ваш сайт, если ему были интересны ваши статьи.

Для чего нужен фавикон.

В гугле раньше тоже были картинки, но сейчас их убрали. И зайдя в гугл там уже труднее искать нужную вам статью. По этой причине, чтобы у вас блог был авторитетным и люди его узнавали нужно обязательно поставить свой фавикон. Так что обязательно нужно поставить фавикон, это дело нужное для блога.

Какие бывают фавиконы.

Фавиконы бывают в виде своей фотографии. Но такие фавиконы плохо смотрятся. Потому что, если сделать фотографию 16 на 16, то она очень мелкая и вы ничего не увидите.

По сути фавикон – это обычная картинка, которую вы можете приспособить под себя. Или создать индивидуальную, которая будет только у вас. Если взять картинку из интернета, то она обязательно уже есть у кого – то. И не совсем хорошо, когда будут одинаковые картинки и люди будут путаться.

Как создать фавикон.

Картинки бывают разными: 32 на 32, 24 на 24 и 16 на 16. А Яндекс показывает только картинки 16 на 16. Вот такие мы и будем делать. Формат изображения представлен в «ico».

Какие есть варианты установки фавикона? Вариантов три:

1. Встроенная возможность с админ панели вашего блога. Все современные темы имеют такую возможность закачать картинку себе в библиотеку и автоматически получаете фавикон.

2.  Установка фавикона с помощью плагина Favicons.

3. Вы можете установить фавикон в корневую папку вашего сайта с помощью кода.

Установка плагине не желательна, так как любой плагин грузит блог. И там только стандартные фавиконы, а нам нужен свой. Также вы можете поставить первым способом, через тему. Но мы будем устанавливать в корневую папку блога.

И как установить фавикон.

И как установить фавикон в корневую папку вашего сайта с помощью кода мы сейчас разберемся. Переходим в сервис //favicon-denerator.org Мы попадем на страничку сервиса.

2 способа фавикона
Здесь вы можете создать фавикон несколькими способами.

1 Вариант: нажимаем «обзор» или «выберите файл» и загружаете изображение с компьютера. Ставите галочку только 16 на 16. Нажимаете «Greate Favikon», на фото под номером 1.

2 Вариант: мы можем его сделать в редакторе, на фото под номером 2.

3 Вариант: мы можем сделать его в онлайн редакторе, на фото под номером 3.

3 способ фавикона

Так же вы можете выбрать из галереи, которая находится внизу. Нажимаете на любой цвет и вам предлагается большое количество фавиконов по цветовой гамме, по буквам. Вы можете его тут же редактировать и скачать на компьютер. Расширение у него «ico».

 

Но мы библиотекой пользоваться не будем. А вы посмотрите, может вам что-то подойдет здесь.

Создание фавикона.

Мы будем создавать 2 способом. Ставим точку на «Генерируйте только 16×16 favicon.ico». Идем в «favicon.ico Editor». И попадаем в графический редактор. Вы сами решаете, что вам подходит по теме и чтобы гармонировал с вашим сайтом.

галерея фавиконов

Слева у вас есть панель управления и там вы выбираете нужные инструменты для изготовления фавикона. Заливаем символы по квадратикам и получаем свой рисунок. Ступеньки все сгладятся и их не будет видно.

Когда вы все закончили, нажимаем кнопочку «Greate Favikon». Затем «Downloed» и указывает куда сохранить. Можем проверить его на сохранение в компьютере.

Теперь снова возвращаемся в генератор и нам надо получить код. Любым способом, которым мы делали фавикон, мы его сохраняем на компьютер. Вы можете сделать любым способом и несколько штук и выбрать из них наилучший.

Теперь спускаемся ниже и там есть в окошечке код, копируем его. Я вставлю код ниже, вам проще копировать его здесь.

Идем в админ панель — «консоль», «внешний вид», «темы», «настроить», «свойства сайта», «иконка сайта». Читаем «значки сайта должны быть квадратными и как минимум размером в 512 × 512 пикселов». И когда картинка загрузится, то размер её будет 16 на 16.

А мы сделаем гораздо проще и закачаем сразу в корень блога. Идем на свой хостинг и закачиваем картинку фавикона в папку images под названием favicon.ico.
В скопированном коде убираем — wp-content/themes/zeestyle/images/, вместо — biz-iskun.ru – вставляем название своего сайта.

Снова идем в админ панель — «консоль», «внешний вид», «редактор тем», справа ищем «заголовок». Находим закрывающий тег и перед ним делаем пробел и вставляем код. Нажимаем «обновить сайт» и идем на сайт, обновляем страничку и видим появился наш фавикон.

вставка кода

В поисковых системах наш фавикон появиться через неделю, когда наш сайт про индексируется.

Подведем итоги.
Вот так можно создать фавикон тремя способами, если разобраться, то это легко и просто все делается.
Мы уже рассматривали на страницах моего блога «Что такое граватар» и «Карту сайта». Также можете прочитать «Какие виды заработка есть в интернете».

Успехов вам!

Facebook Vk Ok LinkedIn Telegram Whatsapp

Похожие записи:

Сегодня мы с вами разберем, что такое создание и установка счетчика Яндекс Метрика, создание целей в Яндекс Метрике. Как их использовать и как в дальнейшем они нам помогают в работе с нашим блогом. Здравствуйте, друзья! Что такое Яндекс Метрика. Яндекс Метрика — бесплатны...
Что такое карта сайта и для чего она нужна на блоге. Здравствуйте, уважаемые читатели моего блога. Сегодня мы рассмотрим что такое карта блога. На блоге их должно быть две: одна для роботов, а другая для людей. Сегодня мы поговорим о карте для людей.   Что такое карта сай...
Здравствуйте друзья! Сохранение копии сайта или бэкап на компьютере, с хостинга HostLand и для чего она нужна, рассмотрим в этой статье. Что такое бэкап? Резервное копирование (англ. backup) — процесс создания копии данных, предназначенном для восстановления, в случае их поврежден...