Как настроить смартфоны и ПК. Информационный портал
  • Главная
  • Вконтакте
  • Что такое мобильный лендинг. Номер телефона, доступный для звонка в один клик

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

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

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

Исследование Люка Вроблевски (Luke Wroblewski), директора по продуктам Google и автора книги «Сначала мобильные!» показывает, что в период с 2009 по 2013 потребление контента через привычные каналы, такие как телевидение, радио, печать, значительно снизилось. Единственный показатель, который вырос — использование мобильных устройств.

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

Даже в 2015 году у большинства пользователей возникает целый ряд затруднений:

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

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

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

1. Сайт не оптимизирован для мобильных устройств

Еще в декабре 2012 года медиа-ресурс Mashable провозгласил наступающий 2013 годом адаптивного дизайна. Крупнейшие компании тогда обратили на это внимание и разработали мобильные версии своих ресурсов. Но многие не могут похвастаться корректным отображением страниц до сих пор.

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

Ритейлер одежды «O’Neill Clothing» достиг впечатляющих результатов после того, как его маркетологи применили адаптивный дизайн. Они отслеживали три главных показателя: конверсию, количество сделок и выручку на протяжении трех недель до и после применения технологии. Результаты были невероятными.

iOS устройства:

  • Конверсия увеличилась на 65.71%
  • Количество сделок — на 112.50%
  • Выручка — на 101.25%

Устройства Android:

  • Конверсия увеличилась на 407.32%
  • Количество сделок — на 333.33%
  • Выручка — на 591.42%

Можно привести немало примеров, которые иллюстрируют явные преимущества адаптивного дизайна. Специалисты из «Skinny ties», компании, занимающейся созданием галстуков с 1971 года, отметили рост выручки на 42,4% после запуска мобильной версии ресурса. В фирме по производству фотоэкипировки «Think Tank Photo» количество сделок, заключенных с помощью смартфонов и планшетов, выросло на 96% по сравнению с предыдущим годом.

2. Игнорирование целей пользователя

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

Вице-президент компании «UserTesting» Майк Мэйс (Mike Mace) провел исследование тысяч мобильных версий. Вот его заключение: «Вы должны переделать ваш сайт специально для мобильных устройств, а не просто скорректировать его. Мобильная версия — это не только другой набор технологий, это еще и другое поведение пользователя, другие ожидания».

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

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

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

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

Если пользователи видят длинные формы на своем мобильном устройстве, они будут стараться избежать утомительных интеракций. Автор книги «UX для бережливого стартапа» Лаура Клейн (Laura Klein) отмечает: «Ожидание, что пользователи мобильных устройств будут вводить данные таким же образом, как и обладатели стационарных компьютеров — самая большая ошибка многих компаний».

Несколько советов для создания максимально удобных и понятных форм:

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

Стивен Хубер (Steven Hoober), проектировщик пользовательского взаимодействия для мобильных устройств, дизайнер и автор книги «Проектирование мобильных интерфейсов» советует: «Убедитесь, что каждая зона прикосновения находится по крайней мере в 8 миллиметрах от центра другой, хотя расстояние в 10 миллиметров даже предпочтительнее».

Ссылки, поля форм и другие важные элементы должны быть достаточно большими, чтобы пользователи могли с легкостью нажимать на них. С такой целью компания «Apple» установила минимальный размер объекта — 44х44 пикселя. Теперь этот стандарт используется для всех продуктов компании.

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

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

Вместо заключения

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

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

Дата публикации: 05-07-2016 1523

Последние годы все быстрее и быстрее развивается индустрия мобильного интернета, и на данный момент создание мобильной версии для своего лендинг пейджа уже больше необходимость, нежели роскошь. На такой трафик на сегодняшний день приходится около 10-15% в обычных нишах, и более 30-40% в нишах о красоте, моде, здоровье.

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

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

Инструкция создания мобильной версии лендинга

1. Если вы знакомы с нашим конструктором лендинг пейдж, и у вас уже создан сайт на нашем конструкторе лендингов, то вам достаточно просто подключить тариф GRAND.

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

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

2. У вас будет подключена мобильная версия сайта.

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

Чтобы создать нужно:

  1. зарегистрироваться на конструкторе Tobiz;
  2. создать лендинг пейдж на нашем конструкторе сайтов самостоятельно или с помощью готовых . лендингов, выбрав любой понравившйся вам из списка предложенных;
  3. после того, как вы отредактировали шаблон и подстроили сайт под себя, обязательно подключите домен к лендинг пейдж, чтобы ваш сайт начал высвечиваться в поиске и начал свою работу;
  4. затем перейдите в тарифы и подключите тариф Grand BIZ или Grand VIP.

■ В итоге вы получите мобильный лендинг совершенно бесплатно и автоматически настроенный.

Для адаптирования сайта для мобильных устройств конструктор сайтов Tobiz специально предусмотрел данную возможность, чтобы помочь вам сэкономить деньги и время. Так как, если вы наймёте программиста для разработки мобильной версии лендинга , вы потратите минимум 15-20 тыс. руб дополнительно, а это ещё нужно будет заплатить за создание самого лендинг пейджа и его техническую поддержку (плюс около 5 тысяч ежемесячно).

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

■ Если вы будете следовать нашей инструкции, то в итоге вы получите 3 варианта мобильной адаптации лендинг пейдж.

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

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

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

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

Разрабатывайте лендинги только адаптивные

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


Проверяйте все элементы лендинга на всех устройствах и популярных браузерах

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

