22 заметки с тегом

веб-дизайн

Как вас обманывают интернет-магазины

Хочу рассказать вам о черном маркетинге, когда нужно сто раз все проверять, прежде чем купить.

  1. Лишние товары в Корзине. Магазин отмечает выбранным сопутствующий товар. Когда вы добавляете в Корзину основной товар (телефон), то как бы добровольно автоматически добавляете и сопутствующий тоже (чехол). В итоге сумма корзины может быть немного больше, что сразу не заметишь. Проверяйте перечень товаров в Корзине перед оплатой.
  1. Дополнительные услуги. Об этом не говорится в описании товара, но при расчете всплывет за небольшую плату. Отказаться от этого, как правило, нельзя. Например, упаковка товара. Напоминает проценты за обслуживание в ресторанах.
  1. Скрытая подписка. К описанию товара предлагается что-то бесплатно в пакете какой-то услуги. Например, бесплатная доставка для постоянных клиентов. Вы видите слово бесплатная и выбираете. В Корзине выясняется, что постоянные клиенты — это те, кто покупает подписку на год. То есть, чтобы получить бесплатную доставку, нужно будет оплатить подписку. Формально сложно придраться, но проверять список товаров в Корзине нужно.
  1. Скрытые условия подписки. К основному ценнику не указывается срок подписки. Вы можете подумать, что оплата будет единоразовой, но она может быть ежемесячной или ежегодной. Об этом можно узнать из условий подписки, но не из ценника.
  1. Предложения, ограниченные по времени. Продавцу ничего не стоит нагнать на вас страху. Особенно такие вещи используют сервисы бронирования отелей. Никто никогда вам не гарантирует, что это же предложение снова не станет доступно через 5 минут после его окончания. Даже, если за ними что-то стоит, оно повторится все равно потом. Нет никакого смысла делать предложение с таймером один раз. Не ведитесь на таймеры, они ничего не означают.
  1. Ограниченное предложение. Просто напишут «Предложение действует ограниченное время», а сроки не укажут. Еще выделят как-то хитро, что вы решите: вот он мой шанс, убегает. На деле так будет написано всегда, потому что никаких сроков нет.
  1. Формулировки, вызывающие у вас стыд. Громко сказано, но когда вместо «Закрыть» или «Отменить», магазины пишут «Спасибо, но не надо» или «Спасибо, но я хочу заплатить по полной цене» или «Спасибо, я не экономлю на скидках» и так далее, по-другому и не скажешь. Вызывают у клиента стыд за свое решение, чтобы подтолкунть вас к покупке по акции.
  1. Введение в заблуждение при взаимодействии с интерфейсом. Оформляют кнопки или выбор таким образом, чтобы выглядело так, что у вас нет другого выбора, хотя он есть. Формально, всегда могут сказать, что вас никто не ограничивал и все работает, но так как выбор между Да и Нет может выглядеть так, словно Нет выбрать нельзя, то многие клиенты соглашаются на предложения, хотя и не хотели бы. Например, кнопка серая, хотя и работающая. Тыкайте в другие варианты, чтобы проверить что работает на самом деле.
  1. Запутанные формулировки. Чаще всего встречается с подписками на рассылку новостей. По умолчанию магазин подписывает вас на рассылку и чтобы он этого не делал, нужно отметить пункт галочкой. Так как большинство сайтов в интернете, наоборот, предлагают добровольно отметить галочкой подписку, то такой прием (обратный) вводит вас в заблуждение и вы, думая, что не подписываетесь, на самом деле подписываетесь. Проверяйте, что написано у галочек, когда оставляете адрес своей почты. Иногда, галочку нужно нажать.
  1. Фиктивная активность на сайте. Сайты вроде Букинг-кома часто прибегают к таким приемам. Во время просмотра товара, могут всплывать сообщения о том, что какая-то Маша из Питера только что купила этот товар или сэкономила 3000 руб на этой сумочке, благодаря скидке, на которую вы смотрите. Магазину ничего не мешает наделать таких фейковых активностей, это ничего не нарушают, но на вашу психику давит. Помните, что это все боты и к реальности не имеют никакого отношения.
  1. Ограниченное количество товаров. Когда пишут к товару: осталось 3 шт. Наверное, на одной из полок на складе действительно осталось 3 шт. и еще 500 шт на остальных полках. Помните, что один из главных приемов всех аферистов (не только в интернет-магазинах) — заставить вас принять решение здесь и сейчас. Они не дают вам подумать или вернуться к вопросу позже. Если вас где-то подгоняют: только 3 товара осталось, только сегодня, только в этот раз — значит хотят нагреть. Даже, если вам продадут то, что обещали, это будет сделано под давлением.
  1. Трудные отмены. Прежде, чем соглашаться на что-то регулярное, проверьте как это можно будет отменить. Самый частый случай — подписка. За подписку с вас будут снимать регулярно, поэтому сначала узнайте подробные условия отписки. Часто для этого требуется писать письмо или даже звонить (например, в США). На одном сайте я смог отменить подписку только через посредника по оплате, потому что сам сайт выдавал все время ошибку в духе повторите позже. Не рассчитывайте на информацию в разделе Помощи. Она может обещать или устареть, но на деле вам не поможет. В идеале, найдите отзывы клиентов, которые успешно отписались. Или для подписки используйте виртуальную карту, которую потом можно отменить и тогда сайт не сможет брать деньги с вас снова.
  1. Дорогие предложения по умолчанию. Магазин может предлагать купить более дорогой вариант. Чтобы этого избежать, проверяйте все варианты, чтобы не купить сразу то, что уже было выбрано. Подобные приемы встречаются на сайтах доставки цветов или еды.
  1. Дополнительные условия бесплатной доставки. Чаще всего это минимальная сумма заказа. Изучайте внимательно службы доставки еды, если у вас небольшой заказ.

