Аудит сайта Essay Writing Service

№ 1

Аудит сайта Essay Writing Service 1

Смущает изображение на заднем экране, словно мы продаём энергетики и нагнетаем.

У наших клиентов есть пара насущных проблем: нехватка времени, завал по предметам, дедлайны.

— Решение: я бы подумал о том, чтобы поставить изображение с итоговой пользой — человек веселится, пока Essay пишет за него, делает другие работы с радостным лицом. Можно сделать фоновое видео. Где студент использует сайт, а потом идёт на вечеринку или на свидание. Чтобы клиент видел фоновое видео и думал: «Хочу так же, мне надоело сидеть до ночи, хочу повеселиться и отдохнуть».

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

№ 2

Аудит сайта Essay Writing Service 2

Если эти услуги раньше были платные — тогда этот блок подходит. Если они всегда были включены в стоимость работы — это выглядит как пустая игра цифрами.

— Решение: Сделать такой же дизайн, но написать, что в стоимость работы включены эти функции, без цифр и скидки.

№ 3

Аудит сайта Essay Writing Service 3

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

— Решение: настроить чат на показ по событиям: «Находится N-минут в оформлении» и подобные, где чат действительно выручит пользователя.

№ 4

При клике на один из FAQ с конца предыдущей секции — перекидывает в начало.

№ 5

Аудит сайта Essay Writing Service 4

Странна полоса у скриншота, если она призвана скрыть информацию — она не справляется. Потому что я кликнув на картинку открываю её в полном размере без этой линии.

Аудит сайта Essay Writing Service 5

№ 6

Аудит сайта Essay Writing Service 6

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

— Решение: на странице https://essaypro.com/order-an-essay — разместить 1 кнопку в начале и одну в конце. Чтобы человек спокойно без акцентов посмотрел скрины личного кабинета и потом нажал кнопку. Кнопку в конце можно разместить на блоке с таким дизайном:

Аудит сайта Essay Writing Service 7

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

№ 7

Аудит сайта Essay Writing Service 8

При наведении элемент меняет своё поведение. Я начинаю думать, что это ссылка или чекбокс, который мне нужно выбрать, с которым я могу взаимодействовать.

— Решение: убрать изменение при наведении статичных элементов.

№ 8

Аудит сайта Essay Writing Service 9

После просмотра 3 страниц сайта, ощущение тщеславия: «Мы крутые, посмотрите на нас». Я прихожу к вам, не для того, чтобы смотреть, какие вы крутые. Мне нужно решить свою проблему.

На главной странице я хочу увидеть подтверждение моих проблем: «У вас нет времени — мы поможем; Вас завалило проектами — мы вытянем». Сейчас сайт общается со мной не в моём мире, а меня компания не особо волнует, мне нужно решение задачи.

Нехватает слов: «наши клиенты защитили дипломов, сдали экзамены, средняя оценка 4.95».

№ 9

Аудит сайта Essay Writing Service 10

Пустой текст в первых 3 пунктах. Почему качественно? Почему безопасно? Почему пунктуальные? Ответов нет.

— Решение: обновить текст так, чтобы я сам сказал: «Качество на высоте, или они пунктуальные». Надо описать, а почему вы пунктуальны:

  • Пунктуальность: «Мы ставим дедлайн за 3 дня до вашего, чтобы проверить, внести правки в вашу работы»
  • Качество: «Средняя оценка работ наших клиентов— 4.9. 3 этапа фильтрации работы и внесения правок»
  • Безопасность: «Мы используем только email, не передаём его третьим лицам, это закреплено в оферте»

Естестенно, текст надо подгонять под потребности и сайт, но направление такое. Я должен без заголовка «Качество» так подумать о компании, за счёт фактов.

№ 10

Аудит сайта Essay Writing Service 11

При наведении на эти иконки они начинают становиться ярче. Это говорит мне, что я могу кликнуть. Открыть отзывы на платформе. Я кликаю — ничего не происходит, значит какая-то ошибка.

— Решение: убрать эффект при наведении.

№ 11

Аудит сайта Essay Writing Service 12

Какой-то элементы закрывает кнопку и накладывается на фото. Из-за картинки поверх кнопка не работает.

— Решение: убрать элемент или доработать его отображение.

Элемент:

Аудит сайта Essay Writing Service 13

На всех разрешениях он ведёт себя не так, как должен.

Аудит сайта Essay Writing Service 14
Аудит сайта Essay Writing Service 15

№ 12

Аудит сайта Essay Writing Service 16

Иллюстрацию заменить, выглядит сыро, словно блок не был доделан до конца.

№ 13

Аудит сайта Essay Writing Service 17

Такие изображения не несут никакой пользы. Они ничего не сообщают пользователю. Их можно удалять без потери эффективности. В тексте мы рассказываем о сроках, конфиденциальности, поддержке, а на картинке персонаж сидит за компьютером.

— Решение: удалить изображение или подобрать те иллюстрации, которые помогают понять текст, дополняют его.

№ 14

Аудит сайта Essay Writing Service 18

Резко сменился стиль блока. На других страницах он примерно одинаковый, а здесь добавились новые элементы и я немного растерялся.

Ещё проблемы:

  • кнопка выглядит как поле
  • заголовок прижат к полю
  • заголовок не соответствует полю ниже
  • под образцы выделено слишком много места.
  • поле меняет свой дизайн при переходе на категории
Аудит сайта Essay Writing Service 19

— Решение: поменять заголовок, образцы уменьшить в значени, поле поправить. Ниже скрин исправления

Аудит сайта Essay Writing Service 20

№ 15

Проблемы с текстом на странице статьи.

Общая проблема — серый фон и серый текст. Плохой конраст, сложно читать. Либо сделать белый фон, либо текст сделать текст темнее.

Аудит сайта Essay Writing Service 21

Шаги лучше делать заголовками 3 уровня, сейчас они незаметны.

Аудит сайта Essay Writing Service 22
Аудит сайта Essay Writing Service 23

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

Аудит сайта Essay Writing Service 24

Этот оффер выглядит приятно, в фирменном стиле.

Аудит сайта Essay Writing Service 25

Этот наоборот отпугивает, потому что выглядит не так карсиво, и похож на контент. Надо привести их все к одному виду.

Аудит сайта Essay Writing Service 26

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

№ 16

Аудит сайта Essay Writing Service 27
Аудит сайта Essay Writing Service 28

«FAQ» блоки перекрывают фиксированную шапку.

№ 17

Аудит сайта Essay Writing Service 29

Проблемы:

  • Изображенеи не совсем помогает понять всё описание. «Залетают иконки, вылупляются иконки». Если бы это было видео, где вы собеседуете специалистов — другое дело.
  • Линия чтения смещается. Заголовок начинается на одной линии, подзаголовок на другой

Решение:

  • Убрать иллюстрацию, подумать о том, как иллюстрировать подбор специалистов так, чтобы я без текста всё понял. Как вариант — видео с нарезкой проверки документов, вычитки текстов.
  • Если иллюстрация остаётся — поместить её в правую часть, чтобы текст был по левой части и не разрывал линию чтения.

