• UI & UX

Принципът на Парето в уеб дизайна - създайте по-ефективен уебсайт с правилото 80/20

  • Lene Wandrey
  • 9 min read
Принципът на Парето в уеб дизайна - създайте по-ефективен уебсайт с правилото 80/20

Проблемът с перфекционизма в уеб дизайна

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

Какво представлява принципът на Парето?

Правилото 80/20, наричано понякога принцип на Парето, гласи, че 80% от последиците се дължат на 20% от причините. Принципът на Парето е въведен за първи път от италианския икономист Вилфредо Парето през 1895 г., когато той забелязва, че 80% от богатството на Италия се притежава от едва 20% от населението. Той също така забелязал, че 20% от граховите шушулки в градината му произвеждат 80% от граха! Принципът на Парето предполага, че няколко ключови елемента са отговорни за производството на по-голямата част от даден резултат. Оттогава насам той е приложен в много други области, включително бизнес, икономика, психология, и дори може да бъде практически приложим в ежедневието.

Това се отнася и за по-малките примери; забелязали ли сте някога, че по-голямата част от приходите ви идват от шепа едни и същи постоянни клиенти? Или че винаги носите едни и същи дрехи, докато по-голямата част от гардероба ви не се използва? Въпреки че съотношението не винаги е точно 80/20 и винаги има изключения, то е чудесен инструмент, който помага на хората да определят кои действия имат най-голямо въздействие върху техния успех и да ги приоритизират по съответния начин.

Принципът на Парето в уеб дизайна и цифровия маркетинг

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

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

Devices popularity

Dashboard with website analytics data

Какво може да се направи с тази информация, за да се подобрят продажбите на този клиент?

В този пример най-бързата победа би била да се подобри мобилното изживяване на този уебсайт, който първоначално е бил създаден за настолни компютри. Биха могли да се изследват топлинни карти на всички страници, за да се научи повече за предпочитанията на потребителите. Например най-често кликаните въпроси от раздела с често задавани въпроси могат да бъдат преместени на началната страница, вместо да бъдат скрити. Продуктите с висока печалба биха могли да бъдат представени в областите на страницата, където има вероятност да се появят най-много кликвания.

Винаги започвайте с въпроса "Защо

Always start with the Why (Източник на изображения: Envato Elements)

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

Запознайте се с Ranktracker

Универсалната платформа за ефективна SEO оптимизация

Зад всеки успешен бизнес стои силна SEO кампания. Но с безбройните инструменти и техники за оптимизация, от които можете да избирате, може да е трудно да разберете откъде да започнете. Е, не се страхувайте повече, защото имам точно това, което ще ви помогне. Представяме ви платформата Ranktracker "всичко в едно" за ефективна SEO оптимизация

Най-накрая отворихме регистрацията за Ranktracker напълно безплатно!

Създаване на безплатен акаунт

Или влезте в системата, като използвате данните си

Запитайте се: Защо съществува този уебсайт? Кои ще бъдат крайните потребители на уебсайта и как ще взаимодействат с него? Как уебсайтът ще създаде стойност и успех за вашия клиент? Как клиентът ще измери този успех? Как уебсайтът ще привлича посетители и ще събира потенциални клиенти? Когато можете да отговорите на тези въпроси и разберете "Защо", ще ви бъде по-лесно да определите приоритетите на елементите на дизайна "Какво" и "Как". Когато можете да визуализирате желания резултат, това ще ви помогне да концентрирате енергията си върху най-важните области за постигането му.

Възприемане на подхода на минималния жизнеспособен продукт в уеб дизайна