Рейтинг банковских сайтов Узбекистана — 2019

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

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

Если я не мог найти что-то, это не работало или работало не так как надо — сайт получал за это минус. Возможно, у них есть приложение, но если я не нашел ссылку на него (даже если я тупой), значит для меня его не было.

Так как несколько банков получили одинаковые баллы, то пришлось применить волшебную пыльцу и добавлять сайту по 0.1 баллу за то, что сайт получил + в такой категории, где большинство сайтов его не получили. Например, Равнакбанк получил 0,1 балл за плюс в категории «Подбор вкладов», потому что кроме него в этой категории всего два других банка. У конкурентов по баллам такого преимущества нет.

Как оценивалось

Адаптивность
Моя любимая тема — наличие адаптивного дизайна. В этом году я все банки смотрел на смартфоне и не оценивал их версию для настольных компьютеров, потому что дизайн под мобилы сейчас надо делать прежде, чем дизайн под десктопы (кроме редких случаев, когда известно что ЦА работает с сайтом прежде всего с компьютеров). Поэтому, если у меня возникали проблемы с навигацией, то это прежде всего навигация в адаптированном дизайне. Так как адаптивный дизайн теперь есть у всех банков, то его критерий оценки было качество дизайна главной страницы. Если в основном вопросов к ней не возникало, то сайт получал «плюс», если возникало — «минус».

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

Интернет-банк в стиле сайта
Этот критерий я специально ввел, потому что многие из вас знают, что в интернет-банке (банк-клиент) у наших банков конь не валялся. Хотя эта услуга и называется интернет-банк, но на самом деле вы в нем существенно ограничены, а если вы не фирма, то для вас такой услуги нет вообще. Я уверен, что практически все наши банкиры, запускают свой интернет-банк как отдельный сайт (ну, это нормально) и годами там ничего не меняют. В Интернет-банке ОФБ до сих пор висит старый логотип. Уверен, они просто боятся там что-то пошевелить, потому что если все развалится (из-за замены одного файла логотипа на сервере), то никто потом спасибо не скажет.