№ 18

Аудит сайта Essay Writing Service 30

Приоритетность восприятия: картинка, заголовок, текст. С одной стороны, напряжения, нет, но с другой стороны я на каждой статье буду прыгать глазами в разные стороны.

Аудит сайта Essay Writing Service 31

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

№ 19

Аудит сайта Essay Writing Service 32

Кнопки авторизации слишком близко к меню, я могу не попасть в меню.

— Решение: поместить кнопки авторизации по центру.

№ 21

Аудит сайта Essay Writing Service 33

Кнопка сейчас ближе к форме, чем к описании.

— Решение: поднять кнопку выше.

Цена сейчас написана слишком мелко.

— Решение: увеличисть стоимость, чтобы на мобильном было удобно её просматривать.

№ 22

Аудит сайта Essay Writing Service 36

Через пару секунд после входа на сайт, на меня наваливается куча окон, которые занимают почти половину экрана. Куки неудобно закрывать крестик влево. Я попробовал сделать это на iPhone 12 mini — получилось попасть в 5 раза.

— Решение: сделать закрытие куки кнопкой, большой. Всплытие сообщений чата сделать по событиям. Например, человек более 10 минут находится в корзине. Может у него проблемы? Надо настроить чат, чтобы он, например по событию: «после 10 минут в корзине» выдавал сообщение: «У вас возникли проблемы с оформлением заказа? Напишите, мы вам поможем». Чат должен мне как юзеру помогать, а не надоедать.

№ 23

Аудит сайта Essay Writing Service 37

Блок из-за отсутствия отступов выглядит слишком сжатым.

— Решение: добавить отступов сверху и снизу.

№ 24

Аудит сайта Essay Writing Service 38

Проблемы:

  • Важная информация скрыта за слайдером. Слайдеры часто пролистывают, не изучая следующие слайды. Если там важная информация — её надо выстаскивать.
  • Нехватает срелок для перключения слайдов. Я при попытке переключить слайд скроллил сайт верх и вниз. Это дополнительно уменьшало шанс, что я изучу их до конца.

— Решение:

  • Вытащить слайды из слайдера. Расположить 5 блоков друг за другом на мобильном.
  • Если слайдер остаётся — добавить стрелки.

№ 25

Аудит сайта Essay Writing Service 39

Табы сейчас выглядят не так, как хотелось бы мне, как пользователю. Я привык, что вкладки это вкладки. Они располагаются горизонтально и под ним идёт контент.

Аудит сайта Essay Writing Service 40

Я попрбовал бы сделать это классическими табами.

№ 26

Аудит сайта Essay Writing Service 41

В этом блоке проблемы с отступами и выравниванием. Заголовок по центру, текст по левову краю, кнопка по центру, картинка по левому краю. В итоге это микро-перемещения доставляют дискомфорт.

— Решение: выравнять всё по левому краю.

№ 27

Аудит сайта Essay Writing Service 42

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

№ 28

Аудит сайта Essay Writing Service 43
Аудит сайта Essay Writing Service 44

Снова смещается линия чтения. Выбор языка и установка приложения из Google play стоят на одной линии. Последующие текстовые блоки стоят уже на другой линии. Подписка и возможность оплаты картами сдвигается на уровень кнопки Google play.

— Решение: выровнять элементы по левому краю.

№ 29

Аудит сайта Essay Writing Service 45

Выбор категории — лишний клик. Категории можно расположить друг за другом формате топов или обычных ссылок. Необязательно скрывать небольшой список ссылок за кликом.

№ 30

Аудит сайта Essay Writing Service 46

Некоторые блоки перекрывают шапку. Проверить z-index секций главной страницы

№ 31

Аудит сайта Essay Writing Service 47

Проверить и доработать оптимизацию на мобильных.

№ 32

Аудит сайта Essay Writing Service 48

Проверить все страницы валидатором w3c и исправить ошибки в коде.

№ 33

Ошибки в семантике кода. Неправильно выбраны теги html для отображения контента.

  1. Для текста используется div, а должны span или p
  2. Для заголовков FAQ и seo-текста используются h2, а должны h3 или p
  3. Для кнопок используются div, а должны button или a

Скриншоты неправильно-подобранных тегов.

Аудит сайта Essay Writing Service 49
Аудит сайта Essay Writing Service 50
Аудит сайта Essay Writing Service 51
Аудит сайта Essay Writing Service 52
Аудит сайта Essay Writing Service 53
Аудит сайта Essay Writing Service 54
Аудит сайта Essay Writing Service 55
Аудит сайта Essay Writing Service 56
Аудит сайта Essay Writing Service 57

№ 34

Аудит сайта Essay Writing Service 58

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

№ 35

Аудит сайта Essay Writing Service 59

Между «FAQ» и «Write My Essay» блок с кучей текста, который подан скучно и его не будут читать. Не понимаю, почему вопросы из «Write My Essay» не добавлены в «FAQ». Подумайте об их объединении.

Аудит сайта vedonlyontibonukset.com

Сайт — https://www.vedonlyontibonukset.com/

№ 1

Белая подложка контента сжимает содержимое, лишает воздуха

— Решение: сделать фон сайта белым и убрать тени из контента. Показал в следующем скрине. Так контент будет восприниматься легче, без сковывающих рамок.

Аудит сайта Essay Writing Service 60
Аудит сайта Essay Writing Service 61

№ 2

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

— Решение: увеличить отступы и межстрочный интервал. Показал в следующем скрине.

Аудит сайта Essay Writing Service 62

Дизайн страницы улучшит комбинация приёмов: убрать грязные тени, поменять фон, добавить отступов.

Аудит сайта Essay Writing Service 63

№ 3

Дублирование логотипа. По факту сейчас заголовок повторяет логотип,

— Решение: на его место нужно поставить подзаголовок «Suomen kattavin urheiluvedonlyöntiin keskittyvä sivusto». Так пользователь увидит и логотип и заголовок, ему не нужно будет тратить время, чтобы посмотретьн на дублирование дважды.

Аудит сайта Essay Writing Service 64

№ 4

Иконки состояний мне непоняны, нужно сделать их информативнее, добавить слова.

— Решение: добавит слова

Аудит сайта Essay Writing Service 65

Обыграть это как-то так.

Аудит сайта Essay Writing Service 66

№ 5

Информация в карточках по центру + все сжато.

 — Решение: выравнять по левому краю, добавить больше свободного пространства, выделить важные для пользователя даные. Матч в заголовке будет важнее, чем лига, потому что логотип лиги уже есть в карточке. Также можно добавить иконки к данным, чтобы можно было быстрее считывать информацию.

Аудит сайта Essay Writing Service 67

№ 6

Сейчас скругление не на всех углах, это бросается в глаза.

— Решение: сделать скругление по всем углам.

Аудит сайта Essay Writing Service 68

№ 7

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

— Решение: затемнить изображение, выравнять текст по левому краю, сделать текст белым. Возможно увеличить заголовки. Кнопки убрать и сделать кликабельным всю карточку новости. А заголовок сделать с подчеркиванием, чтобы ссылка была нагляднее.

