Как сделать иконку сайта (favicon)

Опубликовано: 10.03.2008

Проще всего поступить следующим образом: создать при помощи СПЕЦИАЛЬНОЙ программы значок размером 16х16, назвать его favicon.ico и поместить в корневую директорию сайта (т.е. чтобы она находилась по адресу http://ваш-сайт/favicon.ico). Однако это будет работать не во всех браузерах. Тогда в коде страниц между тэгами <head></head> нужно написать следующее: <link rel=”shortcut icon” href=”адрес иконки” type=”image/x-icon”> . В этом случае файл иконки можно назвать любым именем и располагаться он может по любому адресу URL (даже на другом сервере).

P.S. статья со старого сайта.

Комментариев — 17 »

  1. Сергей 10.10.2010 в 11:35

    ни как не мог вспомнить как favicon сделать для сайта, спасибо помогло напомнить. =)

  2. krendelman 17.12.2010 в 12:17

    обязательно делать его 16х16? видел у секурных соединений вытянутые фавайконы. надо будет сделать для сайта, так выглядит солидней :-D

  3. Sergey 22.08.2011 в 17:17

    Спасибо ! =) вот я и нашел в данной статье то что искал .
    Сегодня утановил тоже иконку на свой сайт.

  4. flexey 25.10.2011 в 19:46

    Скажу по собственному опыту, эти иконки лучше всего ривовать в фотошепе, сам лично рисовал её для своего сайта, а что касается мета тегов, то в инете есть спец ресурс, чтоб его найти введите слово favicon, на этом сервисе загружаете свою картинку, и там сразу и мета теги готовые будут и картинка переделается в нужное разширение.

  5. Sorokin Vladimir 19.11.2011 в 22:30

    Хочу добавить. Вот такая подборка гарантированно выдает иконку во всех браузерах от ИЕ-6, до последних Опер с Фоксами.

    Но! Некоторые браузеры отображают иконку только тогда, когда сайт в закладках.

  6. Sorokin Vladimir 19.11.2011 в 22:34

    link rel=”icon” href=”\favicon.ico” type=”image/x-icon”
    link rel=”shortcut icon” href=”\favicon.ico” type=”image/x-icon”
    link rel=”shortcut icon” href=”favicon.ico”

  7. Sorokin Vladimir 19.11.2011 в 22:36

    Почему то не пропустило теги, пришлось обрезать «открытие»-«закрытие»

  8. Рамиль 22.05.2012 в 13:26

    Спасибо за статью. Как раз проблема была и фавикон не отображался, оказывается теги не добавил.

  9. Сергей 8.07.2012 в 22:52

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

  10. Евгений 27.08.2012 в 2:56

    Лично я создавал фавикон через специализированный сайт, только через зарубежный а то наши сайт делают не иконки а просто го*но!

  11. George 4.10.2012 в 7:18

    Полностью согласен с Сергеем. Использовать он лайн сервисы для этого проще, чем мучить ФотоШоп.

  12. Виталий 7.11.2012 в 12:43

    мини статья конечно, но мне подошло, просто искал как вставить иконку, спасибо. Кстати ест спец программы для создания иконок.

  13. iKNG 22.11.2012 в 15:38

    Я создал для своего сайта иконку через фотошоп с плагином. И да, при указывании адреса иконки желательно указывать не favicon.ico, а /favicon.ico. И лучше для кроссбраузерности (ох уж этот недобраузер) указывать 2 строки:

    Так же если все файлы, выложенные на публичный просмотр, находятся в корневой вместе с иконкой, лучше указывать ./favicon.ico

  14. Валерий 31.03.2013 в 15:25

    Спасибо. Коротко и ясно. Обязательно воспользуюсь

  15. Аня 9.04.2017 в 12:12

    Не знала что вафикон можно сделать чтоб во всех браузерах отображался, теперь буду знать как это исправить. Спасибо.

Оставьте комментарий к посту ”Как сделать иконку сайта (favicon)”

Разрешено использовать тэги: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Трекбеки и пингбеки

Ключевые слова:
AdSense google page rank Sape SEO WordPress Блог Сапа Софт Яндекс акция ап апдейт бесплатно дизайн домен запросы индекс цитирования интернет интернет-магазин комментарии компьютер конкурс продвижение реклама спам ссылки тИЦ форум эстафета