Поэтому вы работаете с документами в морально отсталых сервисах, с интерфейсом, который делал программист. Это отражается и на дизайне нового сайта, потому что интернет-банк каким был 5 лет назад, таким и остается. Банкиры там боятся что-то изменить. Конечно, это связано с деньгами (страхования нет), но это также сковывает наше развитие. Это все равно, что не строить самолеты, потому что они могут упасть.

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

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

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

В качестве теста я решил проверить: можно ли открыть любую карту через сайт, чтобы мне ее отправили на почту или привезли курьером (пусть и за деньги). Ни один банк не хочет, чтобы я открыл у него карту здесь и сейчас. Ориент-финанс и Хайтек-банк пытаются делать вид, что это можно сделать как белому человеку. На этих сайтах можно заполнить заявку, но вам все равно нужно будет приехать с паспортом в банк на своих двоих. Машин ленинг вот это все.

Что-то более-менее похожее предлагает Хамкор-банк, потому что он вытрясет из вас всю душу, пока вы будете заполнять три экрана с формами (на глаз не менее 30-ти) и даже когда вы укажете паспортные данные, все равно нужно будет загрузить к ним скан паспорта. К сожалению, мне не хватило терпения заполнять эти бесконечные поля на сайте через смартфон, поэтому я точно не знаю, чем это заканчивается. Но хочется верить, что они не просто так мучают людей. Также, вы должны там согласиться с офертой на 18 страницах. При этом в русской версии сайта ссылка идет на оферту на узбекском языке. Чую графена аромат.

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

Человеческий язык
Для банков люди — это физические лица. Я не знаю, когда у нас поймут, что нужно разговаривать с клиентами как с людьми. Эта категория требовала человеческого языка на сайте. Проверял на страницах «О банке» или «Миссия банка». В качестве хорошего текста с банковского сайта могу привести пример с сайта Сбербанка. Давайте, сравним.

Азия-альянс банк:
«ASIA ALLIANCE BANK» является молодым и динамично развивающимся банком в Республике Узбекистан. Банк осуществляет свою деятельность на основании Лицензии на осуществление банковских операций выданной Центральным Банком Республики Узбекистан №79 от 15 августа 2009 года.

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

Подбор вклада
Калькулятор вкладов должен быть и быть должен на странице вкладов. Если он работает удобно — еще лучше. Без калькулятора сложно сложить два и два, чтобы понять, что тебе выгодно.

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

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

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

Карта минибанков ОФБ

Правление банка с фото
Все банки показали список правления. Некоторые ограничились буквально списком, другие дали биографию в советском духе. Есть даже банке, где у членов правления отдельной строкой указана национальность — словно это имеет значение. У Равнакбанка место под фото есть, а фотографий нет. На сайте Туронбанка есть фотографии членов правления, но это просто унизительно плохие фотографии. Если они не могут сделать нормальные фото своего руководство, как они могут деньгами распоряжаться? И только Капиталбанк приложил усилия, чтобы показать лица людей, которые управляю вашими деньгами. Два года назад ситуация была такой же.

Теперь вы знаете как выглядит Председатель правления Равнакбанка

Таблица участников

KPL OFB AAB UNI IPK XLQ HTB HMK RVQ DVR AGR ALQ NBU TUR INF ZIR
1. Адаптивность + + + + + + + + + + + + +
2. Наличие интернет-банка + + + + +
3. Интернет-банк в стиле сайта +
4. Доступность
5. Открытие карты онлайн + +
6. Человеческий язык + + +
7. Подбор вклада + + +
8. Приложение + + + + + + + + +
9. Карта филиалов и банкоматов + + + + +
10. Правление банка с фото + +
Баллы 5 6 3 3 1 1 1 6 3 2 2 1 4 4 0 1
Пыльца 0 0 0 0 0 0 0 +0.1 +0.1 0 0.1 0 0 0.1 0 0
ИТОГО: 5 6 3 3 1 1 1 6.1 3.1 2 2.1 1 4 4.1 0 1
Лучший банковский сайт в этой стране

