Автор статьи - арт-директор Никита П.
Логотип для сайта — это оригинальный графический знак, который служит для идентификации компании, ее продуктов и услуг.
Ключевые задачи лого на сайте:
1. Указывать на принадлежность веб-ресурса конкретной компании.2. В качестве значимого элемента айдентики устанавливать эмоциональную связь с пользователями.
3. Определять авторское право.
Если у компании уже есть логотип, то при создании фирменного веб-ресурса главная задача дизайнера заключается в адаптации и правильном использовании этого знака.
Когда сайт разрабатывается при выходе фирмы на рынок, как носитель корпоративной идентичности, логотип создается с нуля. В соответствии с общими правилами и требованиями к одному из базовых элементов айдентики.
Как разрабатывают логотипы: для сайтов и не только
Логотипы разделяют на несколько видов:
- Текстовые — в их основе лежит оригинальная типографика, иногда с добавлением небольших рисованных деталей. Такие лого могут представлять из себя полные названия или сокращенные — до монограмм либо лигатур.- Состоящие только из изображения. Это может быть эмблема, абстрактный символ или рисунок, прямо связанный с деятельностью компании.
- Комбинированные, в которых знак сочетается с названием.
Основные правила создания логотипов от графического дизайнера Дэвида Эйри:
- Простота. Минималистичный фирменный лого легко адаптировать к любым носителям. Простой дизайн легче узнается и запоминается.- Соответствие ценностям компании, сфере деятельности и целевой аудитории. Это значит, что изображение должно быть понятным. А вот прямо демонстрировать то, чем занимается компания, скорее не должно. О разных уровнях ассоциаций — немного ниже в этом разделе.
- Традиционность. Логотип — основа айдентики бренда, и должен быть долговечным. Поэтому не стоит слепо следовать модным трендам.
- Индивидуальность. Идеально, когда изображение узнается уже по внешним очертаниям.
- Выделение одной, самую запоминающейся черты.
- Четкость и выразительность даже в маленьком размере. Кстати, именно уменьшение поможет выявить ненужные детали — все, что становится незаметным, стоит убрать.
Если говорить о смыслах, то правильный логотип вызывает нужные бренду ассоциации. А сами ассоциации можно классифицировать по трем уровням, каждый из которых имеет свои преимущества:
- Первый уровень — ассоциации, что возникают у человека в тот момент, когда он замечает предмет или явление. Они очевидны, не вызывают сомнений и поэтому хорошо воспринимаются.  |  |
- Второй уровень — ассоциации, в основе которых простые логические связи между событиями, фактами, понятиями. Чтобы распознать ассоциацию второго уровня, человеку требуются определенные знания. Соответственно, логотипы, созданные по такому принципу, должны «попадать» в информационное поле и опыт целевой аудитории.
Например, то, почему на фирменном знаке молочных продуктов «Простоквашино» кот в тельняшке, понятно тем, кто видел добрые мультфильмы по книгам Э. Успенского.
Известен конфуз с детским питанием Gerber, упаковки которого удивили покупателей в странах Африки. Поскольку читать там умело незначительное количество людей, они привыкли видеть на этикетках именно содержимое баночек, а не его потребителей.
 |  |
