Как создать фавикон (favicon.ico)

как создать favicon

Добрый день! В данной статье я хочу рассказать вам о том, для чего нужна иконка favicon и как создать иконку
фавикон. Данная иконка имеется практически на всех сайтах, фавикон имеет размер от 16×16 до 32×32 пикселей. Как вы поняли, она совсем маленькая.

Фавикон выглядит примерно вот так:

как сделать фавикон

В моем случае фавикон моего сайта содержит 2 буквы (М) — они означают мои инициалы, иконку я делал сам, в
ручную.

Вы можете скачать готовую иконку в интернете и изменить её под нужные размеры. Делается всё это очень легко!

Как сделать фавикон (favicon)?

Для иконки favicon можно использовать любую картинку, которую сможете найти. Иконки можно найти в поисковых
системах, но я предпочитаю тематические сайты, вот вам ссылки где вы сможете скачать иконки:

http://findicons.com
http://iconfinder.com
http://iconarchive.com

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

После того как вы скачали картинку, вам нужно оптимизировать её под нужные размеры и формат. Делается всё это гораздо проще, чем вы думаете.
Для этого переходим по ссылки: http://www.cy-pr.com/tools/favicon/, выбираем изображение и задаем размер для иконки 16×16 или 32×32 пикселя, далее жмем на кнопку «Конвертировать».
После конвертации скачайте готовую иконку и загрузите её в корень сайта.

Будьте внимательны! Иконка должна иметь название favicon и формат .ico (favicon.ico).

После того как загрузили иконку в корневую папку сайта, нужно открыть код верхней части сайта, если у вас стоит
wordpress, то открываем header.php, между тегами ставим код:

< link href="ссылка на иконку" rel="icon" type="ссылка на иконку" / >

После того как вы всё сделали, можете полюбоваться иконкой на своем сайте! Если иконка сразу не изменилась, то подождите некоторое время или почистите кэш браузера и обновите страницу своего сайта 🙂

Надеюсь вам была полезна эта статья, если у вас возникли какие-либо вопросы пишите их в комментарии!

Понравилась статья? Поделитесь с другими!



Получайте новые материалы себе на почту!

  • Asadbek [ 7 мая 2016 в 16:43 ]

    Классная информация, теперь можете написать стать о том, как поменять шапку (header) на WordPress

Добавить комментарий