Адаптируем сайт под мобильные устройства: 6 советов

Адаптируем сайт под мобильные устройства: 6 советов 

Хотите создать превосходную целевую страницу для своих потенциальных клиентов, не задумываясь о том, с каких устройств они выходят в интернет? Что же, успех вряд ли возможен. Ведь посещая ресурс со смартфонов, ваши гости будут вынуждены пользоваться зумом, чтобы ознакомиться с контентом. Им придется скроллить вниз в поисках кнопки CTA (call to action — призыв к действию). А их пальцы будут болеть от прокручивания нескончаемо длинной лендинговой страницы.

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

№1: Учитываем потребности «мобильной аудитории»

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

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

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

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

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

№2: Заменяем CTA на CTC

Как уже было отмечено, в рамках принятия покупательского решения люди сначала собирают информацию. В этой связи логичным дополнением целевой страницы, заточенной под мобильные устройства, становится кнопка CTC (click to call — кликнуть, чтобы позвонить). На ней должен содержаться призыв вроде: «Нажмите, чтобы позвонить нам».

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

Исследования показали, что после размещения на оптимизированном под смартфоны сайте кнопки CTC количество звонков увеличивается на 10-20%!

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

№3: Упрощаем работу с сайтом

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

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

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

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

Если же вы все-таки используете анкетирование, то проследите за тем, чтобы при помещении курсора в строку автоматически переключалась клавиатура мобильного телефона. То есть для граф, где требуется введение текста, должна включаться алфавитная раскладка. Для номеров телефонов – цифровая. Для почты – алфавитная с «@». И так далее.

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

№4: Смотрим по-новому на «above the fold»

Термином «above the fold» называется верхняя часть страницы сайта — та, которую вы видите без прокрутки вниз. Именно на ней обычно сосредотачивается основная информация, позволяющая «зацепить» внимание зрителя. В частности, располагаются элементы призыва к действию (CTA)

Однако оптимизация целевой страницы с акцентом на участке «above the fold» является сложной задачей ввиду многообразия мобильных устройств. Размеры и разрешение экрана будут совершенно различными, а потому подстроиться вам будет сложно.

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

№5: Урезаем содержимое

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

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

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

Более того, не лишним будет обратить внимание пользователей на простоту и понятность сайта. Можно прямо так и написать: «Заходите к нам с мобильного и получайте удовольствие».

№6: Адаптируем аккаунт под медленный интернет

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

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

Чтобы убедиться в том, что ваш ресурс отличается быстродействием:

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

Если и после этого вы не уверены в том, что ресурс загружается оперативно, воспользуйтесь сервисом вроде этого (http://validator.w3.org/mobile/). «MobileOK Checker» выполняет различные тесты на вашей странице, чтобы определить уровень ее дружественности мобильным устройствам.

 

Держим на контроле!

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