Как пошагово создать фавикон в Логастер и зачем он нужен

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

Ранее мы уже говорили про архивы favicons, а сегодня рассмотрим процесс создания данных элементов с нуля — в работе будем применять удобный сервис Логастер. Но в начале статьи немного поразмышляем о их важности и роли в оформлении и продвижении онлайн ресурса.

Нужен ли вам фавикон?

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

Экономия времени при поиске 

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

Узнаваемость сайта с фавиконкой

Повышает уровень доверия и узнаваемость

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

Преимущества для SEO

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

Фавиконки в Яндексе

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

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

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

Создание фавикона c Логастер шаг за шагом

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

1. После нажатия кнопки «Создать логотип» введите название своей компании и выберите сферу деятельности ниже.

Создаем логотип в Логастер

2. Сервис подберет десятки интересных актуальных изображений. Если среди предложенных вариантов нет того, что вам нужно, уточните запрос — для этого в верхней строке введите ключевое слово и продолжите поиск.

Поиск подходящего лого

3. Если нужная иконка найдена, можете смело пропускать второй шаг и сохранять лого. При необходимости отредактируйте расположение, цвет и размер элементов. Допускается также изменение шрифта текста.

Редактирование одного из вариантов логотипа

4. Сохраните все. Дабы ваш результат случайно не пропал, в Логастере создается личный аккаунт, где будет размещаться текущая и все последующие работы (сразу после регистрации).

Завершение работы и регистрация

5. Теперь, приступаем к генерированию нового favicon, выбрав в правом верхнем углу картинки в выпадающем меню ссылку «Создать фавикон с этим логотипом».

Создание фавиконки в Логастер

6. Сервис подберет для вас множество вариантов маленьких иконок.

Выбор разных вариантов фавиконки

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

Если выбрать простое редактирование фавикона, вам также доступны некоторые функции, но, как видите, они весьма ограничены:

Редактирование иконки

7. Через некоторое время favicon наконец-то будет готов! Осталось только его приобрести либо сразу заказать весь дизайн-пакет, включающий дополнительно лого, визитку и бланк. Стоимость отдельно — $9.99.

Покупка готовой работы

После этого, можете скачать иконку и загрузить ее на ваш проект. Инструкции по установке также найдете в личном кабинете. Обычно достаточно прописать в коде страницы 2 строки:

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

Итого. Очевидно, что все современные веб-ресурсы должны иметь фавиконку — это полезно для восприятия сайта, пользователей и SEO. Создается она по разному, однако значительно упростить весь процесс позволяет сервис Логастер, где вы легко генерируете множество разных вариантов, а потом с помощью редактора их дорабатываете. Если уже сталкивались с ним, то сможете одним кликом сделать favicon из полученного ранее логотипа. Все достаточно просто.


Комментариев - 3 для поста Как пошагово создать фавикон в Логастер и зачем он нужен
  1. ]]> Lilit ]]> (Январь 3, 2018)

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

  2. ]]> Marta ]]> (Январь 15, 2018)

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

  3. ]]> Tod ]]> (Январь 15, 2018)

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

Оставить комментарий
для статьи Как пошагово создать фавикон в Логастер и зачем он нужен