Успешни целеви страници 15 примера за дизайн, които трябва да видите
Не е толкова лесно да създадете привлекателна целева страница, която също работи така, както искате.
Има много различни неща, за които трябва да внимавате, за да имате страхотна целева страница. Кои точно това са, зависи - както и много други - от целта на вашата целева страница.
Вземете за пример дължината на формуляра: формулярът е само един от безброй елементи на целевата страница, които трябва да промените. И ако следвате най-добрите практики, ще откриете, че няма „правилна“ или „грешна“ форма на дължината. Кратките и дългите форми могат да работят еднакво добре - всяка зависи от това дали предпочитате да генерирате много потенциални клиенти с (потенциално) по-малък интерес или по-малък брой потенциални клиенти с повече интерес.
Преди да започнете да създавате свои собствени целеви страници, първо трябва да разберете какво прави добрата целева страница - и да използвате примери, за да получите представа за това как тези отделни елементи се прилагат ефективно. При търсенето на примери за успешен дизайн на целеви страници обаче забелязахме, че едва ли има модерни, впечатляващи целеви страници, които предлагат нещо повече от начална страница с регистрационен формуляр. Това беше причината да съставим този списък с целеви страници, които ни убедиха по отношение на дизайна.
Бележка предварително: Ние нямаме достъп до статистиката на тези страници. Следователно не можем да правим изявления за това колко посетители, потенциални клиенти и клиенти в крайна сметка ще бъдат преобразувани на тези целеви страници. Това са примери за успешна комбинация и интеграция на отделни елементи на целевата страница. Разбира се, ако искате сами да изпробвате една от тактиките, представени в следващия пост, не можете да знаете предварително дали ще работят. Така че девизът е: тест, тест, тест!
Успешни целеви страници: 16 примера за дизайн, които трябва да видите
1) Вистия
Първият кандидат е целевата страница на Wistia, където посетителите могат да се регистрират за безплатен акаунт. Погледът веднага пада върху кратката форма за създаване на акаунт, която със своите бели полета се откроява перфектно на синия, минимално шарен фон.
Поради дължината на полето на формуляра в комбинация с привлекателното разположение, посетителят веднага знае за какво става въпрос: създаване на акаунт. И ако все още се колебаете, можете да превъртите надолу и да прочетете отговорите на често задавани въпроси там. Тъй като тези две области са проектирани в противоположни цветове, вие като посетител можете лесно да поддържате общ преглед и да не изпускате от поглед формата - идеално за обменния курс!
2) Отскачане
Не е изненадващо, че следващото място в нашия списък е: Unbounce! В края на краищата тази компания ни е впечатлявала в миналото със своя опит в целевите страници и оптимизацията, ориентирана към преобразуване. Тази целева страница несъмнено има много успешни елементи, два от които бихме искали да подчертаем: 1) Стрелката, насочена от посоката на поддържащите изображения към бутона CTA и 2) подробната - но добре опакована - информация под формата.
Точка 1 (стрелката) незабавно информира посетителите за целта на страницата: те трябва да попълнят формуляра! И цялото нещо работи, без да се натрапва особено. Финото насочване на посетителите през дадена страница е изкуство само по себе си и Unbounce го прави перфектно. Точка 2 (подробната информация) също предлага предимства за страницата от гледна точка на SEO, тъй като търсачките имат повече съдържание, което могат да индексират. В същото време посетителите, които биха искали да научат повече, преди да разкрият своите данни за контакт, са доволни - и хитрото разположение на тази информация не отклонява вниманието от формата.
3) IMPACT брандиране и дизайн
Предварително: Да, IMPACT е партньор на HubSpot! Но не затова ги включваме в нашия списък. Целевите страници на IMPACT отдавна се считат за източник на вдъхновение за успешен дизайн. Опростеното оформление на страницата, от голямото заглавие и подробното изображение на характеристиката до рамката, която заобикаля формата, до цветовете и шрифтовете, които са много лесни за очите, всичко тук е успешно.
Може би сте забелязали и полето, за да се абонирате за блога? Проверява се по подразбиране! Моля, обърнете внимание, че въпреки че полето за абонамент във формуляра на целевата страница е чудесно за привличане на нови абонати, препоръчваме да не поставяте отметка в квадратчето по подразбиране, за да могат потребителите да изберат дали да се абонират искам. В противен случай рискувате да добавите твърде много незаинтересовани абонати към вашата база данни с контакти .
4) WebDAM
Целевата страница на WebDAM несъмнено има много хубави елементи, но нашият (безспорен) фаворит е формата. Той се вписва безпроблемно в структурата на страницата и по този начин изглежда като естествен компонент, който въпреки това се откроява визуално поради цвета на фона. Поставяйки формуляра до изображение, което само по себе си не предоставя съществена информация, потребителите не се разсейват и цялото внимание е насочено към формата. Бутонът за подаване е пурпурен на цвят (допълващ цвят до тюркоазено синьо) и се откроява и насърчава посетителите да изтеглят офертата.
Под формата на обещанието на компанията за изпълнение е обобщено накратко в три точки. Освен това този текстов блок действа като визуално отделяне от горната форма. Първокласна работа, WebDAM!
5) Bills.com
Често се приема, че целевите страници са статични страници на уебсайт. Но не е задължително да е така. С подходящите инструменти целевите страници също могат да бъдат проектирани интерактивно и персонализирани.
Например, разгледайте следния пример от Bills.com. Първо, трябва да отговорите на три въпроса, за да стигнете до формуляра. Това ще изясни предварително дали изобщо имате нужда от съвет. На първо място, посетителите трябва да посочат какво е тяхното ниво на дълга:
Това е последвано от още два въпроса, като например: Б. Тук („Имате ли просрочие при плащанията си?“):
И стигнахте до действителния формуляр на целевата страница, където ще бъдете помолени да въведете вашите данни:
Независимо от това как работи алгоритъмът (ако изобщо има такъв), подходът понякога кара посетителите да се чувстват малко нервни, че може да не отговарят на условията за съвет. Когато след това видите формата, релефът се задава и попълването на формуляра е много лесно. Вярваме, че поради изключителността на офертата (била тя истинска или фалшива), Bills.com има доста висок процент на конверсия.
6) Трулия
Trulia го прави на целевата си страница по подобен начин на Bills.com. Там започвате с проста форма, която иска „адрес“ (който не звучи толкова натрапчиво като „вашият адрес“, въпреки че се има предвид точно това). Под опростеното поле на формуляра има оранжев бутон, който се откроява добре на фоновото изображение на формуляра. Текстът на CTA конкретно посочва, че ще бъде направена индивидуална оценка за вашия имот.
Разбира се, адресът не е достатъчен, за да се определи стойността на даден имот. Всъщност се записват само местоположението и околностите. Поради тази причина, следващите въпроси относно самия имот, като броя спални и бани, следват на следващата страница. По-долу ще видите текста „Кажете ни къде да изпратим отчета“ - с бележка, че с въвеждането на тази информация се съгласявате да бъдете свързани с агент за недвижими имоти. Това е чудесен пример за компания, която добавя стойност към своите посетители, като същевременно посочва какво да очаква.
7) Basecamp
Basecamp има обширна целева страница с много информация в и под директно видимата зона. По-голямата част от информацията е в текстова форма, което също води до това, че единственият визуален елемент на страницата, формата, се откроява още повече. И тук процесът на регистрация е толкова лесен, колкото и с просто въвеждане на вашия имейл адрес или влизане с помощта на вашия акаунт в Google.
Със заглавието, изброяващо броя на компаниите, регистрирали се за Basecamp през предходната седмица, и препоръките на клиентите, Basecamp разчита изцяло на социални доказателства, за да постигне желаните реализации. Ефектът на подчертаване в препоръките на клиентите, който изглежда е използван тук, е допълнителен акцент върху точките, които Basecamp би искал да рекламира особено.
8) Зендеск
Харесва ни целевата страница за безплатната пробна версия на Zendesk, тъй като тя е опростена и опростена както по отношение на текста, така и по дизайн. Единствените неща, които наистина се открояват, са двата CTA бутона - и яйцето отгоре, което се движи така, сякаш мацка е на път да се излюпи. Самата форма е проста и изисква само професионалния имейл адрес и парола, за да може да се създаде акаунт. Влизането с помощта на вход за Google Apps е още по-лесно. Предоставянето на тази опция винаги се препоръчва, защото това скъсява още повече пътя на преобразуване и обикновено има по-нисък праг на инхибиране за потребители, които вече имат профил в Google.
9) уеб печалби
Какво ще кажете за малко по-дълга целева страница за промяна? Само с няколко трика дори и най-дългата целева страница може да създаде впечатлението, че е кратка. Webprofits ни показва как да го направим.
В горната част има видно поставено поле за формуляр за имейл адрес, което се откроява добре на фона и следователно вече е забележимо само по себе си. Ако искате веднага да оставите данните си, трябва само да въведете имейл адреса си и останалото поле на формуляра ще се появи магически. Тъй като пълният формуляр не се показва веднага, страницата не изглежда толкова сложна.
Освен това на пръв поглед можете да видите какво всъщност прави Webprofits. Останалата част от страницата предоставя подробна информация за това, което получавате, когато въведете данните си. Освен това CTA се поставят навсякъде в стратегически точки, с които посетителите могат да се върнат в горната част на страницата.
10) Входяща емоция
Тази целева страница на испански е от партньор на HubSpot. Подобно на примера от Basecamp, формулярът се поставя на видно място и винаги остава във видимата област, дори когато посетителите превъртат надолу. Също така харесваме графичните ръце, които показват на посетителите къде да въведат данните си или къде да споделят страницата с други.
11) H.BLOOM
Понякога просто искате да оставите целевата страница да ви седне известно време, защото е толкова красива. H.BLOOM прави точно това с фотография с висока разделителна способност и много свобода - вече не искате да отклонявате поглед.
В допълнение към привлекателния дизайн, сайтът има и няколко чудесни елемента за преобразуване: формуляр в директно видимата област, ясно и кратко обяснение на това, което се случва след попълването на формуляра, и оранжев бутон за изпращане. Има само едно нещо, което бихме променили: текстът на бутона за изпращане, така че да се отнася по-конкретно към офертата.
12) Velaro Live Chat
Понякога най-малките неща правят най-голямата разлика. Такъв е случаят например с целевата страница на Velaro Live Chat.
Малкият PDF символ в изображението на елемента е фина индикация за формата, в който се предлага офертата. Стрелката пред подзаглавието насочва вниманието на посетителя към текста, който трябва да бъде прочетен. Както при IMPACT, има автоматично отметнато квадратче за абонамента за бюлетин, което като опция за включване е чудесен начин да спечелите нови абонати. Всички тези малки детайли, които на пръв поглед изглеждат незначителни, допринасят за отличен, функциониращ дизайн на целевата страница.
13) Конверсионна лаборатория
Обикновено не бихме посочили начална страница с формуляр като пример за страхотна целева страница. Правим изключение на този уебсайт по основателна причина! Началната страница е пълният уебсайт и навигационните връзки ви отвеждат само до информацията по-надолу по страницата.
Всичко, което трябва да направите, е да кликнете върху „Получаване на помощ за целевите страници“ и целият уебсайт ще се премести на една страна, освобождавайки място за формуляра. Ето как изглежда преди щракването:
След като щракнете върху CTA, формулярът се показва:
Фактът, че не е нужно да напускате страницата, за да попълните формуляра, осигурява безпроблемно потребителско изживяване. Освен това формата се поставя много ненатрапчиво.
14) Индустриален маркетинг за якост
Тази целева страница веднага предизвиква интереса на посетителите с провокативното си заглавие. Защото там е ясно написано: „Не ме карайте да мащабирам“ (приблизително: „Спрете мащабирането!“). Тук е адресиран често срещан проблем, който повечето от нас имат, когато сърфират в мрежата със смартфон или таблет - и изявлението умишлено се държи в леко провокативен тон.
Но това не е единственият интересен елемент на тази целева страница. Забелязахте ли как червеният цвят беше стратегически поставен? Например, над и под формуляра, което ще ви доведе по-близо до преобразуване.
Този дизайн има и решаващо предимство: Изглежда страхотно и на мобилни устройства. Защото винаги трябва да имате предвид, че много посетители имат достъп до вашите целеви страници със своите смартфони или таблети. Ако дизайнът не е правилен, те могат бързо да напуснат сайта ви.
Хората от Industrial Strength Marketing направиха полето на шрифта и формуляра достатъчно голямо, за да не се налага посетителите да увеличават, за да видят неща като: Б. четете текста или взаимодействайте със съдържанието. (Прочетете тази публикация в блога, за да научите какво представлява дизайна на уебсайта за добро потребителско изживяване.)
15) Shopify
Подобно на много от другите примери в тази публикация, Shopify се стреми към опростяване, без излишни украшения за своята целева страница за пробното пускане. Например заглавието, ориентирано към потребителя, се състои само от няколко думи, подзаглавието („Доверено от над 325 000 фирми по целия свят“, например: „Над 325 000 компании по целия свят ни се доверяват“) включва социални доказателства и изображенията показват, че потребителите използват продукта може да се използва на всички устройства. Всичко, което трябва да направите, е да предоставите своя имейл адрес, за да започнете. Ето как бързо стигате до истинската точка: Продажба на продукти онлайн - с инструмента от Shopify.
Черешката на тортата? Целевата страница е оптимизирана за всяко устройство, както по отношение на дизайна, така и по отношение на функционалността. Отзивчивият дизайн е тайната!
Имате ли и вдъхновяващи примери за страхотни целеви страници? Моля, оставете ни коментар с вашите любими!