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

Как сделать favicon

Как сделать иконки для сайта или создаем красивую фавиконку (favicon)

Рад приветствовать Вас, дорогие друзья! В сегодняшней статье я хочу затронуть такую тему, как сделать иконки для сайта, которые называются фавиконками или «favicon». Мы рассмотрим, что такое favicon, почему нужно обязательно обязательно создавать иконку для сайта  или блога и как сделать фавикон самому.Как сделать favicon для сайта

А также я расскажу о том, какие онлайн генераторы можно использовать для создания Фавикона, где можно скачать готовые иконки (значки для сайта) и как настроить отображения favicon.ico на своем сайте или блоге.

Что такое иконки для сайта (Favicon)?

Favicon (иконки сайта) — это маленькая картинка, которая отображается перед адресом url, а также перед названием открытой страницы. В большинстве случаев favicon является логотипом, поэтому нужно серьезно отнестись к его созданию.

Вот мой favicon:

что такое фавиконка
фавинка отображается в подписи перед URL сайта

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

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

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

Как создать favicon.ico?

Есть несколько способов: создать с помощью Photoshop, online генератора, либо скачать готовую иконку. Рассмотрим все по порядку.

Создание с помощью Photoshop

Создать favicon в Фотошопе не составит труда, а вот сохранить в формате .iсo будет немного проблематично. Нужно будет скачать с интернета и установить специальный плагин.

Создание favicon с помощью онлайн генератора

Рассмотрим весь этап создания на примере отечественного сайта favicon.ru.

1) Переходим на сайт.

Интерфейс выглядит следующим образом:

создаем иконки для сайта
чистое поле перед созданием иконки для сайта

2) Все настолько просто, что можно сразу начинать рисовать, предварительно выбрав цвет.

Вот какую иконку нарисовал я:

Как сделать favicon
Фавиконка для сайта BloogIT.ru

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

Как сделать favicon

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

После того, как иконка для сайта будет готова, можно ее скачать себе на компьютер, нажав на кнопку «Скачать FAVICON»

favicon

Создание favicon с помощью готового изображения

Если вы не хотите терять время на создание иконки с нуля, то можно сделать favicon с помощью уже готового изображения. Для этого нам потребуется тот же самый сайт favicon.by

Просто загрузите готовое изображение через форму вверху сайта и получите готовый favicon.

Фавикон

Список сайтов с готовыми favicon

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

Iconj – самая огромная база готовых иконок

Favicon — также небольшая база фавиконок

Siteicon — советую глянуть сюда.

Thefavicongallery — также неплохая база готовых иконок

 

Прикрепляем готовый favicon к сайту

Итак, после того как вы создали favicon ( либо скачали ) нужно его прикрепить к сайту. Делается это следующим образом.

1) Закиньте favicon.ico в корень сайта. Обычно это папка public_html

2) Далее пропишите в header.php следующие строки, заменив ВАШ_САЙТ на адрес своего сайта или блога:

<link rel="shortcut icon" href="http://адрес_сайта/favicon.ico">

P.S. прописывайте данный код до тега </head>

Ну вот и все! Теперь и вы знаете, как создать иконку (фавиконку)для своего сайта и настроить ее отображение. Надеюсь статья была полезной и интересной для Вас и вы поняли, как сделать значок для сайта.

Познавательное видео о том, как сделать иконку для сайта

 

И наконец не только favicon

Новость №1. Если вы еще не знаете, то я учусь в 9 классе и учусь на отлично, поэтому принимаю участие во всех мероприятиях, связанных с учебой.

Так вот, позавчера я участвовал в Турнире Эрудитов им. Ломоносова. Изначально я хотел принять участие только на секции «Информатика и ИТ», но оказалось, что информатики, вообще, нет в турнире, поэтому мне пришлось принять участие на других секциях.

Вот тут самое интересное, я принял участие в 5 общеобразовательных предметах: физика, математика, математические игры, химия и литература. Сам удивился, как я так смог )

Теперь жду ответа. Надеюсь, что результаты будут хорошими.

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

Что касается химии, то здесь я решил только 2 задачи из 3-х предложенных. С литературой также были проблемы, так как не знал некоторых произведений.

Если я стану победителем или займу призовое место по любому из 5 предметов, то сделаю приятный подарок всем постоянным читателям блога.

Новость №2. Может кто заметил, что в последнее время я мало уделяю времени блогу. Это связано с тем, что у меня мало времени, так как очень много задают на дом, а так как я отличник :-), делаю все и всегда и на 5 :yes:  Так вот с сегодняшнего дня я буду уделять больше времени блогу.

Призы:

1 место. 100 рублей  + книга «Социальное продвижение от А до Я» + Скидка 50% на мои услуги в социальной сети Вконтакте ;

2 место. 50 рублей + книга «Социальное продвижение от А до Я» + скидка 30%;

3 место. 25 рублей + книга «Социальное продвижение от А до Я» + скидка 10%;

Если наберется 100 подписчиков, то 100-му бонус 25 рублей.

Дата проведения: 02.10.12 — 02.12.12

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

Введите свой e-mail в форму ниже:

Не забудьте подтвердить подписку :good: Советую также почитать статью «Как добавить смайлики в блог? «

Подробная инструкция по фавиконке представлена тут

 

6 комментариев


  1. Спасибо. Внесла в закладки. Как раз собираюсь сделать фавикон для сайта мужа.

    Ответить

  2. Фавикон — вроде мала вещь, но весьма нужная. Создавать его в Фотошопе, мягко выражаясь, использовать ресурсы не по назначению. Лучше применять что-то по проще типа онлайн редактора иконок.
    также стал подписчиком.

    Ответить

  3. Где найти поле для ввода кода(header.php) на ucoz?

    Ответить

    1. Войди в панель управления. Далее в управление дизайном. Найди редактор страниц. Далее между вставляй код.

      Ответить

  4. Тимур, ты просто умничка! Тебя ждет большое будущее. Много действительно полезной информации. Думаю вернусь на твой блог еще не раз. :good:

    Ответить

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

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