Маг Студио

Уебсайтовете имат две основни цели: да бъдат лесно разбираеми за всеки потребител и да го накарат да извърши определени действия, като например да се регистрира и да използва определена функция, или пък да купи определен продукт.

Това изправя usability експертите и дизайнерите пред голямо предизвикателство, а именно да въздействат на потребителя още преди да е прочел пълния текст, описващ на каква страница се намира.

Много уебсайтове получават големи количества трафик, но въпреки това не успяват да продадат продукта или услугата, за които са предназначени. И много често техният проблем е в това, че потребителите им не са съвсем сигурни каква трябва да бъде следващата им стъпка, тоест целият трафик трябва да бъде насочен към подходящата страница и елемент от нея.

Затова създаването на подходящи call-to-action елементи е важна стъпка към постигането на реални продажби. Тяхното изграждане се осъществява в 5 основни стъпки: размер, форма, цвят, ефекти, позиция и текст.

Размерът е първото нещо, което трябва да вземете предвид. Той трябва да бъде съобразен с големината на останалите елементи от уебсайта ви и обикновено да бъде по-голям от тях, за да е по-видим, тъй като трябва да е основната цел на потребителите. Подходящата големина е точно такава, че той да бъде лесно забележим дори още с влизането в уебсайта, но не толкова голям, че потребителите да го игнорират като елемент, с който не могат да взаимодействат. Имайки предвид това – колкото по-голям е call-to-action бутонът, толкова по-важен изглежда. Тоест ако имате повече от един, можете да използвате това, за да ги подредите по важност.

Следващият аспект, който трябва да обмислите, е неговата форма. Той трябва да накара потребителя да го натисне. За целта най-подходящо е да изглежда като бутон, а не просто линк, тъй като бутоните не могат да останат незабелязани. Заострените ъгли са добра идея само при нестандартни форми, защото в противен случай рискувате елементът да изглежда като банер и да остане игнориран.

Цветът трябва да е констрастен – достатъчно ярък и да не бъде използван другаде, но все пак в съответствие с уебсайта. Експериментирайте докато намерите най-подходящия му вид. Не използвайте прекалено много цветове, за да не отвлечете вниманието с други елементи. Колкото по-ярък е, толкова по-лесно се вижда.

Позицията на бутона е последният дизайнерски фактор, който трябва да вземете предвид. Call-to-action бутонът трябва да бъде поставен на централно място, препоръчително на главната страница, а около него да има пространство, за да бъде по-лесно забележим. Лоша практика е необходимостта потребителите да scroll-ват надолу из страницата, за да стигнат до него.

Текстът  ще бъде вашата финална стъпка. Шрифтът, използван за бутона, е редно да бъде различен. Ако сметнете за необходимо, можете да последвате примера на Skype, където около бутона се споменава за безплатни аудио и видео разговори, чат и ниски цени за останалите услуги. Използвайте в бутоните глаголи, например „изтегли”, „купи” или „вземи”, както и думи като „сега” и „безплатно”. Целта е следващата страница да изглежда близо и да е достъпна за всички.

Нека разгледаме няколко популярни примера. Може би най-популярният от тях са бутоните на Mailchimp – популярната услуга за email маркетинг.

Целта на услугата им са регистрациите. Особеното в този случай е, че бутонът за регистрация е с по-малък контраст, съответно по-малко видим за потребителите. Целта на това  е техните потребители всъщност да използват услугата им, тоест предварително да разберат в детайли за какво става въпрос. Освен че изпълняват целта си, повишават conversion rate-a, тъй като по този начин по-голямата част от потребителите им всъщност попада в целевата група.

Примера със Skype от по-горе:

Бутон с много пространство наоколо и текст, който кратко и ясно обяснява как този софтуер ще улесни живота на потребителя, а освен това цели и да разшири целевата група чрез промотиране на услуга към хора, които не използват Skype.

А ето и пример с подхода на Mozilla, който обобщава всичко казано дотук:

За обобщение ще кажем – ако искате да увеличите своя conversion rate, използвайте добре направени call-to-action елементи. Обяснете на потребителя в рамките на едно изречение какво предлагате и му предложете следващото действие. Това, при подходяща реализация, със сигурност ще доведе до повишаване на продажбите.

