Иконка для сайта, favicon (favorite icon – любимая иконка) – это маленькая картинка, своего рода визитная карточка. Ее можно увидеть слева от адреса вашего сайта в адресной строке,

Иконка для сайта

в избранном (в закладках),

favicon для сайта

 в результатах поиска поисковой системы.

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

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

Для создания фавикона предлагаю воспользоваться самым популярным в рунете для этого сервисом favicon.ru

В удобном для вас графическом редакторе, например, в Adobe Photoshop, подготовьте заготовку для будущей иконки.

Так как favicon.ru значительно уменьшит вашу заготовку до маленького квадратика размером 16*16 пикселей, картинка (заготовка) должна быть квадратной (во избежание искажений). Изображение на картинке должно быть простым и легко узнаваемым. Это может быть логотип компании, значок, отражающий специфику проекта или даже ваш фотопортрет. Размер файла заготовки не должен превышать 300 килобайт, его формат может быть: gif, jpg, png, bmp, tiff, pcd, eps, …

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

После того как заготовка будет готова:

1. Загрузите ее на сервис favicon.ru щелкнув по кнопке Выберите файл.favicon иконка для сайта

2. По умолчанию размер иконки будет 16×16 пикселей. Можно выбрать больший размер, например, 32×32пх или 48×48пх для возможности отображения ее на рабочем столе в качестве ярлыка к сайту. Но учтите, большая по размеру иконка будет больше тормозить загрузку страниц сайта.

3. Нажатием кнопки Обрезать картинку откроется графический редактор сервиса. Вы сможете отредактировать размер своей картинки.

4.  Нажмите на кнопку Создать favicon.ico и после этого откроется окно с краткой инструкцией по установке иконки на сайт и со ссылкой на ее скачивание.

favicon для сайта

5.  Щелкните по ссылке Скачать favicon.ico .

6. Соединитесь по ftp с сервером сайта и перейдите в его корневую директорию (чаще всего public_html), далее скопируйте в нее скачанный файл. Советую использовать файл-менеджер  Total Commander.

favicon для сайта

Браузер сам найдет ваш favicon.ico и назначит отображение его содержимого в адресную строку и в закладки. А в результатах выдачи поиска иконка сайта появится после очередного сканирования его страниц поисковыми роботами.

P.S. Мне понравился еще наш отечественный онлайн-сервис для создания фавикона из готового изображения - http://pr-cy.ru/favicon/.

favicon на pr-cy

Выигрывает он по сравнению с предыдущим своей простотой. Просто выберите изображение на компьютере, создайте и скачайте готовый Favicon.

Дорогой коллега, если статья для тебя была полезна, подпишись на обновления блога.

С уважением, Роман Ваховский.

Хороший человек всегда нажмет на кнопку!
Комментарий > Благодарность > Ссылка на секретную страницу блога

16 комментариев: Favicon (иконка) для сайта

Страница 1 из 11
  • Нина говорит:

    можно поподробнее п.6 применительно к WordPress. Как и куда вставить иконку?

    • admin говорит:

      Старый п.6 теперь п.7. Читайте поподробнее о том как соединиться с FTP-сервером для закачки файла иконки в новом п.6.
      Ваш хостинг на "Time WeB" и это облегчит вам задачу.
      Я вам помог?

  • Юрий говорит:

    Спасибо за советы. Нашёл нужную иконку на предложенном вами сайте.

  • Любовь говорит:

    Cпасибо за подробную инструкцию! Сделала себе иконку сама, теперь можно хвастаться!

  • Александр говорит:

    С фавиконом, у сайта совсем другой вид! Гороздо солиднее, что ли...

  • Татьяна говорит:

    Может поможите и мне разобраться. У меня иконка в браузере отображается, в закладках тоже, а вот в поисковике нет. куда я ее только не ставила и в корневую папку сайта и в папку темы (imedge) и как у Вас написано. Не могу понять в чем причина. Можите посмотреть сами grinapteka.ru. Что делать?

    • Роман Ваховский говорит:

      Ваш фавикон еще не проиндексирован поисковиками так как создан недавно поэтому его нет на странице поиска. Остается подождать индексации или ускорить ее отправив адрес иконки через (аддурилки) инструменты "Сканирование URL" и "Сообщить о новом сайте" гуглу и яндексу соответственно. Читайте об этом в статье Ускорение индексации сайта.

  • Света говорит:

    Вроде все сделала правильно по инструкции из статьи, но упорно фавикон не появляется, неужели за 10 дней могло не обновиться?

  • Альберт Сергеевич говорит:

    Подскажите а нужно права выставлять к файлу с фавиком? у меня стоят 644

    • Ваховский Роман говорит:

      Специально выставлять права к favicon.ico после его создания необязательно. Будет достаточно тех, которые выставятся по умолчанию. Главное чтобы не было запрета на чтение. Если у вас права 644 (админу - чтение, запись, остальным -только чтение), то так и оставьте. Это будет правильно.

  • Юлия говорит:

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

  • Создатель говорит:

    А как анимированную иконку сделать? Видел на многих сайтах себе тоже охота.

Страница 1 из 11

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Поиск по блогу
Подписка тут
подписка

Все права защищены © 2011-2017. WordPress-book.ru

Копирование материалов разрешено только с размещением открытой обратной ссылки на источник.