Лучшие банковские сайты Узбекистана в 2019 году

Выводы

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

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

Рабочие столы российских дизайнеров из 2003 года

16 лет назад был такой сайт Astarta.com. Его вела иллюстратор Ева и кроме своих иллюстраций собрала там скриншоты рабочих столов знакомых лично и онлайнно дизайнеров и иллюстраторов. Если кто-то застал те времена, то могут вспомнить про Анкла, Смарта, Экзакта, Йована, Корнея или Спая. Сейчас сайт доступен только через Веб-архив (используйте ВПН), но скриншоты рабочих столов там не сохранились, зато интересно заглянуть в папку с другими изображениями, среди которых, например, снег в Москве в 2001-м году ☺️.

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

В заметке только первая часть, если вам нужны все 88 скриншотов, то скачайте невероятные 13 Мб архивом. Олдфаги есть?

 Нет комментариев   2019   веб-дизайн   история

Проходит ли сайт Булавки тест Гугла Masterful Mobile Web?

Гугл опубликовал исследование готовности сайтов к пользователям со смартфонами (вместо ПК). Я не могу сейчас осилить и проверить наши интернет-магазины, но сделать это с одним сайтом — Булавка — можно. Я буду указывать соответствует ★ ли сайт требованиям Гугла или нет ☆, по возможности с комментариями. Сортировка списка по убыванию: чем ближе к концу списка, тем меньше сайтов (Европе, Ближнем востоке и Африке) выполняют эти условия. По США в выборке нет, в России дела обстоят лучше.

Тест Retail Masterful Mobile

  1. Дизайн страниц. ★ Страницы должны быть выдержаны в стиле бренда.
  2. Внешнее связывание. ★ Это замороченная хрень, суть которой в том, чтобы направлять пользователя куда надо, а не просто на главную страницу.
  3. Последовательный опыт. ★ Использование одинаковых на вид версий сайта как для настольных ПК, так и для смартфонов, чтобы пользователь не путался в интерфейсе при переходе между устройствами.
  4. Нет новых табов. ★ Все ссылки открываются внутри текущего таба.
  5. Призыв к действию. ★ В русском переводе звучит тупо, но это просто, когда вы вместо «Поиск» на кнопке пишите «Искать».
  6. Достоверные отзывы. ☆ А вот этого у нас на сайте нет. Есть в фейсбуке, но не на сайте. Причем также косячат только 6% магазинов, которые исследовал Гугл. В нашем случае это связано с тем, что много товаров идет в малом количестве. Стоит только купить одну рубашку, как она пропадает из выдачи и кто теперь к ней будет отзыв читать, если у нас такой больше нет? Но это очень важный элемент и его надо внедрять.
  7. Разборчивые заголовки. ★ В целом у нас с этим проблем нет, кроме страницы товара. Там предстоит много работы.
  8. Достаточно времени на оформление заказа. ★ Согласно мнению Гугла, нужно давать не менее 30 мин на возню в Корзине, до того, как данные в ней будут сброшены. Я точно знаю, что товары в Корзине у нас могут лежать несколько дней, но точное время для указания адреса доставки и проч. предстоит еще выяснить ))
  9. Заметный поиск. ★ Форму поиска нельзя прятать за словами или иконками — лучше, чтобы ее было всегда сразу видно.