Аудит сайта Essay Writing Service 69
Аудит сайта Essay Writing Service 70

№ 8

Отступы списка конфликтуют с другими вертикальными элементами. Сделать их меньше, пикселей 5.

Аудит сайта Essay Writing Service 71

№ 9

Слишком жизные подчеркивания, отвлекают от самого текст ссылок.

— Решение: сделать подчеркивания аккуратнее.

Аудит сайта Essay Writing Service 72

№ 10

В подвале seo-текст отвлекает от ссылок и формы подписки.

— Решение: форму подписки увеличить, написать о преимуществах, сделать небольшой редизайн. Seo-текст разместить ниже мелким шрифтом, так как для поисковиков не имеет значения, 12 он пикселей или 18.

Аудит сайта Essay Writing Service 73
Аудит сайта Essay Writing Service 74

№ 11

Огромное полотно текста, его сложно читать. Пользователя никак не захватывают чтением

— Решение: сделать редизайн этого текста, выделить ключевую информацию, по-другому подать. На следующем скрине схематически показал, как это можно обыграть.

Аудит сайта Essay Writing Service 75
Аудит сайта Essay Writing Service 76

№ 12

Когда на карточке нет кнопки, она воспринимается как вверх высокой карточки.

— Решение: добавить серую кнопку, так будет видно, что он недоступен сейчас.

Аудит сайта Essay Writing Service 77

№ 13

Ошибки валидатора w3c

Аудит сайта Essay Writing Service 78

№ 14

Синее пространство не имеет какой-то цели или важности. По кнопке нужно целиться.

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

Аудит сайта Essay Writing Service 79
Аудит сайта Essay Writing Service 80

№ 15

При ширине 979 пикселей текст в карточках новостей разваливается.

— Решение: переделать карточки так, чтобы изображение было отдельно.

Аудит сайта Essay Writing Service 81
Аудит сайта Essay Writing Service 82

№ 16

Я спустился в подвал и хочу быстро вернуться наверх, но не знаю как это сделать. Нет ни закреплённой шапки, ни кнопки «вверх».

— Решение: добавить кнопку «вверх», которая будет скроллить вверх страницы или закрепить шапку при скролле.

Аудит сайта Essay Writing Service 83

№ 17

На 768 пикселях разваливаются карточки. Их сложно воспринимать.

— Решение: переработать карточку на мобильном, сделать их шириной 50% на планшете, 100% на мобильном.

Аудит сайта Essay Writing Service 84

№ 18

Из-за маленького отступа я не понимаю, где заканчивается одна карточка и начинается другая.

— Решение: учеличить отступ между карточками.

Аудит сайта Essay Writing Service 85

№ 19

Из-за ширины карточек и маленькими отступами все смешивается. Из-за цветных шапок карточек «вес» кнопки снижается и я её уже не замечаю.

— Решение: попробовать избавиться от цветных шапок, увеличить ширину карточки при ширине <768 и добавить отступы между строками.

Аудит сайта Essay Writing Service 86
Аудит сайта Essay Writing Service 87

№ 20

Из-за отсутствия границ я не понимаю, где верх, где низ, и на какую карточку я ставлю вето.

— Решение: добавить границы,

Аудит сайта Essay Writing Service 88

№ 21

В мобильном меню сложно воспринимать жёлтый на белом. Хорошо читается черный на белом. Ссылка выглядит в двух случая по-разному, хотя это ссылка.

При клике на кнопку «valikko» при открытии она не меняется, то есть я не вижу очевидных элементов для закрытия меню.

— Решение: изменить цвет текста на чёрный, ссылки сделать синими, либо оставить чёрными, так как это меню. Внутренник список изобразить по-другому, поменяь текст кнопки. Результат в следующем скрине.

Аудит сайта Essay Writing Service 89
Аудит сайта Essay Writing Service 90

№ 22

Убрать грязные тени у текста

Аудит сайта Essay Writing Service 91

№ 23

Добавить отступ между табами на мобильном.

Аудит сайта Essay Writing Service 92

№ 24

На главном экране нехватает слайдера или баннера с топовыми матчами. То есть нет ничего, который показал бы результат работы сайта. Первый экран должен продавать эту идею, показывать сильную сторону сайта или главное его действие. Сухой текст работает слабо.

Это гипотеза, надо тестировать на пользователях.

Аудит сайта Essay Writing Service 93

№ 25

Примерно 30% css не используется и может быть удалён. Скорее всего сетка и фреймворки.

Аудит сайта Essay Writing Service 94

№ 26

Сейчас активна первая ссылка, но она не показана явно.

— Решение: изменить стиль активной кнопки, сделать его как при наведении

Аудит сайта Essay Writing Service 95
Аудит сайта Essay Writing Service 96

№ 27

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

— Решение: когда пользователь прокрутил вкладки, мы фиксируем в верхней части табы.

Первый скрин: как сейчас, второй: как можно сделать

Аудит сайта Essay Writing Service 97
Аудит сайта Essay Writing Service 98

Css-стили

По мере аудита я выписывал css-стили, которые я заменил. Возможно они пригодястя вам при разработке.

.main {
  background-color: #fff;
}

.main-text {
  padding: 15px;
}

.main-text p {
  line-height: 1.6;
}

.topplista-casinon, .main-text {
  box-shadow: unset;
}

.topplista-casinon {
  margin-bottom: 40px;  
}

.tab-link, .tab-link.w--current, .tab-link-2, .tab-link-3 {
  box-shadow: unset;
  margin-right: 15px;
}

.w-tab-content {
  margin-top: 20px;
}

.text-link-footer {
  color: rgb(209 207 207);
  border-bottom: 1px solid rgba(209,207, 207, 0.3);  
}

.collection-item-23 {
  margin-bottom: 10px;
}


@media screen and (max-width: 991px) {
  .navbar-mobile {
    padding: 0;
  }
  .navbar-mobile-main-link {
    padding: 15px 0;
    width: 100%;
    display: block;
    margin: 0;
    border-radius: 0;
    border: none;
    color: #000;
  }
  .navbar-mobile-link-popup, .dropdown-link-50 {
    border-bottom: 1px solid rgba(0, 0, 0, 0.03);
    color: #222;
  }
  .navbar-mobile-drop-list.w--open {
    padding-left: 20px;
    margin-bottom: 20px;
    background-color: #fff;
  }
  .text-block-105, .text-block-106, .text-block-104, .bold-text-22, .bold-text-21, .bold-text-27  {
    color: #000;
  }
}

Аудит сайта SilverCinema

Сайт — https://silvercinema.ru

— Исправлено 11 из 14 проблем

Неправильные окончания

Мы не говорим: «Три кинозалов» или «421 удобных кресел»

Аудит сайта Essay Writing Service 99
Как было

Как надо

Правильные окончания для всех слов с числами.
25 залов, 3 зала, 523 кресла.

Написал для этого код на php.
https://gist.github.com/Postnov/06f3f87c10ae0e0b8f55740bcf56f646

Дублирование соц. сетей