От над година идеята за “dislike” бутон във Facebook се радва на голяма популярност. За Firefox дори се появиха и добавки, които позволяват на всички, които ги използват, да виждат „dislike” бутон.

Днешната ни статия е вдъхновена от много източници и въпреки че всичко тръгва от Facebook, той не е основната ни тема. Днес тя е потребителско отношение, малко психология и usability.

Наблюдавайки по-успешните сайтове, постигнали успехи в глобален мащаб, виждаме, че основното, което потребителите правят в тях, е да споделят ресурси, мисли и събития – като цяло информация, която харесват или ги е заинтригувала по някакъв начин. Съответно се радват, когато споделената от тях информация бъде харесвана и предавана нататък. Коментарите остават единственият начин да се изрази недоволство и обикновено предизвикват спорове ако са конкретни, или пък допълнителни негативни реакции ако просто изразяват определено необосновано чувство. При всички случаи, обикновено негативните коментари са или избягвани, или представят прекалено очевидна гледна точка, която обезсмисля спорове.

Изводът е лесен: потребителите обичат да спорят и не е необходимо много, за да започне дебат по някоя тема.

Повечето големи уебсайтове окуражават позитивното отношение по всяка тема. Например, Facebook няма “dislike” бутон откакто съществува. Поради засилените заявки за такава функция, основателят Mark Zuckerberg обяви, че това нововъведение е обект на вътрешни дискусии и определено има шанс да се случи. От една страна това ще утвърди тяхната репутация на компания, подкрепяща иновациите. Едновременно с това ще покаже, че се доверяват на исканията на потребителите си. От друга страна, това отчасти е заплаха за тях – сайтът им може да стане извор на негативни емоции. И след като потребителите разберат, че идеята не е била добра, Facebook могат да премахнат опцията, заставайки зад тезата, че идеята не е била достатъчно успешна.

В горния параграф ключовите думи са: окуражаване, позитивизъм, утвърждаване, подкрепа, иновация, доверие, емоции, успех и… само веднъж негативизъм, но това е точно защото той е темата ни.

И така, нека се насочим към известни уебсайтове, които имат подобна функция. На първо място се сетих за популярния Digg. Както знаете, това е сайт за споделяне на интересна информация, който има български еквиваленти (за тях ще споменем после).

На първо място забелязваме заглавието и снимката, а след това и колко хора са харесали публикацията. И там някъде отдолу, виждаме линк с бледа икона, неясен текст, който се намира в позиция напълно изолирана от останалите елементи. За какво служи той? Смъква един глас от оценката на публикацията. И единственият начин, по който може да стане по-незабележим, е да се зарови сред безброй много други икони, или пък да се премахне ицяло.

Нека разгледаме старата версия на един популярен роден уебсайт.

В този пример се залага на по-директен подход. В случая бутонът за положителен глас е в ярък цвят. Допълнителен акцент се постига чрез очакването на hover ефект (ефект при посочване), както и чрез „изпъкналата” форма. Бутонът за отрицателен глас не е на фокус, защото създава усещане, че не може да бъде натиснат. А в новата версия на сайта просто беше премахнат.

Следва един малко по-интересен пример. Youtube.

Тук бутонът за отрицателен глас е реализиран по по-различен начин, но и има друга цел: да предпазва сайта от нежелано съдържание. Тоест дав възможност на потребителите да гласуват за това, което не искат да четат. При достигане на малък брой негативни реакции, коментарът просто се скрива.

Така бутонът “dislike” всъщност придобива функционалност, която е много по-малко видима за потребителят. Неговата цел не е да изрази негативното си отношение към конкретна тема, а да покаже, че не харесва определен вид съдържание. Неговата цел е не провокира спорове и отрицателни реакции. Неговият смисъл не е назован конкретно, затова целта му е точно обратната: да ги избягва.

Затова за присъствието му във Facebook според нас съществуват три варианта. Първият е да бъде въведен във вида, който последно описахме. Вторият е да бъде въведен като пряко изразяване на отрицателна реакция, но само за да се сложи край на исканията за него.  И третият е чрез usability техники (подобно на Digg) да бъде достатъчно невидим.

Така в крайна сметка излиза, че колкото и интересно да изглежда негативното отношение по даден въпрос, в крайна сметка позитивизмът се оказва по-интересен в дългосрочен план, а и по-приятен за четене. Той е ключът към успеха.