Как создать фавикон для своего сайта (блога)?

Фавикон - это маленькая картинка, обычно 16*16 пикселей, с расширением ico, расположенная в адресной строке сайта.

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

Фавикон по сути является своеобразной визитной карточкой сайта, поэтому должен ассоциироваться с сайтом, формируя первое впечатление и создавая определенный образ. Вы обращали внимание на фавикон Яндекса или Гугла? У Яндекса это большая буква "Я" красного цвета, а у Google  - буква "g".

Кроме буквенного обозначения для фавикона можно использовать картинку, отображающую тематику сайта. Главное подобрать или нарисовать четкую картинку без обилия деталей, иначе в столь маленьком размере она будет сливаться и будет сложно разобрать, что на ней изображено.

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

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

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

Давайте подробнее остановимся на каждом способе.

Онлайн-генератор Логастер очень удобный сервис. Прежде, чем создавать фавикон, вам нужно создать логотип. Но такой лишний шаг оправдан тем, что вы получаете не только возможность выбора из множества сгенерированных сервисом вариантов, но и получаете фавикон в едином стиле с логотипом. 


А если немножко потренироваться, то можно изобразить что-то более качественное. Тут уж полная воля для вашей фантазии. Есть возможность добавить анимационные эффект, для этого сразу под квадратом имеется специальная ссылочка.

После того, как фавикон будет готов, щелкайте по кнопке Download Favicon  и скачивайте на свой компьютер. Кстати, там же вы можете оценить , как будет выглядеть ваш фавикон в адресной строке. Для этого сервис снабжен предварительным просмотром "Preview" и весь процесс создания фавикона отображается в нем.
Для тех, у кого с английским вообще туго, рекомендую русский сервис, позволяющий таким же образом "нарисовать" уникальный фавикон - michurin.com.ru, только без анимационных эффектов.

С первым способом создания фавикона собственными руками мы познакомились, перейдет ко второму способу - созданию фавикона из имеющейся картинки.

Предварительно находите подходящую картинку (а лучше несколько на случай, если результатом останетесь не довольны) и приступаете к созданию из нее фавикона. Сделать это можно в том же favicon.cc, для этого в меню выберите второй пункт Import Image и с помощью Обзора загрузите картинку в сервис.

Здесь же вам предложат два метода создания фавикона из загруженной картинки: уменьшить картинку, сохраняя пропорции (для этого выбираете первый пункт) либо же просто сжать картинку с двух сторон, придав ей квадратную форму (соответственно выбираете второй пункт). Как это будет выглядеть, показано там же на примере картинки с грузовиками. После создания фавикона скачиваете его на свой компьютер.

Из русских сервисов популярен favicon.ru, действующий по тому же принципу: загружаете с помощью Обзора любую картинку, либо просто указываете ее адрес в Интернете и жмете на кнопку "Создать favicon.ico". Если есть необходимость можете попутно кроме стандартных размеров фавикона создать дополнительные фавиконы 32*32 или 48*48, для этого поставьте галочки напротив желаемых размеров.
   
Согласитесь, довольно просто и быстро...
Многих новичков интересует вопрос, где взять подходящую картинку для фавикона. Рекомендую посетить нижеприведенные сервисы, где можно скачать любую понравившуюся картинку бесплатно:

     - bestfreeicons.com;
     - iconarchive.com;
     - freeiconweb.com;
     - freeicondownload.com.

Итак, фавикон создан, но для того, чтобы он стал отображаться в адресной строке, его надо закачать на сервер хостинга в коневую папку, если там есть папка img, то поместите туда. В большинстве случаев этого достаточно, браузер сам "подхватит" фавикон. По крайней мере FireFox, которым я пользуюсь, стал отображать фавикон моего сайта без всяких указаний в виде вставки кода. Достаточно было перезагрузить браузер.

Если в вашем случае этого оказалось недостаточно и браузер не отображает фавикон, то придется в html-код добавить пару строк между тегами <head> и </head>. Код такой:

    <link rel="icon" href="/favicon.ico" type="image/x-icon">
   <link rel="shortcut icon" href="/favicon.ico"
     type="image/x-icon">

После вставки этих строк в код потребуется перезагрузка браузера, если не поможет и это, то следует очистить кеш браузера. Все! Можно любоваться как ваш безликий до этих пор сайт приобрел свой значок. Мои поздравления!
   
P.S. И как всегда на десерт парочка новых "жирных" ссылок:

  - lookatme.ru (ТИЦ 2000) - сайт-афиша: новости музыки, моды, кино... Регистрируетесь, подтверждаете регистрацию. После подтверждения на странице профиля выбираете пункт "редактировать профиль", он сразу под вашим ником (логином) вверху. В профиле есть возможность указать сразу два сайта.

    - risk.ru (ТИЦ 1800) - сайт об экстремальных видах спорта. Действия те же: регистрация, подтверждение и редактирование профиля.

Всем успехов и до новых встреч! С ув. Светлана (SvetLana_TSV)
                                               Добро пожаловать в проект "Сайт с нуля" !
Прежде всего данный проект предназначен для тех, кто пытается создать сайт самостоятельно, то есть для новичков. Соответственно, вся информация изложена доступно, все этапы построения сайта сопровождаются скриншотами, что позволит начинающим вебмастерам быстро и просто освоиться в этом нелегком вопросе.
Здесь вы можете скачать русские версии WebPageMaker, WordPress, Joomla, Adobe Muse, а также инструкции по установке WordPress и Joomla на хостинг и мануалы по установке тем (шаблонов) для этих CMS.

                               Всем желаю удачи и смелых воплощений идей на вашем сайте !
Пошаговое руководство для новичков по созданию,
раскрутке и монетизации собственного сайта.
WebPageMaker, Wordpress, Joomla - инструкции для
новичков по установке CMS и шаблонов к ним.
Проект для новичков
2010 - 2016 © Сайт с нуля: пошаговое руководство для новичков по созданию, раскрутке и монетизации собственного сайта. WebPageMaker, WordPress, Joomla -  русские версии.
Автор и администратор  данного проекта - SvetLana_TSV.  Копирование материалов сайта разрешено только при наличии активной ссылки на данный проект.
Главная       Скачать       Уроки        Новости        Статьи        Контакты        Карта сайта
Хочешь быть на шаг впереди и первее
остальных получать новые материалы
сайта? Тогда не забудь оставить свои
координаты: имя и электронный адрес!
ПОДРОБНЕЕ

??????.???????
Не забудь заглянуть в свою почту и подтвердить подписку!
Logaster
Большой популярностью у вебмастеров пользуется сервис favicon.cc, хотя он и на английском языке. В нем можно нарисовать фавикон с нуля, тогда он будет "единственным и неповторимым" и возможность обнаружить точно такой еще у нескольких десятков сайтов сводится к нулю.

Сервис также позволяет выбрать подходящий фавикон из предложенной коллекции и подкорректировать его под свои нужды. Затем просто скачиваете полученный фавикон уже с нужным расширением ico на свой компьютер. Вот такой простенький фавикончик  я "нарисовала" в этом сервисе буквально за минуту.