При толкова много решения, които трябва да се вземат при проектирането на уебсайт, може да е трудно да се ориентирате откъде да започнете. Подходът на минималния жизнеспособен продукт (MVP) включва изграждането само на основните елементи на уебсайта веднага и след това непрекъснатото им усъвършенстване чрез обратна връзка с клиентите с течение на времето. Обикновено това се прави, за да се спестят разходи и време, или когато бизнес идеята се основава на много предположения. Вместо да се опитват да направят всичко наведнъж, разработчиците могат да приоритизират функциите въз основа на нуждите на клиентите и да създадат прототипи възможно най-скоро. Дори когато не сте притиснати от времето или бюджета, възприемането на уебсайта като MVP е фантастичен начин да приложите принципа на Парето и да се преборите с перфекционистките тенденции. Психически ви помага да знаете, че винаги можете да добавите повече функции по-късно, но че засега трябва да се съсредоточите върху най-важните елементи.

Проектирането за мобилни устройства може да ви помогне да опростите уебсайта си

Когато проектирате уебсайт, искате да осигурите на потребителите ефективно и интуитивно преживяване. Най-добрият начин да постигнете това е да проектирате с подход "mobile-first". Тази концепция включва създаването на уебсайтове, които са оптимизирани първо за мобилни устройства, а не за настолни уебсайтове, които са адаптирани за мобилни устройства. Защо е необходимо това? Според techjury.net през 2022 г. мобилните телефони ще генерират 60,66% от трафика на уебсайтове, докато настолните компютри и таблетите заедно ще отговарят за 39,34%. Това може да варира в различните индустрии и при различните уебсайтове, но тенденцията си заслужава да бъде отбелязана. Като фокусирате дизайна си върху мобилната версия на сайта, можете да увеличите шансовете за успех във ваша полза.

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

Направете проучване и анализирайте уебсайтовете на конкурентите

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

Проучванията трябва да включват проучване на съществуващите индустриални стандарти, целевите аудитории и предпочитанията на потребителите чрез анализ на конкурентите. Можете да откриете конкуренти, като попитате клиента или като направите собствено търсене и видите кои уебсайтове се класират на първите места. След като идентифицирате някои конкуренти, се нуждаете от надежден източник на данни за тях. Една от любимите ми функции на Ranktracker е възможността да добавяте свои собствени идентифицирани конкуренти и той ще показва резултатите на конкурентите в колона до резултатите на собствения ви домейн. Ако даден конкурент ви изпреварва за собствените ви ключови думи, си струва да анализирате неговия уебсайт, за да се поучите от него. За да добавите конкурент, просто поставете неговия URL адрес.

Add competitors in Rank Tracker

Rank Tracker board

Кликнете за една чудесна подробна статия за това как да извършите анализ на конкуренцията.

Запознайте се с Ranktracker

Универсалната платформа за ефективна SEO оптимизация

Зад всеки успешен бизнес стои силна SEO кампания. Но с безбройните инструменти и техники за оптимизация, от които можете да избирате, може да е трудно да разберете откъде да започнете. Е, не се страхувайте повече, защото имам точно това, което ще ви помогне. Представяме ви платформата Ranktracker "всичко в едно" за ефективна SEO оптимизация

Най-накрая отворихме регистрацията за Ranktracker напълно безплатно!

Създаване на безплатен акаунт

Или влезте в системата, като използвате данните си

Докато проучвате, направете "списък на мечтите" с всички възможни функции и елементи, които бихте могли да включите (не се притеснявайте, ще ги ограничите, но е полезно да имате всички идеи заедно).

Планиране: Идентифициране на ключови характеристики на дизайна

Planning: Identifying Key Design Features (Източник на изображения: Envato Elements)

Дизайнът на даден уебсайт трябва да се основава на неговото предназначение. Разгледайте всички елементи/функции от списъка с мечти и изберете тези, които смятате, че ще помогнат на клиента да постигне целта си. Вземете празен лист хартия и започнете да чертаете груби wireframes за вашия уебсайт. Върху телеграфните си схеми свържете всеки елемент, който планирате да включите, с резултат: ако не можете да намерите ясна цел за него, изхвърлете този раздел. Не мислете за естетиката на дизайна, а се съсредоточете върху това, което е най-добро за потребителското изживяване и използваемостта.

