Важность фавикона для веб-сайтов выходит далеко за рамки простого дизайна. Небольшие образные знаки также служат ориентиром и положительно влияют на SEO.
Что такое фавикон: определение
Маленькая иконка с большим эффектом. Фавикон — это маленькая иконка, которая отображается, например, на вкладке браузера слева и позволяет отслеживать множество открытых веб-сайтов. Обычно на нем изображен упрощенный логотип или образный знак, и его можно четко отнести к соответствующему веб-сайту. Поэтому фавикон имеет особое значение: он служит ориентиром и усиливает присутствие веб-сайта.
Какой именно подходящий фавикон или что для него подходит, зависит от внешнего вида вашего бренда. Поскольку размер самого символа составляет всего несколько пикселей, сложные и детализированные логотипы часто не могут быть удовлетворительно отображены. В этом случае рекомендуется упрощенная модификация фактического идентификатора.
О большом значении фавикона можно догадаться уже из его названия: это портмоне из терминов «фаворит» и «иконка», то есть «иконка для избранных». Маленькие изображения появляются не только на вкладках браузера, но и в закладках, где вы сохраняете свои любимые веб-сайты. Кроме того, фавиконки теперь также можно найти в виде значков приложений, в меню поиска или в истории браузера.
В чем смысл фавиконов?
Большое значение правильного фавикона для вашего сайта можно объяснить несколькими аспектами:
- Профессионализм: фавикон является частью профессионального веб-сайта. Это укрепляет доверие ваших посетителей к вашему бренду и показывает, что даже предположительно мелкие детали важны для вас. Хотя большинство людей не могут точно определить, что такое фавикон, они сразу же заметят, когда на веб-сайте отсутствует изображение.
- Идентификация: Фавикон также имеет особое значение по практическим причинам. Благодаря маленькому значку пользователи смогут найти ваш сайт намного быстрее, даже если одновременно открыто множество вкладок. Значок также делает ваш бренд безошибочно узнаваемым в поисковых системах или в списке приложений.
- Укрепляйте свой бренд: хороший логотип создает узнаваемость и может играть роль в принятии решений. Как бы ни был важен дизайн логотипа для вашего стартапа или бренда, не менее важен и правильный фавикон.
Как фавиконки влияют на SEO?
Хотя бы косвенно, фавикон также важен для поисковой оптимизации. Хотя маленькая графика напрямую не влияет на ранжирование, хороший фавикон все же положительно влияет на SEO. В основном это связано со следующими причинами:
Что следует учитывать при выборе фавикона?
То, что делает хороший фавикон, нельзя обобщать. Конечно, правильный подход во многом зависит от бренда и его дизайна. Многие компании также используют свой логотип в качестве фавиконки, но это работает только в том случае, если он выглядит привлекательно даже при небольшом размере и разрешении. Однако есть несколько основных правил для создания подходящей мини-графики:
Фирменный стиль:удачные примеры фавиконов всегда соответствуют фирменному стилю компании. Даже если использовать собственный логотип в качестве значка невозможно, выбранный вами мотив должен на первый взгляд соответствовать остальному дизайну. Только так можно обеспечить уникальность бренда.
Чем меньше, тем лучше:Фавиконы очень маленькие, поэтому сложные украшения и детали не проявляются сами по себе, когда значок действительно используется, особенно на смартфоне. Результат тогда кажется перегруженным и больше не привлекательным. Поэтому всегда можно использовать инициалы бренда. Поскольку полное название редко может отображаться на фавиконе, первая буква или простая, но содержательная иконка имеют больше смысла.
Правильные цвета:Конечно, используемые цвета также должны соответствовать вашему фирменному стилю. Если у вас все еще есть свобода действий, контрастные цвета — хорошая идея, так как они быстрее бросаются в глаза. Обратите внимание, однако, что разные браузеры отображают значки немного по-разному. Например, небольшие изображения имеют белый или серый фон, что может немного изменить впечатление.
Какого размера фавиконки?
Если вы хотите встроить значок, обратите внимание на соответствующий размер значка. Обычно это 16×16, 32×32 или 48×48 пикселей, но, к сожалению, некоторые браузеры отличаются от этого. Исключения можно найти здесь:
| браузер или устройство | Размер |
| Интернет-магазин Chrome | 128×128 пикселей |
| гугл тв | 96×96 пикселей |
| Интернет Эксплорер 9 | 24×24 пикселей |
| домашний экран айпада | 72×72 пикселей |
| iPhone (старые модели) и iPad Touch | 57×57 пикселей |
| домашний экран айфона 4 | 114×114 пикселей |
| Быстрый набор оперы | 195×195 пикселей |
Какие форматы поддерживаются?
В принципе, фавиконы могут быть созданы в разных форматах. Однако наиболее распространенным является.ico, контейнер для данных изображения, допускающий различную глубину цвета и разрешение. Формат поддерживается большинством браузеров. Также можно использовать.png,.gif или.svg. Однако эти три формата совместимы не со всеми браузерами. С другой стороны, более низкое разрешение говорит против возможного формата.jpg.
Примеры фавиконов
Чтобы вы, наконец, получили представление о том, насколько разнообразными могут быть крошечные изображения, мы покажем вам три примера удачных фавиконок.
Google полагается только на свои собственные инициалы и в остальном полагается на цвета. Поисковик отличается от большинства других фавиконов именно радужным дизайном.
Google сочетает в фавиконке цвета собственного логотипа.
LinkedIn использует другой подход и показывает, что это не всегда должно быть первое письмо. Белая буква «ин» на синем фоне выделяется среди многих других фигуративных знаков.
LinkedIn использует ширину фавикона для двух букв.
YouTube показывает, как работает хороший фавикон без букв. Кнопка воспроизведения, которая также является частью логотипа компании, выделяется в каждом браузере.
YouTube полностью обходится без букв для своего фавикона.
В Digital Guide вы найдете множество статей, которые также помогут вашему присутствию в Интернете. Помимо руководства по созданию успешного веб-сайта, здесь вас ждут полезные инструкции по интеграции фавиконов в WordPress, а также другие советы и рекомендации по созданию логотипа.
