Юзабіліті сайту: як перестати втрачати відвідувачів і почати отримувати ліди

Підніміть руку, якщо ви вважаєте, що комерційний сайт повинен продавати. Підняли? Тепер опускайте. Продавати повинен не сайт, продавати повинні ви, але через сайт. Так що сайт – це не продавець, а інструмент для комунікації між компанією (яка продавець) та клієнтами мережі. І якщо ця зв’язка кульгає, то, яким би ви не були ідеальним продажником, продати нічого не вийде.

Уявіть приклад поганої комунікації на звичайних вхідних дзвінках – менеджери відповідають на 1 дзвінок з 10, беруть трубку тільки після 20 гудка, не вітаються, кажуть шаблонними фразами або «ллють воду», не заглиблюються у питання клієнта. Всі. Ідеальний грунт для зливу рекламного бюджету компанії. Бо жоден потенційний клієнт не пройде далі розмови з таким менеджером.

Аналогічно з сайтом – якщо він не дає зручного зв’язку між відвідувачем і компанією, користі від нього буде мало. За якість цієї комунікації і відповідає юзабіліті – зручність використання сайту.

Юзабіліті сайту складається з двох частин:

  1. Зовнішня частина, як користувач бачить сайт. Причому дивлячись на сайт, користувач бачить так і всю компанію. Сайт – це не просто набір текстів і картинок, це обличчя компанії в мережі.
  2. Внутрішня частина: те, як сайт взаємодіє з користувачем. Тут аналогічно – взаємодія сайту з собою людина сприймає як ставлення до себе всієї компанії. І тимчасово непрацююча виписка по карті в Ощадбанк-Онлайні стає плювком в душу від усього Ощадбанку.

Тепер розумієте, наскільки важливо не вдарити в бруд обличчям сайтом? По сайту та його поведінці людина буде судити про вашу компанію в цілому.

Покращуємо UI

Спочатку займемося «обличчям» – зовнішньою частиною. Ще її називають UI (User Interface) – інтерфейс користувача.

Перевіряємо такі параметри:

1. Дизайн сайту

Не обов’язково «одягати» свій сайт від Dior. Згадайте, як ви ходите на зустрічі з партнерами. Ви не кожен раз в парадно-вихідному костюмі, але все ж і не в шортах з майкою.

З сайтом все аналогічно. Якщо ваша цільова аудиторія – бізнесмени середнього рівня, беремо спокійний дизайн, без різких переходів кольору і анімації. Якщо аудиторія – молодь, додаємо яскравості і вау-ефектів. У будь-якому разі, якщо ви вирішили не залучати професійного дизайнера, зовнішній вигляд сайту повинен бути як мінімум акуратний – так би мовити, «чистий і випрасуваний», неохайність неприпустима.

Зауважте, що основна функція дизайну – покращувати сприйняття інформації і робити акценти на правильних місцях. Ні в якому разі дизайн не повинен перетягувати увагу людини з контенту на саме оформлення. Дизайн заради дизайну – бесполезнейшая річ. Вам потрібен дизайн заради зручної подачі контенту.

І ще один момент по дизайну – простежте, що всі елементи сайту на різних сторінках оформлені в єдиному стилі. Це посилання, пункти меню, кнопки, модальні вікна і т. п. тобто якщо ви використовуєте синю кнопку для цільового дії на головній сторінці (читай, наділи синій лівий носок), то і на сторінці замовлення цілком логічно поставити ту ж синю кнопку (так-так, і правий носок теж надягаємо синій).

Дивимося на приклади. Приклад 1 – сайт компанії, яка будує будинки під ключ:

Тут погано читаються шрифти, є картинки і фон, не несуть смислового навантаження. Враження від сайту – зроблений дилетантами/школярами. Екстраполюємо на компанію – значить, будують теж дилетанти.

Спробуємо змінити дизайн і додати йому акуратності (зауважте, професійного дизайнера не залучаємо):

Контент сайту (текст і картинки) залишився колишнім, але тепер ми бачимо, що з нами «говорить» вже не школяр, а більш-менш дорослий чоловік, який викликає більше довіри.