Противно на общоприетото схващане, не е необходимо първите ви структурни модели да бъдат проектирани с помощта на модерен софтуер за проектиране. Аналоговият подход с молив и хартия ще работи отлично, а понякога дори по-добре, тъй като не се разсейвате от самия софтуер. Хартията е по-щадяща и не толкова постоянна; тя се използва по-бързо, което може да помогне по време на творческия процес. Ако трябва да представите wireframes на клиента си, това може да бъде направено по-професионално, след като сте работили върху грубите рисунки.

Първо направете макет, не проектирайте в уеб платформата, за да спестите време

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

Работете със съдържание, което ще се класира добре в търсачките

Понякога клиентът настоява да започнете проектирането със "заместващ текст", тъй като смята, че ролята ви е да проектирате само естетическите елементи. Ако е възможно, избягвайте да работите по дизайна с общ текст за място. Въпреки че дизайнът ви може да изглежда красив, уебсайтът ви няма да има смисъл, ако пренебрегнете ключов елемент като добре написаното съдържание.

Запознайте се с Ranktracker

Универсалната платформа за ефективна SEO оптимизация

Зад всеки успешен бизнес стои силна SEO кампания. Но с безбройните инструменти и техники за оптимизация, от които можете да избирате, може да е трудно да разберете откъде да започнете. Е, не се страхувайте повече, защото имам точно това, което ще ви помогне. Представяме ви платформата Ranktracker "всичко в едно" за ефективна SEO оптимизация

Най-накрая отворихме регистрацията за Ranktracker напълно безплатно!

Създаване на безплатен акаунт

Или влезте в системата, като използвате данните си

Уебсайтът е ценен само ако е посещаван, а оптимизацията за търсачки (SEO) е начинът, по който търсачките намират уебсайта ви органично. Изборът на формулировка, която се използва на дадена страница, е от решаващо значение за SEO, а елементите на дизайна трябва да подкрепят формулировката. Ако предварително знаете какви са ключовите думи, това ви дава допълнителна представа. Ако работите с копирайтър за вашето съдържание, уверете се, че той е запознат със SEO. Дори и да не сте експерт по SEO, запознайте се с тази тема, за да сте по-наясно с нея по време на процеса на уебдизайн.

Някои инструменти за търсене на ключови думи са сложни (особено ако сте начинаещи в SEO), но Ranktracker Keyword Finder е много прост и интуитивен: просто добавяте ключовите думи в списък и той показва резултатите, кодирани в цвят по трудност на ключовите думи. За добра SEO оптимизация искате да избирате ключови думи с ниска конкуренция, но с достатъчен обем на търсене, затова е много полезно, че обемът на търсене се показва точно там.

Keyword Finder

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

Опростяване на избора на шрифтове, цветове, йерархия и визуални елементи

Ако сте по-малко опитен дизайнер или просто искате да спестите време, е полезно да работите с шаблони и да ги използвате като основа. За CMS като WordPress има хиляди чудесни шаблони на разумни цени. Те вече имат шрифтове, цветове, йерархия и визуални елементи, проектирани в съгласуван стил. Ако се притеснявате за оригиналността, бъдете сигурни, че вашият резултат ще изглежда различно от шаблона, тъй като го адаптирате към вашите телеграфни рамки. Наличието на някои дизайнерски активи и общ стил, с които да започнете, наистина може да ви помогне да намерите посока и да намали умората от решенията. Не включвайте твърде много цветове: спокойно можете да ограничите цветовете на уебсайта си до 2 цвята или максимум 3. Вижте " 20-те най-добри цветови комбинации, които да опитате на вашия уебсайт " за някои чудесни идеи и тенденции при избора на цветове за уебсайта.

Заключение: Максимално въздействие

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

Започнете да използвате Ranktracker... безплатно!

Разберете какво възпрепятства класирането на уебсайта ви.

Създаване на безплатен акаунт

Или влезте в системата, като използвате данните си

Different views of Ranktracker app