Может быть они ведут в разные места? Я не знаю.

[изображение удалёно из-за наличия иконок компаний запрещенной в России организации Meta]

Как исправить?

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

Форма не обрабатывает ошибки

Не умеет подсказывать где именно я допустил ошибку и как надо вводить правильно. Моё имя ей тоже не понравилось. Поля не помечены как обязательные.

Кнопку лучше сделать неактивной, пока все поля не будут заполнены. Статья про формы от Лебедева

Аудит сайта Essay Writing Service 100
«Даниил» — запрещенка

Как исправить?

1. Выделите обязательные поля
2. Добавьте placeholder в поля, чтобы было понятно, как правильно вводить.
3. Заблокируйте кнопку, пока не заполнены обязательные поля.
4. Если данные заполнены неверно, расположите сообщение об ошибке сразу после поля, и не забудьте написать, как правильно.

Некликабельный номер

Аудит сайта Essay Writing Service 101
Не кликабельный номер

Как надо

Все номера телефонов должны быть кликабельными и выделены как ссылки. Пользователю уже привыкли к звонку при клике на телефон.

Нет названий фильмов — исправлена

Хочу заранее видеть их и не думать как узнать название.

Аудит сайта Essay Writing Service 102
Набор картинок на главной странице

Как исправить?

Покажите названия фильмов сразу на плашках с картинками. На мелких ячейках сложно это сделать средним кеглем. Возможно, для этого нужно будет расширить некоторые колонки, чтобы влезало название.

Область клика

Кто хочет целиться в ссылку? Слишком малая область клика. Прочитайте про закон Фиттса. Все привыкли кликать в изображение и попадать на страницу. Даже если кто-то захочет прицелиться в ссылку и не попадет — все равно перейдет на страницу

Аудит сайта Essay Writing Service 103
Малая область клика

А про мобильное попадание в ссылку даже говорить не хочется.
Что если я вижу плохо? Или палец дрожит из-за болезни?

[изображение удалёно из-за наличия иконок компаний запрещенной в России организации Meta]

Как надо

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

Пустота в подвале

На странице вакансии мало контента, разработчики не предусмотрели то, что может быть мало контента и оставили как есть. А подвал просто поднялся вверх. У меня в блоге можно прочитать, как избавиться от этого.

[изображение удалёно из-за наличия иконок компаний запрещенной в России организации Meta]

Что делать?

Прочитать мою статью и сделать «выталкивание подвала контентом»

Ссылка-обманщица

Вижу синий цвет телефона, думаю что это ссылка, кликаю — ничего. Оказывает, это текст, который выделен синим цветом.

Аудит сайта Essay Writing Service 104
Некликабельный номер телефона

Как исправить?

Если текст синим цветом — это ссылка. Против этого не попрешь. Переделывать условности и привычки бесполезно. Сделать этот телефон ссылкой

Не работает крестик

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

Аудит сайта Essay Writing Service 105
Крестик-бездельник

Как исправить?

Убрать этот крестик совсем или добиться того, чтобы пользователь сразу понимал, зачем он там, и что делает.

Подарочные сертификаты для красоты

Захожу на страницу сертификатов, чтобы купить маме подарочный сертификат: «Вау, классные сертификаты». Как купить?

Так, сказано: «подарите, купите, наслаждайтесь» и правила использования. А купить-то как?

Аудит сайта Essay Writing Service 106
Сертификаты

Как исправить?

1. Разместить кнопки «Купить» под каждым сертификатом или добавить одну кнопку «Выбрать сертификат» под группой сертификатов.
2. Написать в подзаголовке: «Сертификаты можно приобрести у кассира»

Непримечательная ссылка

Кликнул просто из любопытства, пошел вызов. Откуда люди узнают что это ссылка?

Аудит сайта Essay Writing Service 107
Внезапно кликабельный номер

Как исправить?

Если это ссылка — выделить синим и если есть желание, подчеркнуть.

Недоработки в мобильной версии

Отсутствие адаптива. Да, есть мобильное приложение. Но я не хочу его качать ради одного-двух сеансов.

Как узнать название фильма не кликнув на картинку? А если кликну, меня перекинет или покажется название? Боюсь.

Что за белая дыра под Егором?

Аудит сайта Essay Writing Service 108
Егор не оплатил весь баннер, хватило только на половину

Как исправить?

1. Показать названия сразу крупным кеглем
2. Убрать косяк в блоке с Егором
3. Сделать картинку полностью кликабельной с переходом на страницу фильма

Ага, при клике все-таки показывает название. Может если кликну на видео и увижу его название? Ан нет, смотрю видео.

Аудит сайта Essay Writing Service 109
*Клик*
Аудит сайта Essay Writing Service 110
Смотрю видео

Как исправить?

Когда исправится поведение картинок сверху, этот блок будет восприниматься по-другому, пользователи будут ожидать воспроизведения видео.

Дыры в подвале

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

Аудит сайта Essay Writing Service 111

Как исправить?

Разместить виджет инстаграмма по левому краю. Кнопку обратной связи по правому краю.

При загрузке страницы ломается сетка изображений

Когда интернет медленный, изображения загружаются долго. Высота блоков не проставлена, поэтому все блоки схлопываются и ждут появления изображения.

Аудит сайта Essay Writing Service 112
Схлопываются блоки

Как нужно

Сделать фиксированной высоту блоков и вставлять туда картинки с position: absolute. Пока картинка загружается показать серый блок и его мигание — моментальная обратная связь о том, что страница загружается. Интерфейс говорит: «Пожалуйста, подожди, я стараюсь.»

Ссылка на решение: https://codepen.io/dan_postnov/full/WNvpZPQ

Моментальная обратная связь

Аудит сайта компании Concordia University

Сайт — https://www.concordia.edu.ua/

№ 1

Изображение режется и видны пиксели.
— Решение: Подобрать несколько изображений для разных разрешений или оттестировать адаптив одного формата. Взять изображение с лучшим качеством.

Аудит сайта Essay Writing Service 113
Аудит сайта Essay Writing Service 114

№ 2

  1. Изображения взяты с фотостоков. Это подчёркивает низкое качество контента и отношение универсистета к собственному сайту и его посетителям.
    — Решение: дать дизайнеру задачу создать изображения для событий. Можно сделать минималистичные надписи или иконки. В стилистике университета.
  2. Ссылка «View all events» неоправданно занимает всю строку.
    — Решение: расположить её справа от линии, на одном уровне с «Events».
  3. Изображения разного размера влияют на положение заголовка. Глазу постоянно нужно искать точку начала заголовка.
    — Решение: задать фиксированные размеры для изображения и подобрать их по размера. После этого заголовки встанут на одну линию.
Аудит сайта Essay Writing Service 115

№ 3

В блоке новостей среди записей зияющая «дыра». Как пользователю сайта, я не понимаю почему это выполненно именно так. Для меня это ошибка в работе сайта.

— Решение: пересмотреть код и равномерно распределять записи.

Аудит сайта Essay Writing Service 116

№ 4

Информация о приёме идёт 3 блоком. Пользователям надо пролистать не такие интересные для них события и новости, чтобы наконец дойти до информации о приёме.