Выводы:

— Следите за загрузкой своего продажника;

— Используйте хорошие оптимизированные изображения и видео;

Следующая публикация из книги — Тестирование лендинг пейдж.

Возможно Вам будет интересно:

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

Поэтому если Вы не занимаетесь , то Вы теряете половину своей .

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

Так как самостоятельно это сделать будет затруднительно.

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

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

Основные типы целевых страниц

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

Итак, всего различают 4 вида страниц - это:

1. Микросайт;
2. Главный Сайт;
3. Автономная целевая страница;
4. Страница сегментации.

К микросайту относится такой сайт, на котором расположена информация о различных рекламируемых услугах, а также товаре.

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

Главный сайт более структурирован и включает уже большое количество страниц и информации.

Но он обладает низкой целевой аудиторией, так как она малоэффективна.

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

Итак, страница сегментации направлена на повышение конверсии.

Инструкция «как создать мобильный Лендинг Пейдж»

Так как существует множество различных сервисов, инструкция может отличаться.

Поэтому мы укажем на основные действия, которые необходимо предпринимать:

  • Во-первых, необходимо адаптировать верстку. Этот принцип достаточно доступный, и именно он обеспечивает конкретное изображение страницы с любого устройства. В итоге, уже будет неважно с какой системы клиент зашел на Ваш сайт. Потому что он все ровно перейдет на обозначенную вами страницу. Если это мобильная версия сайта, то она должна включать как можно больше информации. Где выгодно заказать лендинг пейдж - узнайте по
  • Во-вторых, подготовьте качественный дизайн. Если Ваш сервис основывается на доставку еды, то необходимо разработать правильный и лаконичный мобильный дизайн. Существует правило, чем меньше «экран монитора», тем больше красок необходимо поместить. Очень часто для того, чтобы создать мобильный landing page, используют адаптивный дизайн. Потому что он позволяет открыть страницы вне зависимости от того, с какого устройства Вы их посещаете.

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

65% цифрового рынка - мобильные пользователи. 50% хватаются за смартфоны сразу после пробуждения. Необходимость мобильных лендингов не подлежит обсуждению.

В этой статье - 11 советов как улучшить пользовательский опыт владельцев девайсов.

Уменьшите время загрузки

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

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

Данные о скорости загрузки страниц можно получить в Google Analytics, отчеты «Поведение» - «Время загрузки страниц»:

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

В интернете много инструментов, которые помогут оценить время загрузки и скорость: Google PageSpeed Insights, Mobitest и другие.

Что еще сделать, чтобы ускориться:

  • Почистить код;
  • Минимизировать использование сторонних скриптов;
  • Использовать сжатие GZIP;
  • Убрать редиректы;
  • Уменьшить изображения и использовать для загрузки сеть доставки контента (сервера, которые ускоряют доставку контента пользователям).

Изучите девайсы пользователей

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

Ищите отчеты в разделе «Аудитория» - «Мобильные пользователи»:

Здесь конкретные марки устройств:

И данные по разрешению экрана:

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

Добавьте на страницу корзину

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

Так вы убьете двух зайцев: с помощью cookies узнаете о поведении посетителей и получите статистику, какие товары чаще оставляют в корзинах.

Расположите главные кнопки правильно

Как мы держим гаджеты и какие пальцы используем для навигации?

В 49% случаев смартфон лежит в левой руке, а большой палец правой перемещается по экрану.

А так с годами менялось расположение большого пальца на айфонах:

Учитывайте это при планировании кнопки призыва к действию.

Прикрутите клавиатуру к формам

Нужно заполнить форму? Предложите пользователю клавиатуру:

Помогут вставки в код:

Такой шаг ускорит конверсию.

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

Вариант слева короче, потому и предпочтительнее.

Сделайте выгодное предложение

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

Неплохо сыграть на страхе упустить выгоду (FOMO) - предложите купон на скидку с ограниченным сроком действия, например, вот так:

«Подпишитесь на мобильные уведомления и получите скидку 20%. Отправьте SMS с текстом Save01 на короткий номер и получите скидку».

Кстати, можно применить мобильный поп-ап. Главное, чтобы предложения (скидка, акция) были стоящими.

«Каждый день скидки до 70%! Подпишитесь и будьте в курсе наших акций».

Продумайте дизайн мобильного лендинга

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

На скриншоте - оптимизированный и не оптимизированный под мобайл сайт:

С каким вариантом проще и приятнее работать? Ответ очевиден.

Выделите призыв к действию

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

Чтобы «приковать» их внимание к кнопке CTA (призыва к действию), используйте контрастный цвет. Не знаете, какой выбрать - обратитесь к колесу цветов:

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

На что еще обратить внимание?

  • Расположение кнопки. Не бойтесь опускать ее ниже сгиба, но не помещайте туда, где и так много элементов.
  • Размер кнопки. Apple рекомендует 44х44 пикселей, на основании юзабилити и среднего размера пальца. В 57 пикселей прекрасно вписывается указательный палец:

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

Закрепите хедер и футер

Особенно, если лендинг длинный и нужно скролить вниз. Исследование журнала Smashing Magazine показало, что «липкие» хедер и футер повышают скорость навигации на 22%. Как это выглядит:

На изображении - навигация при закрепленном хедере. Главное - не перегружайте его элементами и опциями.

Поместите предложение над сгибом

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

Поместите текст и изображения в одну колонку

Посмотрите на два экрана:

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

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

Высоких вам конверсий!

Лучшие статьи по теме