Другий приклад – це випадок, коли дизайн збиває з пантелику і дає невірне уявлення про компанію:

Перша думка – це сайт тренажерного залу. Ан-ні, це сайт інтернет-магазину спортивних товарів. Буде краще показати сам товар, а не того, хто його використовує. З точки зору відвідувача, на цій картинці якийсь тип гойдається «моєї» штангою (тобто товаром, який я хочу купити). Покажемо просто штангу, а заодно поставимо в шапку правильний логотип (на вихідному сайті він чомусь лише в середині сторінки):

Повної однозначності ми поки що теж не домоглися, для цього треба поміняти текст у картинки (цим ми займемося пізніше). Але вже краще. І тепер, принаймні, екран входить заголовок, прямо говорить про діяльність компанії.

2. Навігація

Це меню (основне верхнє, допоміжні зліва і в підвалі) і хлібні крихти. Навігація показує, що є на сайті – які товари/послуги пропонує компанія і що можна дізнатися про компанію. Оптимально використовувати 1-2 рівня вкладеності. Якщо їх більше, то буде складно орієнтуватися.

Звичне місце основного меню – в шапці сайту. Меню повинно бути єдиним для всіх сторінок сайту, за нього відвідувач розуміє, що він все ще знаходиться на одному і тому ж сайті. У розділах сайту може бути допоміжне меню (зазвичай зліва). Воно може бути різним для різних розділів.

Намагайтеся не ставити на одному рівні меню більше 6-8 пунктів. Не забувайте, що обсяг уваги звичайної людини – 5-7 об’єктів.

При наведенні миші пункти меню слід підсвічувати, щоб було зрозуміло, що з ним можна клікнути. Активний пункт меню (відповідає тій сторінці, де зараз знаходиться юзер) потрібно виділяти, щоб користувач бачив своє поточне становище.

При рівні вкладеності більше двох ставимо хлібні крихти, наприклад:
Головна » Послуги » Будівництво парканів
щоб показати всю ланцюжок, яка привела на ту чи іншу сторінку.

Повертаємося до прикладів. На сайті будівельної компанії було два меню (вгорі зліва), ми можемо об’єднати їх в одне. Пункти «Послуги» і «Ціни» об’єднаємо в один розділ «Послуги та ціни» – якось безглуздо розповідати про послуги на одній сторінці, а про їх ціни – на іншій. Пункт «Схема проїзду» приберемо взагалі, схема буде в розділі «Контакти». Розділи «Вакансії», «Партнери», «Карта сайту» теж прибираємо, основною цільовою аудиторією цього сайту вони не потрібні. Пункт «Калькулятор» прибираємо меню, робимо його окремим блоком і ставимо в правій частині сайту.

Разом отримали одне меню замість двох (тепер простіше орієнтуватися) і розширили місце під основний контент, прибравши ліву колонку.

У другому прикладі головне меню біднувато, потрібно доповнити його інформацією про оплату, новини та акції (тобто тим, що цікаво відвідувачам інтернет-магазинів). І обов’язково ставимо в основне меню каталог товарів, а до нього додамо випадаюче підменю зі списком категорій:

Читайте також  Де знайти клієнтів: 40 кроків для генерації лідів

Тепер в основному меню є сама необхідна інформація для придбання товару – власне, сам каталог, можливі способи оплати і доставки, а також новини (щоб дізнатися, наскільки «живий» магазин) та акції (а раптом якісь знижки зараз є).

3. Шапка

Це верхня частина шаблону сайту, яка залишається незмінною на всіх його сторінках. Що в ній може бути: логотип, теглайн (2-3 слова про те, чим займається компанія), телефон, адресу, режим роботи, посилання на зворотний дзвінок, посилання на групи в соцмережах, посилання на вхід реєстрацію або особистого кабінету, кошик, рядок пошуку. Також в шапку зазвичай включають і меню.

Працюємо з шапкою сайту будівельної компанії – додамо теглайн, повна назва компанії, її адресу. Щоб не заплутувати людей, залишимо тільки один номер телефону (та візьмемо міський номер, а не стільниковий). Додамо режим роботи – щоб люди знали, в який час можна телефонувати:

Тепер відвідувач бачить, що потрапив на сайт компанії, яка будує зруби і будинки під ключ, ця компанія називається «МС» і це саме компанія зі своїм офісом, а не бригада студентів.

Переходимо до інтернет-магазину. Зменшимо логотип, щоб звільнити місце під інші елементи, додамо короткий слоган до логотипу. Додамо теглайн, в ньому згадаємо регіон, в якому працює компанія. Тут аналогічно залишимо один номер телефону і допишемо режим роботи. Додатково поставимо посилання на групи ВКонтакте і в Инстаграме. І найголовніша частина у випадку інтернет-магазину – кошик, її теж розмістимо в шапці сайту праворуч (це її стандартне місце).

І знову, додавши буквально кілька елементів в шапку, ми значно допомогли відвідувачам сайту. Тепер вони можуть побачити, що це інтернет-магазин (теглайн і кошик недвозначно натякають на це) і що але працює по Іркутську і області (знову ж теглайн, та ще код міста в телефоні). Сплутати з тренажерним залом тепер просто неможливо.

4. Підвал

Він же футер – нижня частина шаблону сайту, яка так само залишається однаковою на всіх сторінках. Тут традиційно ставимо копірайт – роки роботи компанії та її повне найменування. Сюди ж дублюємо посилання та контакти з шапки, посилання на групи в соцмережах. Можемо додати посилання, які не помістилися в основне меню. Сильно не захаращувати, все ж це не балкон =)

Поточний футер у сайту з першого прикладу позбавлений сенсу:

Додамо йому користі:

Крім інформації з шапки додали посилання на розділи «Партнери» і «Вакансії» – вони можуть знадобитися приблизно 2-5% відвідувачів цього сайту, тому вони в футері. Також вказали тут додаткові телефони менеджерів (але їх ще треба буде продублювати в розділі «Контакти»).

Футер другого прикладу лише трохи інформативніше першого:

Зробимо його більш «солідним»:

Продублювали логотип і посилання з основного меню. Додали посилання на «Обмін і повернення», яка не помістилася вгорі. Додали список популярних категорій – на випадок, якщо відвідувач пропустив їх раніше. Ще раз нагадали, про телефон, режим роботи і соцмережі.

5. Контент

Про контент можна говорити майже нескінченно, тому тут коротко. Контент повинен бути корисним, без зайвої води. Ваш сайт – це рекламна брошура, а не «Війна і світ». Але й занадто коротким бути не варто. Повинна бути інформація про послуги і товари, про компанії в цілому і її працівників, про умови праці, про гарантії і виконаних замовленнях. Ніхто не захоче довіритися незнайомцеві. Сайт повинен познайомити користувача з вашою компанією.

Пам’ятайте, що контент – це не тільки тексти. Це ще картинки і відео. Вони повинні бути хорошої якості, зараз для цього цілком вистачить камери планшета (принаймні, прийнятних для фотографій). Ідеально, якщо фотографії і відео зроблені «вживу», а не взяті з інших сайтів.

Які картинки можна розміщувати – товар, співробітники, процес роботи. Наприклад, розмістіть на сайті автосервісу на сторінці «Про компанії» фото процесу лагодження двигуна і ця компанія для користувача стане вже більш знайомою, адже він побачить реальних людей в реальному приміщенні, виконують реальну роботу. З відео аналогічно можна робити відео-огляди товарів і послуг. Наприклад, записати пару відеороликів, як проходять заняття у фітнес-клубі.

Крім інформації, що прямо стосується вашої компанії, можна давати відвідувачам і інший корисний контент. Так, зараз говоримо про статтях. Прямий прибутку компанії вони не будуть приносити, але будуть підвищувати (в разі, якщо вони хороші) ваш статус експерта і джерела корисностей, а також довіру до компанії. Але вести блог варто тільки при наявності на це ресурсів (часу і фахівців). Тому що напівпорожній блог зі статтями раз у п’ятирічку зіграє тільки негативно.