— Решение: переместить блок о приёме на два блока выше, сразу после слайдера.

Аудит сайта Essay Writing Service 117

№ 5

Текст выравнен по левому краю, кнопка по центру. Это создаёт ощущение неряшливости.

— Решение: переместить кнопку в левую часть блока.

Аудит сайта Essay Writing Service 118

№ 6

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

— Решение: убрать градиенты. Они больше не появляются нигде на сайте. Они не вызывают какого-то вау эффекта и приятного ощущения.

Аудит сайта Essay Writing Service 119

№ 7

Один из важных блоков на главной странице спрятан в конце вкладками. А перед ним идут неважные блоки: «ConcordiaUA Stars», «ConcordiaUA Experts Opinions», «References»,"Class of 2020 Graduates"

Аудит сайта Essay Writing Service 120

— Решение: нужно переносить этот блок и ставить его после программ обучения. Информацию из вкладок нужно вытаскивать в отдельные блоки, раскрывая её.

Я сделал быстрый набросок, как это можно вытащить из вкладок. Это нельзя прятать и важно больше показывать иллюстраций, нежели просто сухой информации. Если мы можем проиллюстрировать практикующих преподавателей или первоклассные дипломы — нужно их проиллюстрировать.

Аудит сайта Essay Writing Service 121

№ 8

Одинаковая вёрстка блоков и плохо подобранные изображения. Мне было скучно просматривать эту информацию. Я пролистывал быстрее, потому что одинаковая сетка и плохо подобранные изображения не вызывают никакого желания хоть как-то изучать эту информацию.

— Решение: сделать индивидуальный дизайн для каждой секции, который будет использовать разную композицию и сетку для привлечения внимания. Подобрать изображения по размерам.

Аудит сайта Essay Writing Service 122

№ 9

Блок преимуществ расположен в самом конце, рядом с подвалом. До этой важной информации могут просто не доскроллить.
— Решение: переносим выше и объединяем с другими преимуществами.

Аудит сайта Essay Writing Service 123

№ 10

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

Аудит сайта Essay Writing Service 124

— Решение: сделать блок о квалифицированных специалиста перебивкой между программами и преимуществами. На изображении показать финал обучения. Картинка с книгами в библиотеке не подходит. Надо подобрать то, что ассоциируется с выпуском квалифицированных специалистов.

Аудит сайта Essay Writing Service 125

№ 11

Плохая вёрстка подвала. Появляется «дыра» и не занят правый нижний угол. В итоге композиция рассыпается.

Аудит сайта Essay Writing Service 126

— Решение: проработать композицию подвала так, чтобы она выглядела собранно. Каждая деталь показывает отношение к пользователям и формирует впечатление.

Сделал быстрый набросок композиции.

Аудит сайта Essay Writing Service 127

№ 12

Фиксированная шапка занимает много места.
— Решение: уменьшить логотип и отступ сверху.

Аудит сайта Essay Writing Service 128

№ 13

Спорный раздел «Карьера». Нужно разобраться, для каких пользователей сделан сайт. Если для клиентов — нужно убирать раздел карьера в подвал. В навигации оставить только то, чем пользуется клиент и что поможет ему принять решение о поступлении.

Аудит сайта Essay Writing Service 129

№ 14

При клике на кнопки открываетс новая вкладка в браузере. Мне это не нравится, так как я сам в состоянии решить, открывать в этой вкладке или в новой. Когда сайт забирает управление на себя — теряется чувство контроля, а вместе с этим и удовлетворения от использования сайта.

Аудит сайта Essay Writing Service 130

Слишком много акцентов. Некоторые выделены зелёным, некоторые жирным. Я не понимаю что из этого важнее. Кнопки выделены зелёным. Я предполагаю, что текст, выделенные зелёным — ссылка. Пытаюсь кликнуть — ничего не происходит.

— Решение: определиться с стилистикой кнопок, ссылок, акцентов. Использовать минимум ацентов. Когда важно всё — неважно ничто.

[изображение удалёно из-за наличия иконок компаний запрещенной в России организации Meta]

№ 15

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

Аудит сайта Essay Writing Service 131

Пример из проекта. Два блока сбоку. Мы видим, что они разные, но в тоже время в них чувствуется единый стиль, якорь — шрифт и расположение заголовка. Тот же самый эффект нужно достичь на всём сайте.

Аудит сайта Essay Writing Service 132

№ 16

Карточку преподавателя можно улучшить:

  1. Подобрать качественные изображения
  2. Сделать разный стиль для элементов карточки
  3. Убрать излшне «кричащие» элементы
Аудит сайта Essay Writing Service 133

Редизайн карточки. До и после

№ 17

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

Комбинация заголовок + картинка уже нарушают обычный порядок восприятия. А линии добавляют хаоса.

Аудит сайта Essay Writing Service 134

— Решение: убрать линии, поменяь местами картинки с заголовками. Соблюсти отступ между строками.

Аудит сайта Essay Writing Service 135

№ 18

Почти все поля в форме — обязательные. Проще написать, какие необязательные.

Аудит сайта Essay Writing Service 136

— Решение: убрать упоминание о звездочке и обязательных полях. Пометить необязательные.

Аудит сайта Essay Writing Service 137

№ 19

Выбор из 2−3 вариантов не нужно делать выпадающим списком. Это избыточно, создаёт лишний клик.

— Решение: сделать выбор варианта не select, а radio-кнопками

Аудит сайта Essay Writing Service 138

№ 20

В тексте много отсупов, его сложно читать. Не выделены ссылки и заголовки.

— Решение: выравнять текст по левому краю. Сделать заголовки крупнее. Выделить ссылки цветом.

Аудит сайта Essay Writing Service 139

№ 21

Почти одинаковые отступы у кнопки начинают смущать, ловишь себя на мысли: «а не перепутали-ли что-то здесь?».

— Решение: подвинуть элементы ближе к изображению.

Аудит сайта Essay Writing Service 140

№ 22

Изображение по центру нарушает поток восприятие по левому краю. Также нарушает поток восприятия элементы, начало которых не выравнено по левому краю.

— Решение:

  1. Выравнять изображение по левому краю.
  2. Линию Prev/Next растянуть на всю ширину контейнера
  3. Shares и иконки расположить слева.
Аудит сайта Essay Writing Service 141

№ 23

Не понимаю, зачем в статье, на которую я перешёл стоит ссылка «Read more». Я уже пришёл читать статью.

Если это что-то отдельное от контента статьи — это нужно выделить либо линией, либо фоном. Но в таком случае, а не понимаю, где контент статьи.

Аудит сайта Essay Writing Service 142

№ 24

Если комментариев 0 — этот элемент вообще можно не показывать. А показывать только тогда, когда комментарии появятся.

Аудит сайта Essay Writing Service 143

№ 25

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

— Решение: сделать телефоны и email кликабельными.

Аудит сайта Essay Writing Service 144

№ 26

Смешиваются цветовые акценты. По главной странице я привык, что зелёная кнопка — акцент и действие. На этой странице всё смешивается.