- Третий уровень — ассоциации, построенные на подсознательном понимании и эмоциональной связи. Это абстрактные образы. Пожалуй, самый известный из таких лого,— свуш, придуманный для компании Nike, — графический символ стремительного движения.
Примеры логотипов с разным уровнем ассоциаций из работ Rocketmen Agency:
Логотип сайта: что означают цвет и форма
Первый важный фактор, влияющий на восприятие логотипа, — цвет. Именно он определяет, заметит ли человек изображение, и какие чувства окажутся его первым впечатлением.
Каждый цвет обладает своим настроением:
- Черный — строгий и классический.- Белый — искренний, чистый.
- Красный — энергичный, привлекательный и будоражащий.
- Оранжевый — жизнелюбивый, приветливый, солнечный.
- Синий — солидный, уверенный, профессиональный.
- Голубой — открытый, располагающий.
- Желтый — радостный, теплый.
- Зеленый — экологичный, связанный с плодородием, жизнью, здоровьем.
- Серый — элегантный, сдержанный, высокотехнологичный.
- Фиолетовый — мистический, волшебный.
Квадрат, овал, треугольник или гексагон — выбирать форму логотипа тоже следует не по наитию. Геометрические фигуры человеческое подсознание наделяет определенными свойствами. И эти ассоциации нужно уметь использовать:
- Квадраты — уравновешенность и надежность.
- Прямоугольники — практичность и логичность.
- Треугольники — лидерство, энергию, проактивность.
Кроме геометрических, фирменные знаки создают на основе органических (природных) фигур: плавные силуэты цветов, листьев, ракушек, капель воды ассоциируются со здоровьем, естественностью, покоем и удовольствием.
Известные абстрактные изображения — сердце и крест — имеют традиции использования в айдентике медицинских, религиозных, благотворительных организаций.
Шрифт для логотипа
Шрифт важен не только для читабельности. Своим графическим рисунком он передает характер бренда:
- Округлые буквы выглядят открытыми, неспешными и уверенными.- Овальные говорят об ориентации на инновационность.
- Квадратные воспринимаются как надежные, стабильные, солидные.
- Угловатые подчеркивают энергичность и целеустремленность.
- Слова, набранные только прописными буквами, создают впечатление статусности, только прописными — открытости и демократичности.
- Размашистая рукописная надпись указывает на дружелюбие и креативность.
- Узкие каллиграфические, нарочито усложненные буквы — на оригинальность, эксклюзивность.
Шрифты с засечками вызывают уважение как строгие и классические, буквы без засечек располагают к себе и выглядят более современными.
Лого для сайта: как правильно использовать
Дизайн логотипа влияет на выбор цветовой схемы для сайта. Ее главные и акцентные цвета должны быть связаны с цветами лого, а фоновый — дополнять их.
На примерах из портфолио студии:
Примеры демонстрируют и традиционное размещение логотипа дизайнерами: в верхнем левом углу. Причин для этого две:
- Распространенность так называемой Z-схемы просмотра, когда взгляд человека движется по странице как раз от верхнего левого угла.- Такое размещение привычнее пользователям с тех времен, когда не все браузеры отображали сайт в полную ширину и правая сторона страницы могла остаться скрытой. Соответственно, разработчики вынуждены были помещать фирменный знак слева.
По центру страницы вверху размещают свои логотипы официальные сайты СМИ, которые таким образом поддерживают визуальную идентичность с печатными версиями.
Логотип сайта является также элементом навигации — пользователи привыкли нажимать на него,чтобы перейти на главную страницу. Так клиенты легче запоминают фирменный знак компании.
Задача веб-дизайнера — сделать лого заметным и разместить под ним активную ссылку.
Другие технические требования к лого на сайтах:
1. Использовать изображение с прозрачным фоном.2. Выбирать векторный формат .svg, поскольку растровые при масштабировании могут терять качество отображения. Если с логотипом размещается и слоган, оформлять его текстом либо картинкой в векторном формате.
3. Хранить изображение в корневой папке на сервере, в файле с прямым названием — logo.
4. Универсальный размер — 1024 x 512 px. Поскольку изображение должно масштабироваться под разные браузеры и устройства, необходимо подготовить адаптивную верстку, прописать отдельные коды для каждой из картинок разных размеров.
5. Прописать для фирменного знака метатег title и атрибут alt.
Еще один элемент веб-ресурса, который может быть связан с логотипом, — фавикон. Это пиктограмма, которая отображается браузерами в закладках и в поисковой выдаче перед названием сайта. Для фавикона часто используют упрощенный лого или его часть, например, первую букву слова-названия.
Как сделать логотип для сайта и не ошибиться
Чтобы сделать логотип для сайта в Украине, есть четыре пути:
- Попробовать разработать самостоятельно, используя популярные графические редакторы.- Поэкспериментировать на сервисах для генерации логотипов онлайн:
- Использовать программное обеспечение для дизайна, например, GIMP, Free Card Maker, Banner Maker Pro, Logo Design Studio.
- Обратиться в профессиональную студию брендинга.
Решите вы следовать путем самостоятельных проб и ошибок или доверитесь профессионалам, полезно знать, каким логотип сайта быть не должен:
- Многоцветным. 1-2 цвета, если в их большее количество не заложен специальный смысл.- Непонятным. Этот момент удобно тестировать на фокус-группе.
- Неоднозначным. Спросите у других людей, что они видят на картинке. Переверните лого и оцените, не создает ли вид вверх ногами нежелательные смыслы.
- Визуально громоздким.
- Основанным на смысловых клише: холод — снежинка, авиакомпания — самолет, турагентство — пальма под солнцем.
Логотип на сайте должен привлекать, удивлять и рассказывать историю своего бренда. Причем рассказывать целевой аудитории: думайте о ее чувствах, потребностях и опыте, когда утверждаете новый фирменный знак своего бизнеса.