БИБЛИОТЕКА ЗНАНИЙ

«Если каждый день уделять 15 минут на совершенствование своих знаний и навыков, то уже через 1 год Вас невозможно будет догнать»

Основатель «Graf holding», Игорь Граф

 

 

 

Самое увлекательное руководство по созданию лендингов. Часть Пятая

Следующая часть статьи Оливера Гарднера, посвященная созданию и оптимизации лендингов



 

Дизайн — это вам не хухры-мыхры

 

Поздравляю тебя, мой дорогой читатель! Ты добрался аж до пятой части статьи Оливера Гарднера! Все понравилось?


Самое вкусное еще впереди! Особо нетерпеливые лингвисты могут осилить эту статью в оригинале.

Краткое содержание предыдущих частей:

 

  1. Я покажу вам единственно логическую связь страниц захвата landing pages для маркетологов.
    А также «Иммодиум» для космонавта с диареей. Жизненно важно.
  2. К доске!
    Доказываю, почему контекст, а не контент, царь и бог конверсии.
  3. Любите формы подписки своей как самое себя.
    Насильно мил не будешь и заставить какую-то форму полюбить что-то – очень и очень трудно.
  4. На полпути к нашей цели, мы пригубим какого-нибудь виски.
    Наподобие «Канадского Клуба», как Дон Дрейпер (персонаж американского телесериала «Безумцы»: креативный директор рекламного агентства, – прим. пер.) и будем учиться писать продающие тексты как безумцы.
  5. «Нарисуй мне какую-то милую картинку».
    — «Мам, иди на фиг…Дизайн – это тебе не лютики-цветочки!»
  6. «Если я попрошу добавки, сочтут ли меня жадным?»
    Нет, даже если вас зовут Оливер (персонаж Оливер Твист из одноименного романа Диккенса – прим. пер.) Когда дело касается конверсии, – всегда просите больше.
  7. Я достаю из широких штанин…
    Лендинги: большие да малые, хорошие и плохие, – и буду троллить их до полу смерти.

 

5. Теория дизайна за 3 минуты

 

То самое чувство, когда тебе говорят, что главное в дизайне — прикольная картинка

 

Не поймите меня правильно. Я люблю бабочек, цветочки, единорогов, радугу.


И, конечно же котов.. Но всему же есть свое время и место.

537a57ce311bf6.19083582

Табличка must have над кроватью каждого дизайнера

 

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


Это включает мой альтруизм. Я сравниваю это со спасением щенка. Это мой дизайнерский ответ «Освободите Вилли«. Я, кажется, сказал 3 минуты? Хорошо, за 150 секунд я выложу тебе Теорию Дизайна, зацикленную на повышение Конверсии.

free_willy

Поехали!

 

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


То есть, цель твоего дизайна — привлечь внимание к самому важному элементу (ам) на странице. Да читай же ты быстрей, черт возьми!

 

Принцип Первый: Направленный сигнал

 

McDonald___I_want_you___by_VictorGatmaitan

Мощность в изображении не оставляет никаких сомнений

 

Это знаковый пример силы направленных сигналов. Персонаж не просто смотрит тебе прямо в душу.


Он еще и указывает на тебя, усиливая слово ты. Или я, ориентируясь на большую пользовательскую перспективу.

 

UFC3_Hero_vf1

Следующий пример из АБЧ (Абсолютный Бойцовский Чемпионат)

 

537a57d37873c1.16678651

Пример оффлайнового бизнеса

 

537a57d52b9b45.90348152

Пример лендинга (помни, зачем мы здесь. Оливер)

 

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


Нет никакой необходимости в том, чтобы президент твоего шахматного клуба приглашал людей на игру в Монополию.

 

Шкурка выделки не стоит.

 

Принцип Второй: Инкапсуляция

 

Grumpy-old-man-looks-over-spectacles-shocked-and-disapproving-2289475

Чавой?

 

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


Посмотри на целевую страницу, представленную ниже. Что выделяется? Форма. Это было так трудно? Чертовски трудно, если посмотреть на лендинги большинства людей.

537a57d7717b13.36823202

Это так просто. Заверните!

«Если оно тебе так нравится, так женись на нем!» (Бьонс Ноул)

 

Принцип Третий: Контрастные цвета

 

big_1f2fd61126ce5db77cf85f48a809a1f7

 

Если только ты не живешь в пещере, ты наверняка читал о сплит-тестировании палитры цветов. Красный лучше всего, зеленый подходит, оранжевый — приглашает. Фтопку. Абсолютно все это. Все просто: посмотри на преобладающий цвет в лендинге и дополни его в своем CTA.


В предыдущем примере этот прием применяется дважды. Форма заполнения резко контрастирует с самой страницей, а кнопка призыва — с формой.

 

Если тебе нужна помощь с контрастными цветами, воспользуйся цветовым колесом от Tiger Color Lab.

 

 img_1801

Это Йеллоустонский национальный парк. Еще вопросы по контрасту?

 

 

 

Принцип Четвертый: Пустое пространство

 

537a57de15e2a9.39968208

Взгляд спокойно скользит по изображению и останавливается на замстывшем лосе. И ты такой: «Как миииииииииииииииииило»

 

Добавляй побольше пространства. Выделяй вещи. Ты можешь использовать любой цвет а не только белый.


Надеюсь, меня не сочтут расистом после такого заявления. Лучше сказать так: «Добавляй пробелы». Так-то лучше. Пробелы.

 

 537a57e097e081.33345197

Мне нравится этот пример из-за его доходчивости. Хотя процент посещения хромает

 

Две колонки. Улыбающееся личико. И куча пространства. Содержание — важней всего.


Но это не значит, что ты не можешь его грамотно расположить. Другой пример.

537a57e2a227c4.44500636

«Наконец-то нашел!»

 

Так точно. Нашел. По ключевым словам «самый кошмарный лендинг в истории».


Народ, не жадничайте! Еще больше пространства.

537a57e4206f36.23283757

 

Я имею в виду, что, применяя эти простые принципы в дизайне, ты акцентируешь внимание на своем призыве к действию.


Так ты можешь увидеть, насколько он силен или слаб. В конце концов, бессмысленно привлекать внимание к чему-то, что, по сути, хромает.

 

Хромают продажи?

 

ЖМИ СЮДА И ЗАБИРАЙ

Самый легкий способ анализа и повышения конверсии за 2014 год

 

28.11.14 3 322 просмотров Рубрика: Бизнес Личный блог Автор: Игорь Граф









СПИСОК ТОП-69 КНИГ ОКАЗАВШИЕ ВЛИЯНИЕ НА ИГОРЯ ГРАФА

Политика конфиденциальности > Отказ от ответственности > Согласие с рассылкой >