До прикладів. На сайті будівельної компанії є сторінка про стрічковий фундамент:

Скажіть, навіщо вона тут? Замість неї ми можемо написати статтю, наприклад, про те, як будівельники цієї компанії робили стрічковий фундамент для одного з об’єктів. Природно, з фотографіями цього об’єкта. Така стаття вб’є двох зайців. Вона буде корисна тим, хто вирішив сам будувати будинок і шукає інформацію по фундаменту. У цьому випадку ідеальний ефект – за статтею людина розуміє, що не все так просто, вирішує все-таки звернутися до спецам і вибирає ту компанію, стаття якої справила найкраще враження. Другий заєць – стаття покаже реальних співробітників компанії в процесі будівництва. В кінці статті можна показати і фотографії готового будинку (а не тільки фундаменту), щоб люди побачили результат ваших робіт.

У статті обов’язково використовуємо фотографії – адже 50% людей хлібом не годуй, а дай тільки фотки подивитися, і навіть не важливо чиї =)

У прикладі спортивного магазину візьмемо сторінку про доставку:

Зазвичай разом з доставкою цікавлять і способи оплати, тому об’єднаємо їх на одній сторінці. Згадаємо, що у нас є промо-коди, і додамо кілька слів про них у текст про оплату. А також дамо відвідувачам невеликий інструмент для приблизного розрахунку вартості доставки в ваше місто:

Намагаємося використовувати короткі фрази і прості речення. Економимо час відвідувача, нехай краще він витратить його на перегляд ще пари-трійки товарів.

6. Тексти

І ще пару слів окремо про тексти. Є 3 важливих моменти:

  1. Конкретика. Тут все просто. Пишемо не «в нашій перукарні найнижчі ціни», а «чоловічі стрижки від 300 гривень». Уявіть, що рекомендуєте компанію найкращому другові. Йому ви не скажете «індивідуальний підхід», а дохідливо поясните – «закріпимо за тобою спеца, він буде супроводжувати всі етапи робіт і погоджувати з тобою». Не соромтеся говорити зі своїми відвідувачами таким же зрозумілим мовою.
  2. «Ви отримаєте». Описуйте не те, що ви робите, а те, як від цього стане добре клієнту. Не «ми підберемо вам кращу путівку», а «ви проведете 10 днів в місці, про яке мріяли».
  3. Цільова дія. Захопившись написанням правильного тексту, не забудьте розмістити в ньому заклик до дії – Зателефонуйте, Напишіть, Залиште заявку, Перейдіть в каталог та ін.
Читайте також  Переїзд на https: навіщо і кому потрібен, повна інструкція по переїзду на HTTPS

Поглянемо на сторінку з описом послуг нашого першого прикладу:

З конкретики – тільки список виконуваних робіт. Спробуємо додати фактів, вигоду клієнта і цільове дію:

І навіть гарантію від зриву термінів сюди додали (надто вже хворе місце, і не тільки в будівництві).

У прикладі інтернет-магазину звернемося до головної сторінки:

Зараз конкретики лише телефон, адресу та назву компанії. Не будемо додавати багато тексту, на головній сторінці інтернет-магазину він мало кому цікавий. Краще сформуємо два блоку на кшталт «Ви отримаєте». Перший – для молодих людей, які хочуть організувати домашню тренажерку (це основний напрямок цього магазину). Другий – для батьків, які хочуть організувати дозвілля дітей на дачі (т. к. літо на дворі). Цей блок явно буде сезонним. Плюс додамо конкретику про знижки.

Тут цільове дія – це клік по картці товару, тому якихось окремих кнопок немає.

7. Відгуки та кейси

Продовжуємо про контент. Відгуки та приклади робіт потрібні, щоб підвищити довіру до компанії. Добре, якщо у вас є реальні відгуки і реальні приклади роботи – не ховайте їх від людей, обов’язково додайте на сайт.

Що робити, якщо реальних відгуків немає? Стребуйте їх зі своїх клієнтів – за знижку, вкусняшку або велике спасибі. Так як світ не без добрих людей, то хоча б один з десяти погодиться дати відгук про вас (тим більше якщо за знижку), треба тільки попросити.