— Решение: определить акцентный цвет и использовать его там, где это уместно. В данном случае можно сделать иконки руки и название программы синими.

Аудит сайта Essay Writing Service 145

№ 27

Кнопка скрытия не работает

Аудит сайта Essay Writing Service 146

№ 28

Текста в несколько строк, выравненный по центру сложно читать.
— Решение: выделить по левому краю.

Аудит сайта Essay Writing Service 147

№ 29

Текст сложно читать, потому что он не разделён по абзацам. Он кажется огромным. Также мне сложно выделить начало участка и прочитать то, что зацепило взгляд.
— Решение: разделить по абзацам.

Аудит сайта Essay Writing Service 148

№ 30

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

Аудит сайта Essay Writing Service 149

№ 31

Таблица сейчас выглядит перегруженной и занимающей много пространства. Её можно упростить. Результат ниже.

Аудит сайта Essay Writing Service 150
Аудит сайта Essay Writing Service 151

Фразу «Entrants with basic and complete higher education» можно либо убрать, если она не несёт большой пользы, либо вынести за таблицу. Серый цвет строки появляется при наведении.

№ 32

После перехода на стрницу программы, мне не хватает кнопки «Поступить/Выбрать»

Аудит сайта Essay Writing Service 152

№ 33

Нужно поправить отступ в колонке сбоку.

Аудит сайта Essay Writing Service 153

№ 34

Выравнять текст по левому краю. Подумать о том, чтобы сместить центральный блок вправо и выделить каким-то фоном.

Аудит сайта Essay Writing Service 154

Как-то так.

Аудит сайта Essay Writing Service 155

№ 35

Много линий, разные отстутпы, пространство разделено неравномерно.

Аудит сайта Essay Writing Service 156

Предлагаю 2 варианта решения. Либо выравание по левому краю, либо аккуратная шахматная сетка. Во втором варианте контент тот же, но выглядит аккуратнее.

Аудит сайта Essay Writing Service 157

№ 36

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

— Возможное решение:
1. Сделать блок с нужной информацией для абитуриентов на первом экране: заголовок, подзаголовок, несколько самых важных ссылок, кнопка связи.
2. Избавиться от слайдера. Слайды разместить как отдельные блоки в других частях сайта, где они будут уместны.

Аудит сайта Essay Writing Service 158

№ 37

Кнопка в слайде не выглядит как кнопка.

— Решение: сделать загругленные края и сменить цвет на зелёный.

Аудит сайта Essay Writing Service 159

№ 38

На планшете под линию с 3 элементами выделено слишком много места.

— Решение: уменьшить логотип и высоту строки.

Аудит сайта Essay Writing Service 160

№ 39

На планшете разъезжаются блоки у программ.

Аудит сайта Essay Writing Service 161

№ 40

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

Аудит сайта Essay Writing Service 162

№ 41

Некоторые пункты обрезаются наполовину. Меню можно увеличить где-то на 80−100% без потери удобства.

Аудит сайта Essay Writing Service 163

№ 42

Сетка на странице «About us» сломалась на мобильном.

Аудит сайта Essay Writing Service 164
Аудит сайта Essay Writing Service 165

№ 43

На странице «about us» фото пропали, но огромные отступы остались.

Аудит сайта Essay Writing Service 166

№ 44

В подвале линии уже не нужны, отсупы можно уменьшить.

Аудит сайта Essay Writing Service 167

№ 45

Выравнять изображения по левому краю. Теряется поток восприятия.

Аудит сайта Essay Writing Service 168

№ 46

Непонятно, связаны ли эти столбцы. Почему заголовок у второго блока есть, а у первого нет. Где «Program» — это общие программы, а «Bachelor Degree» — программы блока?

Таблицы вызывает больше вопросов, чем ответов. Нужно её дорабатывать. + те же самые правки по выравниванию и упрощению, как в № 31

Аудит сайта Essay Writing Service 169

№ 47

Кнопки в формах на мобильном сделать больше, чтобы проще было попадать. Особенно с маленьких телефонов.

Аудит сайта Essay Writing Service 170

№ 48

Текст в таких плашках лучше делать меньше и выравнивать по левому краю

Аудит сайта Essay Writing Service 171

№ 49

Просмотрите все таблицы и адаптируйте их на мобильном. С мобильного это воспринимать тяжело.

Аудит сайта Essay Writing Service 172
Аудит сайта Essay Writing Service 173
Аудит сайта Essay Writing Service 174
Аудит сайта Essay Writing Service 175

№ 50

Эта карточка делает flip при наведении на ПК. На мобильном обратная сторона появляется только при клике, то есть теряется, потому что никто не будет кликать на эту карточку.

Аудит сайта Essay Writing Service 176

№ 51

Схлопнулись карточки и их кнопки.

Аудит сайта Essay Writing Service 177

№ 52

Сместились цветовые акценты. Линии стали зелёными, кнопки синими.

— Решение: поменять цвета. Кнопки зеленые, линии синие.

Аудит сайта Essay Writing Service 178

Аудит сайта antikvariatpskov.ru

Сайт — antikvariatpskov.ru

№ 1

Проблема: при клике на эту табличку идёт перезагрузка сайта. Также номер телефона не кликабелен.

Решение: убрать эту перезагрузку в коде и сделать телефон ссылкой. Чтобы с телефона мы могли сразу перейти на звонок.

Аудит сайта Essay Writing Service 179

№ 2

Проблема: непонятен функциональный смысл эти логотипов. Для чего они здесь? Если для антуража, то этот антураж старины нужно создавать другими элементами

Решение: убрать и создать антураж старины шрифтом, иконками, иллюстрациями.

Аудит сайта Essay Writing Service 180

№ 3

Проблема: для чего здесь эти изображения? Они занимаюсь половину первого экрана и находятся на любой странице. Для создания антуража они не подходят, они зря занимают место. Если нужно показать где магазин, это нужно делать в современном качестве фото + карта.

Решение: отснять фото-инструкцию и добавить карту на страницу «Как добраться»

Аудит сайта Essay Writing Service 181

№ 4

Проблема: вертикальная навигация по страницам. Пользователи привыкли к горизонтальной номерной навигации. Её используют повсеместно и она является лучшей практикой. Вертикальная навигация неэффективно использует пространство.

Решение: поставить элементы горизонтально в линию.

Аудит сайта Essay Writing Service 182

№ 5

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

Решение: добавить кнопку «Заказать». Сделать форму с именем, количеством и временем, когда удобно будет созвониться.

Аудит сайта Essay Writing Service 183

№ 6

Проблема: огромный логотип в мобильной версии. Занимает 30% экрана.

Решение: уменьшить до размера примерно 150×150 пикселей. В правой части экрана расположить телефон.

Аудит сайта Essay Writing Service 184

№ 7

Проблема: на мобильном навигация по страницам наезжает на блок с категориями.

Решение: исправить проблему в вёрстке.

Аудит сайта Essay Writing Service 185

№ 8

Проблема: если мы находимся в категории, для перехода в другую категорию нужно либо пролистать в самый низ страницы, либо выйти на главную и найти нужную категорию.

