фавикон

Что такое фавикон и нужен ли он блогу?

18 октября, 2015 Екатерина Калмыкова комментариев 5
Spread the love

фавикон

Привет всем! С вами Екатерина Калмыкова. Наверняка каждый из вас, при открытии в браузере той или иной страницы замечал, как правило, в левом углу закладки иконку с изображением сайта? Но не думаю, что каждый знает, что это такое и для чего нужно.

На самом деле рисунок имеет профессиональное название и играет достаточно важную роль для всего ресурса. Поэтому в статье мы поговорим о том, что такое фавикон (да, именно так он называется), а также как установить favicon на wordpress.

Что такое фавикон?

Итак, фавикон, что это? Как уже говорилось ранее, рисованная иконка в левом углу закладки. Если говорить в общем, это значок страницы или сайта, который отображается браузерами. Вот несколько примеров этих самых картинок:

пример-фавикон

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

пример-фавикон

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

Каким должен быть фавикон?

Давайте поговорим о характеристиках его изображения:

  • Размер — 16×16, реже 32×32 точки;
  • Цвет — 16 или 2 бита;
  • Указывать элемент значка нужно в HTML коде, внутри <head>;
  • Формат: gif или png.

Теперь обозначим основные факторы, влияющие на его дизайн:

  1. Стилистика должна соответствовать блогу. Если вы специализируетесь на мотоциклах, достаточно трудно будет объяснить, почему на иконке у вас изображен апельсин.
  2. Старайтесь при создании ориентироваться не только на смысловую часть блога, но и на цветовую гамму, сохраняйте ее.
  3. Иллюстрация должна быть максимально понятной для пользователя, чтобы при поиске в поисковике, он сразу понял, что ищет именно вас.
  4. Можно поставить картинку, олицетворяющую вашу деятельность. Но здесь нужно хорошенько все продумать. Если вы занимаетесь оптовой продажей бананов, то фрукт будет как нельзя кстати. Но вот если вы продаете компьютерную технику и комплектующие, то не стоит изображать клавиатуру — я думаю, пользователи вас не поймут.
  5. Старайтесь использовать известные и запоминающиеся картинки, которые посетитель сразу запомнит и потом будет ассоциировать именно с вашим проектом, например у компании apple — яблочко.

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

Для чего нужен фавикон?

Как уже было сказано ранее, фавикон используется в качестве визитной карточки, которая олицетворяет блог. А какие еще функции выполняет он?

1. Удобство. Вспомните себя, ну у меня по крайней мере так, когда я начинаю что-то искать в сети, я открываю огромное количество вкладок, сайтов, чтобы потом не потерять то, что нужно. И что в итоге? Я просто утопаю в океане каких-то непонятных заголовках «скачай прямо сейчас», «у вас 10 новых уведомлений» и т.д. Иллюстрации веб-проектов в этом плане мне очень помогают. Благодаря этому помощнику я сразу могу найти во вкладках то, что мне нужно, потому что вижу визитку ресурса.

2. Как правило, на решение человека в выборе какого-то продукта, будем рассматривать блог как продукт, влияет его зрительное восприятие. Поэтому, по результатам исследования, человек скорее всего кликнет на ссылку, у которого есть своя визитная карточка в поиске. Как ни странно, у меня раньше этого и в мыслях не было, но это действительно так. Я скорее всего и чаще перехожу по ссылке, у которой есть иллюстрация, чем по той, у которой ее нет. И, как правило, эти сайты находятся в топе поиска.

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

Как сделать фавикон?

Поговорим, каким образом можно сделать эту фигурку?

1. Adobe Photoshop. Для этого вам нужно иметь некоторые навыки работы в программе и уметь пользоваться этим инструментом. Профи советуют рисовать его большого формата, чтобы было удобнее, а потом уменьшать для приемлемого размера. После этого рисунок сохраняем в правильном формате и все - ваша визитка готова. После мы переходим на генератор фавиконов[urlspan] favicon-generator.org[/urlspan] и генерируем.

2. Онлайн-сервисы. Например, [urlspan]favicon.ru [/urlspan]. Здесь вы можете не только создать иллюстрацию самостоятельно в онлайн режиме прямо на главной странице бесплатно. Но и загрузить уже готовое изображение, а также заказать у дизайнера.

Вот как этот ресурс выглядит.

где-делать фавикон

— заказ рисунка у специалиста;

— сделать самостоятельно путем добавления рисунка из документов компьютера;

— нарисовать иконку на сайте.

Конечно, там можно сделать что-то более интересное, но сегодня мой талант художника ушел в спячку 🙂

как-делать фавикон

Еще один ресурс самостоятельного создания иконок [urlspan]favicon.by[/urlspan]. Функционал и алгоритм работы очень похож на предыдущий сервис. Поэтому останавливаться подробно на нем не буду. Зайдите на этот сайт, его интерфейс интуитивно понятен и прост.

фавикон-бу

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

Как установить фавикон?

Все создано, а как теперь добавить фигурку на wordpress? Очень просто, сейчас расскажу как!

Есть несколько вариантов:

1. Если тема поддерживает загрузку картинки напрямую, воспользуйтесь этой функцией. Нужно зайти в административную панель во вкладку «Внешний вид», выбрать тему и загрузить фавикон.

установка-фавикона

Это самый быстрый и простой способ.

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

2. Если тема такого не поддерживает, путь будет дольше. Необходимо зайти в «Медиафайлы» и нажать «Добавить новый».

добавление-фавикона

Загрузить подготовленное изображение в необходимом расширении: iso или png.

как-делать фавикон

Далее нажать на «Изменить» и скопировать ссылку.

как-делать фавикон

После зайдите в административное меню «Внешний вид» — «Редактор».

как-делать фавикон

Выберете необходимую тему.

как-делать фавикон

 Откройте «Заголовок».

как-делать фавикон

И в поле после «head» вставьте следующий код:

код

Где вместо «http://адрес-вашего-сайта.ru/favicon.ico"» вставляем скопированную ссылку. Затем нажимайте установить.

Все, на этом работа по установке фавикона завершена. Поменять его можно таким же образом, вставив ссылку на новое изображение.

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

Всем пока!

Оказалась статья полезной? Я буду благодарна, если вы поделитесь ее с друзьями!

Екатерина Калмыкова

5 ответов на “Что такое фавикон и нужен ли он блогу?”

  1. Обратил внимание, что на подсознательном уровне уже обращаю на наличие фавикона у сайта. То есть если он есть, то все нормально, а вот если нет — то сайт кажется сделанным на коленке между уроками под партой школьником )

    Ответить

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

      Ответить

  2. Это точно, но фавикон имеет значение для сайта. Даже при анализе сайта многие сервисы обращают на это внимание. Казалась бы маленькая деталь в большом двигателе сайта, но такая значимая.

    Ответить

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

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

Похожие записи