Ну вот и у меня появился ОН — ФАВИКОН!
Вы еще не знаете, что это такое? Тогда вам обязательно нужно прочитать эту статью!
Еще пару недель назад и я на знала, что это.
Все началось с того, что меня привлекла одна маленькая картикна, которая находится в адресной строке перед URL. Я решила, что такая картинка необходима и моему блогу.
Как вы поняли, фавикон — это и есть та маленькая картинка. Вы ее можете увидеть:
-
1. В строке адреса в браузере
-
2. Во вкладке браузера
-
3. В избранном при создании закладки
-
4. В поисковой системе напротив названия вашего сайта
-
5. На рабочем столе при сохранении ярлыка для вашего сайта
Теперь, я думаю, вы поняли, что маленькая картинка играет далеко не последнюю роль в дизайне вашего сайта.
Такое интересное название «фавикон» пришло, как вы догадались, из английского. Это сокращение от FAVorites ICON.
Стандартный размер фавикона — это изображение 16*16 пикселей в формате ico.
Изначально, фавикон сайта использовался браузером только при создании закладки в избранном. А теперь — это неотъемлемая часть, можно сказать логотип, вашего сайта.
Очень важно, чтобы ваш логотип был ярким, запоминающимся и понятным.
Создание фавикона подобно искусству создания картины. Вам необходимо вложить в это крошечное изображение душу вашего сайта. Проявите ваше творчество, изобретательность, и обязательно не забудьте добавить небольшую изюминку.
Я придерживаюсь мнения, что фавикон должен быть незамысловатым рисунком. Можно, конечно, постараться и втиснуть в эти рамки настоящее произведение искусства. Здесь главное, чтобы рисунок можно было легко воспринять и найти среди десятков других фавиконов.
Теперь посмотрим на созданию фавикона. Для этого существует множество сервисов, которые позволяют создать изображение и сохранить его на компьютер. Обычно такой файл называется favicon.ico.
Приведу вам два сервиса, которые использовала я.
-
— позволяет попиксельно сделать фавикон. Можно загрузить изображение и сделать из него фавикон. Кроме этого можно использовать открытую галерею фавиконов. Выбрав из нее картинку, вы можете подправить ее в редакторе по своему желанию. А затем сохранить фавикон у себя на компьютере.
-
— русский сервис, который позволяет загрузить изображение с компьютера или интернета и преобразовать его в картинку размера 16*16 пикселей. При этом вы можете создать дополнительные изображения для сохранения на рабочем столе (они сохраняются внутри файла favicon.ico, но имеют больший размер) .
Итак, 16-пиксельный образ сайта мы создали, теперь время прикрутить его к нашему сайту.
Для этого файл favicon.ico вам нужно скопировать в корневую папку вашего сайта.
Теперь остается написать путь к вашей картинке. Для этого в области между тегами <head> и </head> запишем следующий код:
<link rel="icon" href="/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="/favicon.ico"
type="image/x-icon">
Если у вас стоит WordPress, то добавляем этот тег в файл header.php (Внешний вид -> Редактор).
На этом все 
У вашего сайта теперь есть свой favicon. Поздравляю!
И еще несколько советов.
-
Когда вы создаете картинку, создайте несколько вариантов, посмотрите в галерее фавиконов, обратите внимание на фавиконы в вашем Избранном. Пусть у вас будет выбор. Не застревайте на одном, ищите наиболее подходящий вам.
-
Возможно использование анимированных фавиконов. Однако они воспринимаются не всеми браузерами.
-
Помните, что «вес» изображения играет важную роль при загрузке вашего сайта. Не создавайте «тяжелых» фавиконов.
-
Если вы сохранили новый фавикон, но в браузере отображается старый вариант, то вам просто нужно перезагрузить браузер. Когда вы вновь войдете, в кеш попадет уже новое изображение, которое вы и увидите на мониторе.
-
Ну а если вы серьезно к этому относитесь, то можете заказать создание фавикона профессионалам.
Еще советую почитать по этой теме:
Об авторе блога "Работа для Мамы: создаем блог - строим успешный интернет-бизнес"
Рубрики: 
Теги: 
Как создать иконку это я уже разобрался, спасибо, а как вы ее в вордперессе Установили, куда код нужно прописывать ? Или иконку можно залить в любое место сайта а потом в header-е сделать тег на нее?
Максим, спасибо за вопрос.
Совсем забыла уточнить, если файл с картинкой лежит не в корневом каталоге, то в header-е прописывается следующее:
<link rel="icon" href="/" type="image/x-icon"><link rel="shortcut icon" href="/" type="image/x-icon">
А мне муж все сам сделал и дизайн и фавикон
))
Хорошо, когда муж помогает
Мой муж помогает мне тем, что водится с дочкой
У меня всей технической стороной блога занимается мой хороший знакомый. А вашему мужу — похвала — помогать с дочкой это тоже работа!
Техническая сторона у меня пока занимает самое большое количество времени. Пишу я где-то 10% от всего времени, которое могу уделить блогу. Хочется уже быстрее разобраться и заняться делом
А муж у меня действительно молодец! После работы находит силы поиграть с дочкой. Без его поддержки у меня ничего бы не получилось.
Мой словарный запас пополнился еще одним словом!
Что самое интересное — я год просила, чтобы для нашего сайта сделали "Ну маленькую картиночку, которая будет появляться в поисковике на против нашейго названия... и т.д и т.п. " это так я объясняла ребятам, которые продвигали сайт — они меня так и не поняли О_о пока не показала.
Я знала о существовании такой «картиночки», но не знала как она называется!
Значит я не зря про фавикон написала
Очень странно, что значок для твоего сайта сразу не сделали. Думаю, что сейчас это уже обязательный элемент. Может быть за отдельную плату хотели создать...
Возможно. А может просто не хотели заморачиваться — тож студенты были, им, как оказалось, главное сиюминутная выгода, а не долговременное сотрудничество.
Наталья, спасибо, что рассказали, что такое фавикон. Я такое слово слышу впервые. Теперь буду знать.
Да, фавикон — нужная вещь для сайта! Раньше у меня был другой, а сейчас моя маленькая фотка. Мне нравится !
ура я тоже сделала себе фавикон
. спасибо Наталья за подсказку.
Больше спасибо, я после праздников обязательно себе сделаю на блог.
Вот еще один вариант установки фавикона для вордпрессовских блогов. Вычитала на одном сайте:"Для того, чтобы установить favicon на свой сайт на движке WordPress, нужно favicon.ico положить в папку img темы сайта и в header.php написать:
<link rel=”icon” href=”/img/favicon.ico” />
<link rel=”shortcut icon” href=”/img/favicon.ico” />"
Спасибо, Наталья, узнала очень полезную информацию. В свободное время обязательно сделаю фавикон для для своего блога.
Twitter: Julia Chirkova
Мне тоже нужен Фавикон!!!
Надо заняться его созданием.
Наталья,спасибо !Теперь у моего сайта есть свой фавикон
Отлично! Рада, что информация пригодилась!
Спасибо за науку. ТОлько можете пояснить, как вставить иконку в корневую папку сайта?
Alfiya, через панель управления хостингом или через фтп. Обычно корневая папка называется public_html