Решение: сделать всплывающую панель категорий. Чтобы из любой части сайта можно было перейти в категории.

Аудит сайта Essay Writing Service 186

№ 9

Проблема: пустые категории, которые занимают место.

Решение: настроить отображение только тех категорий, в которых есть товары.

Аудит сайта Essay Writing Service 187

№ 10

Проблема: форматирование текста такое, что нужно прочитать все, чтобы найти нужную информацию.

Решение: Расставить акценты в тексте, добавить отступы и переносы.

Аудит сайта Essay Writing Service 188

№ 11

Проблема: съехала карта, номер телефона некликабельный. Номер должен быть кликабельным, так как это позволяет нам позвонить одним кликом.

Решение: сделать телефон ссылкой, поправить карту. Добавить номер телефона в шапку сайта.

Аудит сайта Essay Writing Service 189

№ 12

Проблема: отсутствие новостей. Если вы будете вести новости — нужно добавить еще несколько новостей и настроить в них форматирование: заголовки, абзацы.

Решение: удалить или добавить новости

№ 13

Проблема: в меню есть страница — продажа антиквариата. Когда я как пользователь кликаю на неё, я хочу попасть на страницу каталога.

Решение: переименовать страницу «продажа антиквариата» в «каталог» и поместить там товары.

Аудит сайта Essay Writing Service 190

№ 14

Проблема: имеет ли какую-то важно курсы валют? Если вы продаете в долларах или евро — может быть. Если нет — это лишняя информаиця.

Решение: убрать, если не используется в продажах. Если используется — конвертировать цену товара сразу на странице товара.

Аудит сайта Essay Writing Service 191

Аудит сайта imag. store

Задача

Ко мне обратились с задачей провести аудит сайта imag.store, на котором представлен ассортимент техники Apple.

Результат

Изучил сайт вдоль и попрек — просмотрел сайт под всеми разрешениями. Проверил работу всех элементов.

Проанализировал, что может критично обрушить конверсию. и помешать продажам. Расписал все проблемы и предложил исправление по каждой проблеме.

Текстовый аудит

№ 1 — отсутствуют элементы, идентифицирующие сайт

Проблема: нет важных элементов, по которому можно идентифицировать сайт: логотипа, описания, контактов, поиска. Заходя на любой сайт, пользователь оценивает его и принимает решение: доверять ему или нет. Лого, описание, навигация — важные элементы каждого сайта.

Решение: Создать логотип и описание слева. Меню расположить справа и показать ссылки сразу. Чтобы пользователь без дополнительных кликов мог попасть на страницы: доставка, сервис, отзывы, трейд-ин.

Аудит сайта Essay Writing Service 192
Отсутствие элементов, идентифицирующих сайт

№ 2 — прокрутка сайта

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

Решение: Отключить прокрутку, когда открыто меню.

Аудит сайта Essay Writing Service 193

№ 3 — заголовки и активный пункт меню

Проблема: когда мы находимся на странице категории — на сайте нигде не говориться о том, где я нахожусь. Для пользователя важно осознавать, где он находится. Это похоже на то, если бы мы заблудились в городе и там не было бы названия улиц и любых упоминаний о том, где я.

Решение: добавить на каждую страницу заголовок, в меню выделить активный пункт меню.

№ 4 — шрифт цены

Проблема: используется начертание шрифта, с которым не видно цену. На скриншоте еще видно, но издалека на ПК и тем более на телефоне её просто не видно.

Решение: выделить цену отдельным шрифтом или хотя бы сделать выделить её жирностью.

№ 4 — блок с контактами

Проблемы:

  1. Большая разрядка текста. Нужно убрать свойство, которое добавляет между буквами расстояние. Если это заголовок — нужно выделить его размером и жирностью
  2. Город и адрес ближе к номеру телефона, нежели к слову «Адрес». Это нарушает правило внутреннего и внешнего, из-за ошибки элементы считываются неправильно.
  3. Ошибка в слове «Адресс»

Решение:

  1. Убрать разрядку текста. Выделить заголовок размером и жирностью — http://joxi.ru/Drl37poc0DjxGA
  2. Выровнять расстояния так, чтобы элементы не влезали в границы других элементов.
  3. Убрать ошибку в слове

[изображение удалёно из-за наличия иконок компаний запрещенной в России организации Meta. В скором времени они будут загружены без иконок этих компаний]

№ 5 — статичная карта

Проблема: статичная карта. Когда на сайте присутствует карта — пользователи будут ожидать от неё функционал карты, кликать, пытаться перетаскивать. Лично я часто смотрю как проехать, внутри карты Яндекс это можно сделать. Это удобно.

Решение: поставить яндекс карту с такой же позицией.

Аудит сайта Essay Writing Service 196

№ 6 — иерархия в детальной

Проблема: плохая иерархия в детальной странице товара. Текстовые элементы смешаны с изображениями. Это ухудшает восприятие страницы, так как акцент в первую очередь забирает на себя изображение. В итоге пользователь будет прыгать взглядом по элементам.

Решение: Сделать дизайн детальной страницы. Слева должны быть изображения. Я хочу увидеть не просто статичную картинку, а несколько изображений, чтобы я смог со всех сторон рассмотреть товар. Справа должен быть заголовок, описание, выбор характеристик и кнопка купить. Так мы визуально разделим демонстрацию товара и его текстовое описание.

Аудит сайта Essay Writing Service 197

№ 7 — некорректное отображение латиницы и цифр

Проблема: Латиница и цифры отображаются некорректно. С компьютера и с телефона сложно рассмотреть текст. подобрать шрифт, который будет корректно отображать текст на сайте в разных языках.

Решение: подобрать шрифт, который будет отображать цифры и латиницу корректно. В примере бесплатный шрифт «Rubik»

№ 8 — характеристики абзацем

Проблема: характеристики товара одним абзацем. Характеристики — это показатели товара. Считывать их в формате абзаца сложно непонятно где начинается и заканчивается характеристика.

Решение: сделать характеристики товара таблицей. Пользователи к этому привыкли. Это удобный формат для предоставления таких данных.

№ 9 — не выделена цена

Проблема: в каталоге и детальной не выделена цена. Цена — акцентный элемент, который ищет множество пользователей. В данный момент она не выделена и приходится всматриваться, чтобы найти её.

Решение: выделить цену жирностью и размером.

№ 10 — неакцентные кнопки

Проблема:

Кнопки не выглядят как кнопки, нет акцента среди кнопок. В интернет-магазине главной кнопкой в детальной странице является кнопка «Купить».

Если мы делаем её дизайн таким, что она не выглядит как кнопка — это снизит конверсию. «Взять в кредит» и «доставка» — вспомогательные элементы.

Решение:

Сделать дизайн кнопок таким, чтобы они выделялись и акцентировали внимание настолько, насколько они важны.

№ 11 — неправильные расстояния

Проблема: неправильные расстояния. Нарушено правило внутреннего-внешнего. Название товара ближе к пункту меню, нежели к своему изображению и описанию. Визуально кажется, что это относится у меню, а не к товару.