1. Хороший вывод результатов поиска. ☆ С этим мы справляемся неидеально. Если искать «мужские кроссовки», то на первой странице действительно будут мужские кроссовки и скорее всего вы найдете, что искали. Однако, всего поиск выдаст более 600 товаров на такой запрос, а у нас нет столько кроссовок для мужчин. После правильных результатов пойдут кроссовки для мальчиков, потом другие товары для мужчин, что вроде логично, но не то, что мы ищем.

  1. Информация о доступности товара. ★ Если у нас нет товара вообще, то мы его не показываем в выдаче. Если вы используете старый адрес и там товара уже нет, то его нельзя заказать и там что-то написано об этом.
  2. Доступность аккаунта. ★ С любой страницы вы можете создать новый аккаунт. Более того, вы можете заказать у нас товары, без создания аккаунта.
  3. Высококачественные изображения. ★ При клике на фото, вы можете разглядеть у нас самые грязные подробности товара.
  4. Доступный горизонтальный вид. ★ Нужно, чтобы сайт нормально работал и в горизонтальном мобильном виде.

1. Подходящие результаты. ★ Здесь у нас все нормально, потому что хотя мы вам и выдаем 600 результатов по кроссовкам, но самые первые будут тем, что вы искали.

1. Нет всплывающих окон. ★ У нас есть слои, но окон нет.

1. Демонстрация активности. ★ Нужно, чтобы пока грузится контент, была какая-то анимированная заглушка, чтобы ждать было веселее. Прямо гифок у нас нет, но и загрузка у нас не долгая. Вместо анимации мы используем цветные блоки, которые появляются в местах, где загрузится фото. Так что в целом, при загрузки страницы, не будет складываться ощущения, что что-то сломалось и все встало.

  1. Незагроможденность страниц. ★ Нужно, чтобы на страницах хватало «воздуха» и необходимых отступов между блоками. У нас небольшой бардак на странице товара, но в целом все ок.
  2. Перелистываемые изображения. ★ Нужно, чтобы ваши фотки можно было листать жестами с помощью пальцев, а не только кликая на кнопку/иконку «Далее». На Булавке это работает.

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

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

  1. Изолированный процесс покупки. ★ Когда вы начинаете оформлять заказ, на экране не должно быть ничего лишнего, что могло бы вас увести со страницы. Нужно, чтобы пользователь сосредоточился на заказе и не отвлекался на другие элементы.
  2. Прогресс-бар. ☆ При оформлении заказа, как правило, бывает несколько шагов. Гугл требует, чтобы эти шаги были отображены в виде прогресс-бара и я с ним согласен. У нас сейчас все шаги на одном экране, поэтому у нас этого нет (потом сделаем).
  3. Безопасность. ★ Требуется использовать протокол HTTPS.
  4. Наличие фильтров. ★ У нас одни из лучших фильтров в узнете для интернет-магазинов.