А якщо немає і самих реальних робіт? Ну що робити, доведеться ощасливити родичів або друзів. Наприклад, якщо відкриваєте салон краси: зробили манікюр мамі, сестрі і кращої подруги, все ретельно відзняли – ось вам і невеличке портфоліо, залишилося тільки викласти на сайт. Звичайно, такий підхід не скрізь застосуємо, будинок заради портфоліо навіть найкращому другові не побудуєш =)

До прикладів. Портфоліо від будівельної компанії. На один об’єкт – всього одна фотографія.

Це мало. Як мінімум, штук 10 фото на кожен об’єкт – на різних етапах споруди, під різними кутами. Плюс короткий опис – де, що і як будували.

Для інтернет-магазину в наш час ось так вже порожньо:

Погляд звично шукає відгуки:

8. Перший екран

Це та частина сторінки, яку ви бачите в браузері, не прокручуючи сторінку. Тобто відкрили сайт – і все, що у вікно помістилося – перший екран.

Коли користувач відкриває з пошуку відразу 5-7 сайтів, а потім послідовно переглядає їх один за іншим, він оцінює саме перші екрани. За результатами цієї швидкої оцінки 3-4 сайту закриваються відразу, інші вивчаються більш ретельно.

Тому перший екран сторінки повинен «чіпляти» – вигідною пропозицією, цікавою картинкою, попаданням в проблему або бажання клієнта.

Дивимося на прикладі. Згадаймо перший екран сайту будівельної компанії:

Чет не зачепило. Спробуємо залучити попаданням в бажання користувача:

Що хоче людина, яка шукає будівництво будинків під ключ – ось приблизно такий будинок, як на картинці, він і хоче. Для більш сильного ефекту праворуч розміщуємо форму з заголовком «Хочу додому», де можна вибрати параметри майбутнього будинку і відправити заявку на розрахунок вартості. Тут же у першому вікні вказуємо і ціну послуги.

Тепер перший екран магазину спорттоварів:

Тут юзер взагалі вирішить, що помилився сайтом. Шукав спорттовари, а відкрив сайт тренажерки. Залучати будемо пропозицією низької ціни, а також персональним закликом до дії:

Тепер ця фотографія вже не виведе нас на думку про сайт тренажерного залу. А кнопка «Вибрати собі диски» в точності відповідає бажанням, з яким користувач приходить в інтернет-магазин – вибрати собі товар.

9. Форми

Найпоширеніша форма – зворотний зв’язок, «напишіть нам». Для інтернет-магазинів – форма відправлення замовлення.

Для користувача робота з формами – не самий приємний момент, доводиться відволікатися на клавіатуру (не у всіх висока швидкість друку, а хтось ще і з телефону). Тому чим менше полів у формі, тим краще. Хоча правильніше сказати – чим менше обов’язкових полів, тим краще. Можна залишити у формі і 5-6 полів, якщо обов’язкові до заповнення тільки 2 поля. Хто не полінується і заповнить всі поля – добре, у інших потрібну інформацію випитати менеджер.

Всі поля у формі потрібно підписати (2-3 слова). Можна додати невелике пояснення або приклад заповнення. Обов’язкові поля потрібно відзначити зірочками – це вже давно стало стандартом.

Як приклад розглянемо форму заповнення заявки на розрахунок вартості:

Зверніть увагу – в блоці «Відзначте необхідні роботи» ми відразу відзначили ті пункти, які в більшості випадків точно замовляють. Під кнопкою «Відіслати» даємо короткий опис того, що станеться після відправки форми – це дає людині почуття контролю ситуації.

10. Пошук

Потрібен, якщо у вас багато товарів або послуг (частіше все ж для товарів, звичайно). Якщо в інтернет-магазині більше сотні товарів, можете спокійно додавати пошук.

Форму пошуку не приховуємо, що ставимо в шапку сайту. Результати пошуку підписуємо, скільки знайдено результатів. Якщо шукаємо за товарами, то в результатах можна відразу виводити картки товарів з фотографіями та цінами:

11. Онлайн-консультант

Корисна річ, якщо виконуються 2 умови: консультант не нав’язується і консультант дійсно працює.

Тобто кнопка онлайн-чату повинна показуватись на сайті лише тоді, коли фахівець дійсно в мережі і готовий відповісти на питання клієнта. Вся фішка онлайн-консультанта – в його оперативності.

І не варто налаштовувати «вискакування» вікна «Чим я можу вам допомогти» через 5 секунд після того, як користувач потрапив на сайт. Він тільки почав знайомитися з вашим сайтом, і питання у нього ще не виникли.

Стандартне місце кнопки онлайн-консультанта – правий край вікна (або нижній правий кут).

Читайте також  SEO просування: що було в 2018 і чого чекати в 2019 році

В якості прикладу – провокаційне запитання консультанта на сайті Мосигры:

Спливає саме після перегляду 3-4 сторінок сайту і після 20-30 секунд на сторінці – тобто коли здається, що людина зайшла в глухий кут з вибором гри.

12. Віджети соцмереж

Якщо у вашої компанії є активне представництво в соцмережах, використовуйте це на сайті.

Наприклад, покажіть відгуки з ВКонтакте:

Такі відгуки викликають більше довіри. Але важливо, щоб відгуки були свіжими.

Або запросіть відвідувачів вступити в вашу групу – можливо, людина не готовий до замовлення зараз, але хоче зберегти контакт з компанією. Додатково можна заманювати людей в групу знижкою. Або намагатися зачепити цінністю постів.

Покращуємо UX

Тепер переходимо до прихованої частини – до взаємодії. Це UX (User eXperience) – досвід взаємодії користувача.

Дивимося на:

1. Швидкість завантаження

Це теж частина взаємодії, тому не варто скидати з рахунків швидкість завантаження сайту. Якщо сайт працює повільно, користувач легко знайде більш молоду швидку заміну.

2. Відсутність помилок

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

3. Збільшення картинок по кліку

Дайте юзеру розглянути побільше картинок в повному розмірі (фотографії товарів, портфоліо тощо) – і ось він вже «завис» на вашому сайті, а каструля починає справно підсмажувати суп.

4. Валідація форм

Це перевірка, чи правильно заповнена форма. Якщо відвідувач не заповнив якесь обов’язкове поле, то виділите це поле і вкажіть, що не заповнено саме воно:

Інакше якщо користувачеві доведеться переглядати всі поля в пошуках помилки, повторної відправки може і не відбутися.

5. Повідомлення після відправки форм

Обов’язково повідомте юзеру, що дані прийняті, і коли він отримає відповідь на свій запит. Вкажіть реальний час відповіді. Не варто писати «Ми відповімо через 15 хвилин», якщо вхідні запити ваші менеджери обробляють лише раз в день.

6. Статусні повідомлення та діалоги

Перевірте всі діалогові повідомлення, які видає ваш сайт при тих чи інших діях. Можливо, що половину з них складали програмісти, тоді ви зустрінете щось на кшталт «Посилання на підтвердження відправлена в автоматичному повідомленні на вказану при реєстрації електронну пошту». Начебто й правильні слова, і мова російська, а читати важкувато.

Перепишіть повідомлення природною мовою:

7. Email-повідомлення

Те ж саме стосується і email-повідомлень. Так, сайт надсилає листи по шаблону, наприклад, повідомлення про передачу замовлення кур’єрові, але ніхто не заважає додати в них трохи людяності за аналогією з прикладом вище.

8. Динамічний контент

Це теж рід взаємодії сайту з клієнтом. Наприклад, якщо клієнт переходить на сайт з одного з ваших рекламних оголошень, то сайт може розпізнати, що це було за оголошення, і показати найбільш підходящий користувачеві контент.

Наприклад, якщо людина прийшла на сайт просто з пошуку, ми покажемо йому стандартний вигляд:

А якщо він прийшов з оголошення «Дитячі спортивні комплекси», то в слайдері ми поставимо на перше місце той із слайдів, який має відношення до дітей, та нижче блок з дитячими товарами теж поставимо першим.

Тоді конкретно цей відвідувач з більшою ймовірністю отримає інформацію, яку він шукав.

9. Корисні інструменти

Це онлайн-калькулятори, майстри підбору послуг, комплектів тощо. Допомагають користувачеві відповісти на виникаючі питання без звернення до фахівців компанії або гуглу.

Наприклад, частий питання при покупці гірських лиж – якої довжини повинні бути лижі. Замість відправки юзера на велику таблицю ріст-вага-довжина можна запропонувати йому більш зручний розрахунок:

Відповідь отримано, можна повернутися до вибору підходящих лиж, не переймаючись питанням, підійдуть вибрані лижі по довжині чи ні.

Ще один приклад з сайту Мосигры дозволяє в кілька кліків підібрати настільну гру, подарунок або «штуковину» за ціною, парі додаткових параметрів і наявності на найближчій станції метро:

Дрібниці

Не закривайте очі на дрібниці, які можуть заважати відвідувачам взаємодіяти з сайтом. Будь-яка дрібниця може виявитися тією останньою краплею, після якої користувач піде з вашого сайту.

Часто зустрічається:

1. А так можна було?

Не завжди відвідувачі розуміють, що картинки на сторінці можна подивитися в повному розмірі (збільшити по кліку). Просте додавання іконки «лупи» до картинок вирішує цю проблему:

2. Адреси зображень і файлів

Зберігайте картинки і файли з читабельними назвами. Тільки латиницею, а замість пробілів – тире або нижнє підкреслення. Чому це зручно користувачам, поясню на такому прикладі. Скачала з сайту два файли з описами мене зацікавили продуктів, збираючись подивитися їх на дозвіллі. Але виявилося, що зрозуміти, який з файлів мені потрібен, не так-то просто:

Дрібниця, але мінус в карму зароблений. Тоді як «людські» назви файлів не викликали б негативу:

3. Кнопка «Вгору»

Актуальна для реально довгих сторінок (наприклад, як ця стаття). Стандартне місце – праворуч внизу, але може бути і зліва (ВКонтакте, Хабр). Спочатку кнопка невидима, але з’являється, якщо людина вже прокрутив 1-2 екранів вниз. Я по-старому користуюся кнопкою «Home» на клавіатурі, але статистика показує, що кнопка «Вгору» теж має своїх прихильників.

4. «Приклеєна» шапка

Теж актуальна для випадку, коли на сайті багато довгих сторінок. По мірі прокручування шапка «прилипає» до верхньої межі вікна і залишається там весь час на виду. Так відвідувач позбавляється шансу забути, на сайті компанії він знаходиться.

Тут відразу приклад і «приклеєною» шапки, і кнопки «Вгору».

Підсумок

Періодично дивіться на свій сайт очима стороннього відвідувача. Переконайтеся, що сайт повністю відображає образ вашої компанії – відповідальність, якість товарів і послуг, акуратність, точність, ввічливість, професіоналізм.

Будь-яка недбалість або помилку на сайті будуть сприйняті як неповагу компанії до своїх клієнтів. Подбайте про зручність користувачів у роботі з сайтом, і ви отримаєте їх руку і серце лояльність і довіру – а що ще потрібно для встановлення міцного контакту?

Якщо вам колись перевіряти свій сайт за наведеним вище пунктами, але щось підказує вам, що проблеми є – вам підійде юзабіліті-аудит, ми все досконально перевіримо і скажемо, що і як потрібно виправити. Або залишайте заявку на міні-аудит ось в цьому пості.

Степан Лютий

Обожнюю технології в сучасному світі. Хоча частенько і замислююся над тим, як далеко вони нас заведуть. Не те, щоб я прям і знаюся на ядрах, пікселях, коллайдерах і інших парсеках. Просто приходжу в захват від того, що може в творчому пориві вигадати людський розум.

You may also like...

Залишити відповідь

Ваша e-mail адреса не оприлюднюватиметься. Обов’язкові поля позначені *