Решение: Опусти заголовок ниже, рядом с изображением.

Аудит сайта Essay Writing Service 206

№ 12 — страница доставки

Проблемы:

  1. Размер заголовка меньше, чем номер телефона.
  2. Стоимость, режим и время доставки не расписаны.
  3. Плохая композиция страницы — не выделены ключевые элементы, элементы не используют доступное место страницы.

Решения:

  1. Заголовок должен быть крупнее чем номер и почта.
  2. Стоимость, режим и время доставки нужно расписать детальнее
  3. Сделать новую композицию страницы, где информация подана чётко и легко считывается с помощью заголовков.

№ 13 — фальшивость отзывов

Проблема: текстовым отзывам сейчас не доверяют. Такие отзывы можно легко подделать и клиенты сразу так подумают.

Решение: взять у покупателей аудио или видео-отзывы, на которых будет виден и человек и товар.

Если можно взять личную страницу клиентов — возьмите и укажите. Указать товар, который человек покупал и дату, когда оставлял отзыв.

Чтобы потенциальный покупатель мог спросить, а правда ли он брал такой товар и как он ему спустя время.

Аудит сайта Essay Writing Service 209

№ 14 — скучный текст

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

Решение: Определить цель страницы, проработать структуру и визуальное повествование.

Аудит сайта Essay Writing Service 210

№ 15 — полотно текста

Проблема: сплошное полотно текста, которые прочитает не каждый. Нет визуального выделения важные моментов. Текст пустой, нужно переписывать. НЕ выделены ссылки.

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

Аудит сайта Essay Writing Service 211

№ 16 — отсутствие сопутствующих товаров

Проблема: нет сопутствующих товаров. Покупая мак, пользователь скорее всего будет просматривать мышь, клавиатуру и наушники. Возможно он захочет купить их у вас, но мы ему об этом не говорим.

Решение: сделать секцию с сопутствующими товарами, которые сразу можно купить, не выходя из текущей страницы.

Аудит сайта Essay Writing Service 212
Место, куда нужно поместить сопутствующие товары.

№ 17 — разделы в футере

Проблема: в футере нет разделов сайта. Большинство пользователей уже знаю: в шапке лого, навигация и номер телефона. Внизу ссылки на разделы сайта и контактная информация.

Решение: Расположить ссылки на разделы отдельной строке. Чтобы ссылки были доступны и внизу сайта.

[изображение удалёно из-за наличия иконок компаний запрещенной в России организации Meta. В скором времени они будут загружены без иконок этих компаний]

№ 18 — некликабельный номер

Проблема: некликабельные номера телефонов. Пользователь должен вручную копировать номера и вставлять в телефоне.

Решение: сделать телефоны ссылками, чтобы при клике сразу шёл вызов.

[изображение удалёно из-за наличия иконок компаний запрещенной в России организации Meta. В скором времени они будут загружены без иконок этих компаний]

№ 19 — наложение кнопки меню

Проблема: в версии для планшетов нужно отделить категории и иконку меню, чтобы можно было попасть по категории «Аксессуары»

Решение: Отделить категории и иконку меню, чтобы можно было попасть по категории «Аксессуары». У категорий можно сделать отступ справа, который оставит место для кнопки меню.

Аудит сайта Essay Writing Service 213

№ 20 — категории не влезают в экран

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

Решение: сделать иконки в 2 ряда либо сделать выпадающий список

Аудит сайта Essay Writing Service 214

№ 21 — максимальная ширина изображений

Проблема: изображения не влезают в экран мобильного.

Решение: проверить адаптивность и поставить ограничение на максимальную ширину изображений.

Аудит сайта Essay Writing Service 215

№ 22 — размер текста на мобильном

Проблема: читать текст внутренних страниц на мобильном — неудобно. Сложно рассмотреть текст. На скриншоте выглядит все крупно, но расстоянии пришлось всматриваться.

Решение: увеличить размер текста на мобильном

Аудит сайта Essay Writing Service 216

№ 23 — дизайн страницы «Покупка»

Проблема: дизайн оформления заказа вызывает недоверие. Стандартные, заезженные иконки, выбор цвета, который должен быть в детальной странице. Отсутствие информации о товаре, кроме заголовка.

Решение: добавить изображение, заголовок, сумму, переключатели количества на страницу покупки. Убрать иконки, переделать композицию.

№ 24 — подсказки полей

Проблема: я не знаю, в каком формате вводить информаци. ФИО или имя? Адрес, это с обласью и индексом или улицы и дома будет достаточно?

Решение: вставить примерное заполнение внутрь полей, чтобы было понятно, как их вводить. Нужно подправить дизайн, чтобы постановочные данные влезали и были еще прозрачнее.

№ 25 — поле с комментарием

Проблема: у поля с комментарием маленькая высота. Я пробовал вводить, круто, что поле увеличивается, но вот сразу этого не понять. То есть видя узенькую полоску поля, я понимаю, что оно не будет увеличиваться, потому что на многих сайта она остается в той же высоте, если я ввожу информацию.

Решение: увеличить поле, чтобы я понимал, что могу ввести туда больше информации.

№ 26 — требовательность полей

Проблема: поле телефоне не воспринимает то, что я ввёл. Это убьёт всю конверсию этой страницы. Данные каким-то образом обрабатываются кодом в определённом формате, но не дают мне узнать, что это за формат.

Решение: принимать телефон в любом виде и уже на стороне сервера преобразовывать его в нужный формат. Нельзя пользователю сильно диктовать условия заполнения формы. Вариант хуже — сделать маску, которая будет по мере набора номера форматировать данные.

№ 27 — одна страница на разные действия

Проблема: при клике на кнопки «Купить» и «Оформить в кредит» открывается одна и та же страница.

Решение: сделать 2 отдельные страницы. Одна — покупка, вторая — оформление в кредит. Поставить заголовки и изменить названия кнопок на странице оформления: «Купить», «Оформить в кредит»

№ 28 — адаптивность страницы «Покупка»

Проблема: взаимодействовать с элементами на странице покупки не возможно из-за ошибок в адаптивности.

Решение: проработать адаптив на странице покупки, сделать поля на всю ширину. Сделать так, чтобы поля и кнопки были на всю ширину страницы для более лёгкого попадания по ним.

Аудит сайта Essay Writing Service 225

Аудит сайта для проекта «Псиблог»

Задача

На фриланс-площадке ко мне обратился Дмитрий с просьбой сделать аудит юзабилити для его блога. Договорились о том, что в установленный бюджет я буду проводить аудит в течение 4 часов.

Аудит сайта Essay Writing Service 226

Результат

Три часа выискивал проблемы, описывал их и решение в отдельном текстовом формате (процесс). Я понимал, что кроме видео нужно сделать и текстовую статью для более удобного просмотра и поиска.

Четвертый час потратил на задачи пользователя, привлек стороннего пользователя и дал ему несколько задач.

После выполнения добавил их в отчёт и записал видео по текстовому материалу.

Отрывок аудита

Отзыв

Аудит сайта Essay Writing Service 227