1. Без скрытых расходов. ★ В идеале на странице товара должна быть указана максимально возможная цена товара сразу: с учетом налогов (если есть), стоимости доставки и так далее. Этого всего мы сразу не пишем, но при оформлении, у нас добавляется только (ожидаемая) стоимость доставки.

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

  1. Формы по-божески. ☆ Гугл требует, чтобы к формам были подсказки, названия форм были снаружи и выравнивание текста было по левому краю. Мы используем формы как у них в material design, что на вид не то, о чем они просят в этом тесте.
  2. Автозавершение форм. ★ Требуется, чтобы при поиске выпадали подсказки, не требующие полного ввода слова.
  3. Упрощенные платежи. ★ Нужно давать возможность платить через платежные системы или сканировать карты. Мы используем оплату через Клик и Пейми, кроме прочих вариантов. К слову, только 75% магазинов отвечает этим требованиям.
  4. Доступность важной информации. ★ Гугл хочет, чтобы ссылки на информацию о способах оплаты, доставки, размерах были легко доступны.
  5. Обязательные поля. ★ Обязательные поля должны быть явно отмечены как обязательные.
  6. Сохраненные данные. ★ У нас это есть, наверное, просто мы не делаем так, что где-то потом надо сохранять данные, потому что все формы на одной странице.
  7. Подсказки в формах. ☆ У нас их нет. Если мы пишем, что нам нужен ваш адрес электронной почты, то не пишем зачем (понятно из контекста).
  8. Отсутствие карусели. ★ Внезапно, Гугл против слайдера (карусель). Я давно говорю об этом, но клиенты все еще любят ставить слайдер. Гугл допускает использование карусели, если она сделана хорошо и в меру. Значит, она не грузится долго и она не содержит много слайдов.
  9. Количество результатов. ★ Теперь начинается интересное. Здесь и далее указанный функционал поддерживается только на 66% интернет-магазинов, т. е. все, что ниже как минимум треть игнорирует и это плохо. Гугл считает эффективным показывать пользователям сколько элементов было найдено. Мы так и делаем (см. выше про 600 кроссовок).
  10. Очевидная цена. ★ Итоговая сумма за заказ должна быть очевидной с выпиской всех нюансов (налоги, скидки и т. д.).
  11. Номерная клавиатура. ☆ Если в форме нужно ввести только цифры, должна выходить номерная клавиатура. Не зря я статью эту пишу, у нас это не так. Во всяком случае в форме с номером телефона, но мы это точно исправим.
  12. Автозаполнение. ★ Не знаю, почему это отдельная категория, но об этом уже говорилось, просто в этот раз речь идет о регистрации, например, а не о поиске, где автозаполнение чаще используют.
  13. Кликабельные номера телефонов. ★ О, да, я всегда топлю за это. Номера телефонов должны быть кликабельны в адаптивном дизайне, чтобы можно было позвонить по тапу. 42% магазинов игнорируют этот важный и простой в реализации пункт.
  14. Озвучивание дефицита. ☆ Ну такое. Гугл хочет, чтобы мы сразу писали, если на складе осталось мало таких товаров, но многие маркетологи всегда так пишут, чтобы люди торопились заказывать, хотя на самом деле им некуда торопиться.
  15. Показать больше. ★ Уж не знаю откуда такая проблема, но согласно отчету 43% магазинов не имеют заметную ссылку «Далее», «Показать еще», «Следующая» и т. д. У нас с этим все ок.
  16. Оповещение о бесплатной доставке. ☆ Это хорошая фича, которой на Булавке нет. Нужно показывать пользователю сколько нужно заказать, чтобы получить бесплатную доставку. Например: закажите товаров еще на 2000 сумов, чтобы получить бесплатную доставку.
  17. Множественный выбор фильтров. ★ Наверняка вы бывали на сайтах, где выбираешь пункт в фильтрах и тебе начинает перегружать страницу с новыми результатами. Потом ты выбираешь второй другой пункт и снова обновляются данные. Гугл считает, что так поступают только козлы и надо дать пользователю сначала все выбрать как ему надо и потом по команде кнопки «Применить» или аналогичной, обновить результаты.
  18. Гостевые покупки. ★ Ваш магазин должен давать возможность покупать без обязательной регистрации. Привет, Амазон.
  19. Предлагаемый контент. ☆ Эта история тянет свои ноги из того, что в США очень часто используются почтовые индексы и к ним все привязано. Поэтому Гугл хочет, чтобы ваша форма подгоняла адрес, стоит только ей указать индекс (zip code).
  20. Помощь при отсутствии результата поиска. ★ Если ваш клиент искал и ничего не нашел (нет у вас таких товаров или он сделал что-то не так), то вы должны на такой странице дать какие-то подсказки или контакты. У нас есть подсказки по поиску.
  21. Дополнительные продажи. ☆ Нужно, чтобы если клиент покупает фонарик, вы предлагали ему купить батарейки и еще лучше, если вы дадите скидку на набор фонарик+батарейки. В Булавке этого нет по разным причинам, но многие магазины, продающие технику имеют такой функционал.
  22. Следующие шаги. ★ На странице с результатами поиска должно быть больше возможностей: фильтры, предложения на карте, сортировка. На Булавке есть подкатегории и фильтр цены, но нет сортировки, например.
  23. Ошибки в реальном времени. ☆ Например, если пользователь в форме электронной почты вводит русские буквы, то следует сразу показывать ошибку и выделять форму. Не потом, когда он нажмет кнопку, а сразу.
  24. Сменные изображения. ☆ Если у вас есть несколько размеров, цветов или типов товаров, которые идут в одной группе (например, разные цвета носков), то следует дать возможность пользователям посмотреть на эти другие товары, а не ограничиваться выбором цвета/объема и т. д. На Булавке такого нет, у нас вообще нет понятия выбор цвета. Для каждого другого цвета создается отдельное описание товара. Этот функционал надо делать.
  25. Увеличиваемые изображения. ★ Есть зум — молодец, нет — пока. Более половины сайтов не дают увеличить фото, дичь какая-то.
  26. Дата доставки. ☆ Мы не указываем дату доставки, потому что любой товар по всему Узбекистану мы доставляем за два дня. Удобнее, конечно, писать, но у нас многие и не заметят. Это актуально, если доставка затягивается на три дня и более.
  27. Повторный поиск. ☆ Нужно иметь возможность легко удалить поисковый запрос (обычно через иконку ✕) или изменить его (например: при бронировании отеля, настройки поиска должны сохраняться в полях, чтобы при изменении условий, не нужно было выбирать все заново). У нас нет иконки ✕, потому что в том месте стоит иконка поиска, которая работает как кнопка (что уже странно). Нужно подумать, как это исправить.
  28. Расшариваемость. ☆ Хочет кнопки для публикации страницы с товаром в соцсетях. Только 40% интернет-магазинов имеют встроенные в сайт инструменты для шаринга. Я думаю, что в целом звучит требование логично и хорошо, но на практике люди очень редко шарят товары. Смысла в этом не много. Все, что им нужно: добавить в избранное, переслать другу.
  29. Преимущества регистрации. ★ На странице регистрации мы пишем для чего это нужно, но так делают далеко не все.
  30. Иконки подписаны. ☆ У нас не подписаны. В целом у нас мало иконок в интерфейсе, а там, где они есть мы бережем место. Однако! В планах есть увеличить в два раза высоту верхнего блока, потому что есть подозрение, что люди не понимаю на какой сайт попали, так как у нас там вместо надписи Bulavka, сделана только одна буква «В.».
  31. Гостевой список желанных покупок (вишлист). ☆ Он на Булавке есть, но требуется регистрация. Сейчас уже не помню, с чем это связано. 70% сайтов не имеют вишлиста для гостей (без авторизации).
  32. Исправление ошибок в поиске. ☆ Вот это хорошее замечание. Если вы в поиске Булавки напишите «джинсы», то найдете, что искали. Однако, с джиинсами это уже не прокатит, а должно.
  33. Сохранение истории поиска. ☆ Гугл хочет, чтобы вы сохраняли историю поиска товаров в интернет-магазине. Это относится в том числе к неавторизованным пользователям. Из всего перечня требований к интернет-магазинам — это соблюдается реже всего (24%).

