7 лучших практик для обновления сайтов электронной коммерции

Опубликовано: 2021-07-19

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

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

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

Это руководство будет охватывать:

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

5 признаков того, что пришло время для редизайна электронной коммерции (или, по крайней мере, значительных обновлений)

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

Однако это не означает, что редизайн исключен. На самом деле, есть несколько отличных сценариев, в которых это, вероятно, правильный вызов:

  1. Конверсия сайта низкая.
  2. Показатель отказов сайта высокий.
  3. Ваш клиент получает жалобы клиентов на функциональность сайта.
  4. Тема или ключевой плагин, на котором построен сайт, больше не поддерживаются разработчиком.
  5. Вы читаете эту статью.

1. Низкая конверсия сайта

Если ваш клиент имеет хороший объем входящего трафика, но низкий коэффициент конверсии, это может быть признаком того, что на сайте возникают проблемы с UX. Поднимите URL-адрес и начните щелкать. Вы, вероятно, сможете заметить, в чем проблема, довольно быстро.

Некоторые вопросы, которые вы можете задать себе:

  • Легко ли следовать навигации?
  • Являются ли страницы продуктов понятными и удобными для совершения покупок?
  • Работает ли сайт и оформление заказа на мобильных устройствах?
  • Правильно ли отображаются всплывающие окна и виджеты?
  • Легко ли просмотреть корзину?
  • Безопасно ли вводить информацию о кредитной карте?

Хотя редизайн сайта — не единственный способ решить некоторые из этих проблем (и, конечно, не единственный способ повысить коэффициент конверсии), это один из способов решения некоторых основных проблем, особенно если вы столкнулись с больше одного.

2. Высокий показатель отказов сайта

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

Согласно исследованию Google , проведенному в 2017 году, когда время загрузки страницы увеличивается с 1 секунды до 5 секунд, вероятность отказов увеличивается на 90%.

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

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

3. Ваш клиент получает жалобы клиентов на функциональность сайта

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

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

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

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

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

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

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

5. Вы читаете эту статью

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

Прислушивайтесь к своим инстинктам.

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

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

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


Почему вы должны быть осторожны при обновлении сайтов электронной коммерции

Чтобы было ясно, «осторожный» в этом смысле не означает «не делай этого». Веб-дизайнеры без проблем обновляют сайты электронной коммерции каждый день, и вы тоже можете!

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

Время простоя означает потерю продаж и снижение доверия

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

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

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

Перезапись базы данных может привести к потере заказов на действующем сайте.

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

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

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

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

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

Возможно нет. Вы нажмете «Обновить», запутаетесь и, возможно, даже откроете вместо этого веб-сайт конкурента.

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

Теперь, когда вы знаете несколько вещей, о которых следует помнить при обновлении сайтов электронной коммерции, давайте перейдем к главному!


Рекомендации, которым следует следовать, чтобы избежать простоев или потери дохода

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

7 советов по безопасному обновлению веб-сайта электронной коммерции:

  1. Убедитесь, что WordPress, тема и ключевые плагины обновлены.
  2. Рассмотрите возможность уведомления пользователей о техническом обслуживании сайта, чтобы они знали, когда не делать покупки.
  3. Разместите страницу обслуживания, пока вы публикуете обновления.
  4. Сначала внесите изменения на локальном или промежуточном сайте, а затем обновите работающий сайт.
  5. Проверка качества до и после публикации изменений.
  6. Используйте итеративное тестирование (когда можете).
  7. Имейте план поддержки на случай, если что-то пойдет не так.

1. Убедитесь, что WordPress, тема и основные плагины обновлены.

Решит ли этот шаг все ваши проблемы с обновлением? Нет.

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

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

(Мы все знаем, как быстро они могут сложиться, особенно если ваш клиент управлял своим собственным сайтом до того, как пришел к вам!)

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

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

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

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

И говоря о том, «когда происходят обновления», если вы или ваш клиент беспокоитесь об этом, еще один шаг, который вы можете предпринять, — это внести изменения в «нерабочее» время (например, поздно ночью, если большая часть их продаж приходится на 9 часов). -5).

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

3. Разместите страницу обслуживания, пока вы публикуете обновления в реальном времени.

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

