Маленький значок большого сайта

Пока делаешь сайт, пыхтишь, ищешь, читаешь, переделываешь – про фавикон вообще не думаешь. Просто не знаешь, что это такое.

А когда, наконец, браузер отображает твое творенье, тебе достаточно того, что ты видишь. Гордость и так распирает.

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

Задумались? Тогда это для вас!

Фавикон

Фавикон, Favicon, FAVorites ICON – «значок для избранного» – это маленькая картинка, значок, иконка, которая отображается в адресной строке браузера рядом с вашим адресом. Также ее видно в строке открытых вкладок и рядом с вашим сайтом в результатах поиска Яндекса.

Фавикон имеет размер 16х16 пикселей, файл в формате ico.

Где его взять?

Галереи

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

thefavicongallery.com, favicon.co.uk/gallery, blog.econsultant.com/favicon-gallery-index, favicon.fr

Вот несколько толстеньких галерей фавиконов.

Выбрали?

Вставляем

Теперь загружаем файл под именем favicon.ico в корневую папку вашего сайта с помощью FileZilla.

Дальше, открываем папку вашего скина или темы (у меня это wp-content\themes), находим файл header, открываем его и перед закрывающим тэгом </head> вставляем вот этот код:

<link rel=”icon” href=”http://ваш_сайт/favicon.ico” type=”image/x-icon”></link>

<link rel=”shortcut icon” href=”http://ваш_сайт/favicon.ico” type=”image/x-icon”></link>

«ваш_сайт» поменяйте на доменное имя вашего сайта )))

Сохраняем изменения, загружаем обратно на сервер и любуемся!

Красота!

Анимация

Для самых модных и гламурных есть анимированные фавиконы, их тоже можно выбрать в галереях. Тогда ваш код будет выглядеть таким образом:

<link rel=”icon” href=”/ваш_анимированный_GIF.gif” type=”image/gif”>

<link rel=”shortcut icon” href=”/ваш_анимированный_GIF.gif” type=”image/gif”>

Но! Помните о том, что фавиконовую анимацию поддерживают только браузеры Mozilla Firefox последних версий. Во всех других браузерах ваш фавикон будет статичным.

Самоделкин

Еще вариант для любителей эксклюзива.

Вы можете сделать себе фавикон сами, прорисовав каждый пиксель нужным цветом. Для этого существуют графические онлайн конструкторы фавиконов. Это очень здорово, так как ваш фавикон будет действительно только вашим и единственным и неповторимым. Уметь рисовать для этого вовсе не обязательно.

favicon.cc, favicon.ru, degraeve.com/favicon, genfavicon.com

Это несколько генераторов фавиконов. Пробуйте!

Нюансы

И еще один момент. При желании вы можете сделать отдельный фавикон для каждой страницы вашего сайта. Однако чтобы посетитель не терялся от изобилия разных картинок, их должен объединять общий стиль, а отличаться только деталями.

В таком случае HTML-код для каждого фавикона прописывайте в header каждой страницы, а не темы в целом.

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

Удачи!

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

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

Ваш электронный адрес не будет опубликован.


*