Текст книги "Мобильный маркетинг. Мобильные технологии – революция в маркетинге, коммуникациях и рекламе"

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

Реакция, которую вызвал к жизни переносной HoloLens, и то, что он накладывает оверлейную[8]8
  Оверлей (англ. overlay) – метод программирования, позволяющий создавать программы, занимающие больше памяти, чем установлено в системе. Встроенные компьютеры часто используют оверлеи, так как обычно система на кристалле содержит мало памяти и не поддерживает виртуальную память.


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

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

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

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

Конфиденциальность и будущее мобильных технологий

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

Первое рекламное видео Google Glass – очков дополненной реальности – скорее показывало модель ожидаемого функционала, чем реальные возможности устройства на тот момент. Одна из основных функций представлена так: человек надевает устройство и спрашивает, где его друг, – тут же на дисплее он видит местонахождение друга в дополненной реальности.

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

Итак, главная тема сегодня – прозрачность ценной информации и обмен ею.

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

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

Этот раздел следовало бы озаглавить «Будущее, которое кажется отдаленным, но на самом деле придет гораздо быстрее, чем мы думаем». Но остановимся на менее броском заголовке «Отдаленное будущее».

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

А это значит, что перемены в окружающем мире также окажутся весьма значительными. Из этого, на мой взгляд, вытекает вполне очевидная идея нарастающей второстепенности «мобильных технологий» (а кто-то скажет, что дело уже сейчас обстоит именно так). Внедрение технологий во всё, что мы делаем, и даже в нас самих как человеческих существ означает, что занятные маленькие устройства, которые мы повсюду носим с собой, в будущем покажутся пережитками Средневековья.

Согласитесь, такие рассуждения вполне логичны, и куда бы мы ни шли, мы будем постоянно соединены с интернетом, как бы он ни выглядел в будущем. Кроме того, вполне разумно полагать, что вычислительная мощь и искусственный интеллект сильно продвинутся вперед, и машины окажутся гораздо более «умными». Если представить, что разумная жизнь, возможно, не ограничивается органическими существами, тогда, боюсь, эту книгу придется отнести к категории научной фантастики. А приняв подобную логику, задумаемся и над возможностью управлять и взаимодействовать с электронными устройствами при помощи мысли. Ведь уже есть игры, в которых человек использует мозговые волны для управления физическими объектами (Fallon, 2009).

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

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

Будем практичны

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

Часть II. Тактический инструментарий

7. Введение

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

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

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

Самые последние технические приемы и проверенные практики

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

http://www.targetinternet.com/mobilemarketing/.

8. Мобильные сайты и отзывчивый дизайн

Давайте с самого начала проясним одну вещь: без сайта, оптимизированного под мобильные устройства, вам не обойтись. Это не значит, что он должен просто открываться на мобильных девайсах, – речь о том, чтобы при его создании вы учли путь потребителя в мобильной нише и обеспечили соответствующие положительные впечатления от вашего сайта. Чтобы сумели оценить разнообразные технические решения и выбрали оптимальный подход для достижения этой цели. А еще – чтобы на вас не давили ограничения интернет-платформы или системы управления контентом (CMS), которыми вы пользуетесь.

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

Более 50 процентов посетителей заходят на сайты с мобильных устройств (Sterling, 2016). А значит, потенциальное большинство вашей аудитории – мобильные пользователи. Одной этой причины достаточно, чтобы в первую очередь позаботиться о полной оптимизации сайта – прежде, чем оценивать возможность повысить коэффициент привлечения клиентов и сумму среднего чека за счет позитивного опыта покупок с мобильных устройств. А такой опыт повышает коэффициент привлечения до 76 процентов (Monetate, 2016).

Сосредоточьтесь на пути потребителя

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

КЛАССИЧЕСКИЕ ОШИБКИ

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

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

Преграда на пути

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

Тупик мобильного сайта

Знаете, что я ненавижу больше всего? Когда захожу на сайт со своего девайса, а меня перенаправляют на его мобильную версию. Конечно, ничего ужасного… однако сильно раздражает, когда оказывается, что контента, который мне нужен, на мобильном сайте как раз и нет. Однако технология разработчиков не позволяет мне зайти на стандартный сайт с мобильного устройства. Каждый раз, когда я пытаюсь зайти на главную страницу, меня перенаправляют на мобильную версию. Дайте же людям возможность зайти туда, куда им надо! Ну пожалуйста!

Универсальный размер

Это самый первый, самый простой и… наименее работоспособный подход. Вы можете создать единый сайт, который неплохо открывается и на настольных, и на мобильных устройствах. Но жертв не избежать, поэтому приходится выбирать, что пострадает – стационарный или мобильный сайт.

Единственный рабочий сценарий для универсального сайта – когда он очень простой и с ограниченным функционалом: например, это сайт-одностраничник или лендинг[9]9
  Лендинг – одна веб-страница, которая призывает пользователя что-нибудь сделать. Например, подписаться на рассылку, купить билет на конференцию, запросить смету или просто скачать презентацию. В отличие от полноценного сайта, лендинг предлагает сделать что-то одно.


[Закрыть] с формой для регистрации.

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

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

Специальный мобильный сайт

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

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

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

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

Использовать CMS для управления мобильными сайтами можно по-разному:

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

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

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

Отзывчивый дизайн

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

Такой подход реализуется путем комбинирования таких интернет-технологий, как каскадные таблицы стилей (CSS)[10]10
  CSS (англ. Cascading Style Sheets – каскадные таблицы стилей) – формальный язык описания внешнего вида документа, написанного с использованием языка разметки.


[Закрыть] и JavaScript. На основе данных технологий браузер оценивает такие параметры, как устройство, на котором работает посетитель сайта, или ширина и высота дисплея, и в зависимости от этого выбирает отображение страницы. На рисунке 8.1 показан сайт Target Internet. Посмотрите, как можно эффективно использовать отзывчивый дизайн. Слева у нас полная версия, справа – тот же сайт с сокращенным окном браузера. Видите – здесь не просто сузили размеры, но и адаптировали под них функционал.

Отзывчивый и адаптивный дизайн

Термины «отзывчивый дизайн» и «адаптивный дизайн» часто считают взаимозаменяемыми, хотя это разные вещи.

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

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

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

Гибридный подход

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

Рисунок 8.1. Эффективные сайты с отзывчивым дизайном

Источник: http://www.targetinternet.com

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

Палочка-выручалочка для мобильных сайтов

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

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

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

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

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

Приоритизация контента

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

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

Горизонтальная или вертикальная раскладка

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

Ссылки и кнопки

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

Размеры и графика сайта

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

Сокращенная иерархия

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

Интеграция с телефоном

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

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

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

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

– JavaScript – клиентский язык программирования (запускается и используется в браузере), обеспечивающий дополнительные функции веб-страниц. Часто его применяют, чтобы выбрать наиболее подходящие CSS для конкретного устройства.

– Отзывчивый дизайн – обеспечивает отображение веб-страниц для разных устройств, подстраивая раскладку и элементы страницы. Эта подстройка производится в браузере.

– Адаптивный дизайн – позволяет направлять конкретную версию веб-страницы на конкретное устройство или браузер. Если устройство и/или браузер известны, на них отправится только соответствующая версия страницы.

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

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

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

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

Примеры мобильных сайтов и отзывчивого дизайна

На нашем сайте есть замечательные практические примеры мобильных сайтов и отзывчивого дизайна (http://www.targetinternet.com/mobilemarketing).