Страница обслуживания или страница «Скоро будет» по существу скрывает весь контент вашего сайта, обычно с сообщением вроде «Обновления идут; зайдите в ближайшее время!"

Пример страницы «Режим обслуживания», созданной с помощью плагина WP Maintenance Mode.
Пример страницы режима обслуживания, созданной с помощью WP Maintenance Mode и бесплатной стоковой фотографии от Pexels.

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

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

Эти плагины могут помочь вам перевести сайт в режим обслуживания:

  • Режим обслуживания WP
  • Необычные скоро и режим обслуживания
  • Интеллектуальный режим обслуживания

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

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

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

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

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

Если вы раньше не использовали промежуточный сайт, посмотрите, предоставляет ли его ваш хост WordPress. (Flywheel и WP Engine включают промежуточный сайт в каждый план!) Если он еще не включен в ваш пакет хостинга, вам может потребоваться обновить план, чтобы разблокировать эту функциональность.

Что касается локальной среды, Local — это бесплатная локальная платформа для разработки, с которой вы можете начать работу менее чем за пять минут. Вы также можете подключить сайты Flywheel или WP Engine, что упрощает получение копии сайта электронной коммерции, чтобы вы знали, что среда и база данных совпадают.

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

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

Промежуточные сайты Flywheel и WP Engine вместе с Local позволяют вам работать с копией живого сайта (поэтому вы можете быть достаточно уверены, что если там что-то работает, то оно будет работать и в продакшене), но все же разумно подтвердить все работает как задумано, как только ваши изменения вступают в силу.

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

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

Эти ресурсы могут помочь при тестировании процесса оформления заказа:

  • Тестирование платежей WooCommerce: справочный документ WooCommerce
  • Контрольный список тестирования ядра WooCommerce: Контрольный список WooCommerce на GitHub
  • Ghost Inspector: приложение для проверки обновлений сайта.
  • Usetrace: система тестирования, не требующая кода
  • Cypress: среда сквозного тестирования JavaScript.
  • Puppeteer: библиотека Node для управления Chrome по протоколу DevTools.

6. Используйте итеративное тестирование (когда можете)

Если вы чувствуете себя ошеломленным количеством изменений, которые вам нужно внести на сайт электронной коммерции, в какой-то момент, возможно, стоит спросить себя: должны ли они происходить все сразу или их можно разделить на несколько небольших обновлений?

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

Это имеет несколько преимуществ:

  1. Если что-то сломается, будет легче отследить, что пошло не так (потому что у вас будет меньше строк кода для сортировки).
  2. Работа пользователей с меньшей вероятностью будет нарушена, так как вы будете обновлять только одну часть сайта за раз (а не весь сайт целиком).
  3. Если вы измеряете влияние обновлений вашего сайта (например, на скорость сайта или коэффициент конверсии), вы сможете точно определить, какие изменения вызвали результаты.

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

Для клиентов Flywheel ознакомьтесь с этой статьей о том, как использовать Git и Flywheel вместе.

7. Имейте план поддержки на случай, если что-то пойдет не так.

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

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

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

Если вы активны в сообществах веб-дизайнеров Facebook или Slack, подумайте о том, чтобы сделать то же самое или даже обратиться за советом, прежде чем запускать обновление.

Наконец, убедитесь, что вы знаете, как связаться со службой поддержки вашего хоста WordPress и любыми ключевыми темами или плагинами, которые работают на сайте, особенно если вы активируете новый в первый раз. Клиенты Flywheel и WP Engine имеют круглосуточный доступ к экспертам WordPress, которые всегда находятся в режиме ожидания, если возникнет проблема с сервером.

Нажмите здесь, чтобы узнать больше о поддержке Flywheel, поддержке WP Engine, или нажмите здесь, чтобы получить доступ к поддержке через панель инструментов Flywheel.

Некоторые члены команды поддержки Flywheel, также известные как наши инженеры счастья!

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

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


Обновляйте сайты электронной коммерции WordPress проще с помощью Flywheel

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

Откройте для себя отличие хостинг-партнера (вместо провайдера) уже сегодня!

УЧИТЬ БОЛЬШЕ