По итогам выходит, что 41 пункт из 60 Булавка поддерживает, но 19 — нет. Это почти 33%, что довольно много. Я не думаю, что можно отвечать всем требованиям, но еще пунктов на 10 улучшить пользовательский опыт вполне себе можно, займемся этим.

 Нет комментариев   2019   ux   веб-дизайн   навигация   сайты

Как потратить на сайт 200 $ и получить его через неделю

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

Коротко: установите шаблон для Вордпресса.

Как обычно выглядит процесс разработки сайта в Узбекистане

За всех говорить не хочу, но примерную схему расскажу:

  1. Поступает заявка от клиента.
  2. Через 1-5 дней назначается встреча и все обсуждается.
  3. Еще через 2-3 дня отправляется коммерческое предложение.
  4. Спустя неделю договариваются о цене. Это в тех случаях, если цена оказалась приемлемой в итоге. Если это корпоративный сайт, то цена будет 1000-10 000 $. Для интернет-магазинов ценник уже выше: 2000-30 000 $ — многое зависит от того, что вам нужно.
  5. Теперь нужно написать и утвердить техническое задание. На это тоже уйдет время: от пары дней до месяца.
  6. Начинается дизайн сайта. Здесь я не говорю о подготовительных работах вроде выездов на место, изучение конкурентов и так далее, потому что во-первых: практически никто этого не делает, во-вторых: большинству клиентов это не надо, они не смогут обеспечить разработчикам обратную связь, потому что сайт хотят, а делать его не хотят.
  7. Потом череда утверждений и правок еще на месяц.
  8. После следует верстка, установка на движок (натягивание на барабан, порой) и программирование, если требуется. На это уйдет еще от 2 недель.
  9. По идее дальше нужно протестировать и наполнить контентом, но обычно про это все забывают, если только запуск сайта не был суперважной задачей. Например, если это интернет-магазин, то просто на отвали сделать его не выйдет — смысл?

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

После запуска сайта, потребуется еще оптимизация для поисковых систем, иначе о вашем сайте никто не узнает. Лучше всего начать эту работу еще на этапе написания ТЗ

Как можно сделать иначе

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

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

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

Сайты на Вордпрессе делают почти все студии в Узбекистане. Разве, что кроме одной, которая делает на Битриксе, чтобы вы далеко не уходили от них.

Разница только в том, что разработчики сделают вам эксклюзивный дизайн и функционал (как вы хотите в идеале) и запустят это на ВП или вы попросите их настроить нужный вам уже готовый шаблон, что будет стоить значительно дешевле — примерно 100-200 $. Студии не нужно будет рисовать дизайн, не нужно верстать, не нужно программировать — все будет сделано до них. Скорее всего, вы захотите что-то подправить (но это не обязательно) — за это придется доплатить, все в ваших руках.

Если вам лень искать студии, попробуйте Стайлмикс или Биллз (если у вас интернет-магазин). Главное, что вам нужно объяснить: нам нужен сайт на готовом шаблоне Вордпресса. Если студии будут заряжать, поищите фрилансеров, которые хорошо знают Вордпресс.

Шаблоны Вордпресса

Шаблон — фактически сверстанный дизайн вашего сайта. Это все равно, что костюм на вешалке, который нужно купить и надеть. Самый дорогой шаблон стоит 70 $ — как правило, это интернет-магазин или шаблон «все в одном». Темы (так еще называют шаблоны) делятся по категориям, чтобы они больше подходили под тематику вашего сайта. В Вордпрессе вы сможете настроить цвета, шрифты, блоки, картинки и так далее. На самом деле настроек очень много, но и возни с ними тоже бывает не мало. Чем больше вы захотите настроить шаблон под себя, тем дороже вам это встанет. Но если вы готовы запускать что-то работающее, то сделать это можно быстро.

Шаблоны бывают бесплатными и платными. Еще бывают платные шаблоны бесплатно — их я не советую качать и устанавливать, потому что там часто бывают зашиты спамерские или фишинговые скрипты (это плохо).

Пример дизайн бесплатного шаблона для интернет-магазина

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

Если у вас есть лишние 30-70 долларов, то лучше купите шаблон на сайте Темфореста. Советую потыкать в фильтры и категории слева, чтобы получить нужные вам темы. Посмотрите все, что вас заинтересует; изучите возможности настроек в демо-версиях; определитесь с дизайном, который больше всего вам подходит.


Пример дизайна блога в платном шаблоне (поддерживает три вида формата)

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

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

Много сайтов в Узбекистане сделаны на основе готово шаблона, но владельцы даже не знают об этом.

Ранее Ctrl + ↓