Что такое браузерные уведомления
Браузерные push-уведомления: часто задаваемые вопросы
Что такое браузерные push уведомления?
Это уведомления, которые владельцы web-сайтов могут рассылать своим пользователям через браузер. Подробнее: Что такое web push-уведомления
В каких целях лучше всего использовать браузерные push-уведомления?
Браузерные push-уведомления целесообразно использовать для:
Браузерные push-уведомления будут интересны, в первую очередь:
Какие сообщения можно рассылать пользователям сайта используя push?
В браузерных push-уведомлениях вы можете рассылать абсолютно любые сообщения, за исключением спама и прочих запрещенных законами материалов.
Информацию в каком формате можно отправлять в браузерном push-уведомлении?
При составлении уведомления вы сами определяете всю информацию, которая будет отображаться в сообщении.
Каким типам пользователей можно рассылать браузерные push-уведомления?
Браузерные push-уведмления могут получать все, без исключения, пользователи Apple Safari на OS X и Google Chrome версии 42+ (на любой операционной системе).
Как происходит подписка пользователей на браузерные push-уведомления?
Как получить разрешение от пользователя сайта на отправку ему push-уведомлений?
Пользователь должен подтвердить подписку на уведомления от вашего сайта: в стандартном диалоговом окне в своем браузере. Данное диалоговое окно может быть вызвано на любой странице вашего сайта.
Пользователь всегда имеет один и тот же Token?
Нет. По сути, Token — это уникальный идентификатор браузера, в котором пользователь открывает ваш сайт. Разные сайты получают разные токены для одного и того же браузера: перенести или передать базу рассылки на другой ресурс не получится.
Пользователь может отписаться от моей рассылки, отказаться от получения push-уведомлений?
Какие есть инструменты для анализа эффективности рассылки уведомлений?
Для сбора статистики по доставке уведомлений нужно использовать специальные программные решения.
Для отслеживания общей эффективности рассылок достаточно добавлять UTM метки в ссылки, которые вы задаете при составлении push-уведомлений. Таким образом можно анализировать поведение пользователей на сайте после получения ими уведомлений — через стандартные средства аналитики web-сайтов.
Как быстро доставляются браузерные push-уведомления?
В идеале, уведомление доставляется через несколько секунд после отправки. На практике, время доставки зависит от используемого для рассылки программного обеспечения, мощности используемого сервера, объемов базы рассылки и других параметров.
Что нужно для рассылки браузерных push-уведомлений с моего сайта?
Я хочу сам или при помощи своих программистов организовать рассылку push уведомлений со своего сайта, как мне это сделать?
Чем же все-таки уникальны браузерные push-уведомления, почему о них так лестно отзываются?
Во-первых, это новый канал взаимодействия с клиентами, через который намного легче до них достучаться. Во-вторых, push-уведомления на компьютерах значительно ускоряют взаимодействие компании с клиентами: сообщения приходят в нужное время, сразу же замечаются пользователями и показывают информацию в сокращенном виде. Соответствуя высокому темпу работы пользователей Интернета с информацией, push-уведомления оказываются в разы эффективнее привычных каналов общения с клиентами.
Уведомления в браузере и пример того, как их можно использовать с пользой
Вероятно, вы все уже слышали про технологию «Веб-push» в составе Push API и Notifications API. Я уверен, что среди вас есть те, кто возлагает надежды на эту технологию, как на новый канал коммуникации с пользователем. И я не исключаю возможность, что данную статью будут читать основатели тех немногочисленных стартапов, которые всерьёз занялись окучиванием технологии «Веб-push» для рекламы и маркетинга. Сегодня я вам расскажу, о том как можно использовать данную технологию.
Современные веб стандарты подарили нам возможность посылать пользователю уведомления. Это такие всплывающие сообщения в правом нижнем углу экрана, хотя местоположение зависит от используемого браузера, а повлиять на расположение сообщения разработчик напрямую не может. И вот эти сообщения всплывают значит и показывают какую-то информацию. Информацию заведомо нужную пользователю, так как нельзя распространить эти уведомления на аудиторию, которая на них не подписана. И всё вроде бы логично, но пользователи упорно жмут кнопку «Отказаться», когда им предлагают подписаться на получение таких уведомлений. Попробуем разобраться почему так происходит.
Технология «веб-push» буксует на одном месте и это очевидно. Помимо раздражающего фактора наличия самого уведомления, которое стремительным, ослепительно белым аэропланом врывается на поверхность рабочего стола, есть ещё одна причина. Это использование технологии не по назначению. Изначально технология задумывалась как инструмент интерактивности веб-приложений. Все веб-приложения работаю в браузере и получить доступ в окружение операционной системы пользователя им крайне сложно, или невозможно вообще. Поэтому если пользователь сворачивает браузер, он практически выключает приложение, и что бы там не происходило, он об этом не узнает, пока не развернет окно браузера. Технология уведомлений позволяет обратить внимание пользователя на приложение даже когда браузер свернут. Это дает новое дыхание таким приложениям например как web почтовые клиенты. Но некоторым людям захотелось использовать этот канал связи для интернет-маркетинга и рекламы. Предполагается, что пользователи добровольно будут подписываться на такого рода рассылки.
Но так или иначе технология существует и её надо осваивать. Настал тот момент, когда я решил встроить уведомления на сайт. Как оказалось, технология (Web Push API и Notification API) достаточно простая и естественно появилось желание поэкспериментировать. В процессе ознакомления я определил проблемы и неудобства, которые неприемлемы для лично меня:
Собственно, для начала было сделано расширение для браузера, которое умеет бегать на сервер и спрашивать есть ли для него сообщения (ссылка на код расширения в конце статьи). Если сообщения есть, то в зависимости от настроек пользователя, появляются уведомления на рабочем столе. Так же пользователь может получить доступ к списку активных уведомлений в любое время нажав на иконку расширения в браузере. Есть опция «Не беспокоить», которая позволяет отключать уведомления, но оставляет возможность пользователю получить доступ к пришедшим уведомлениям через кнопку расширения. Так же вне зависимости от настроек на кнопке расширения присутствует индикация наличия непрочитанных сообщений.
Установка расширения выполнена в inline стиле, благодаря чему подписка на уведомления сводится к двум кликам мышкой. Необходимо разместить кнопку, при нажатии на которую пользователю будет предложено установить расширение. Данную кнопку можно разместить в любом месте сайта. Также кнопку подписки можно прятать если расширение уже установлено. Вот пример посадочной страницы подписки на уведомления, который я сделал для приложения Пример посадочной страницы подписки
Расширение можно удалить стандартным способом, т.е. так же, как и любое другое расширение для браузера, но для удобства, дополнительно добавлена кнопка для удаления. На случай самоликвидации отправителя, существует способ удаленно деинсталлировать расширение со всех устройств пользователей, послав в заголовке сообщения секретную команду, где вы ещё такое найдёте :).
Что касается серверной части, то тут мы имеем небольшую админку написанную на PHP для внесения уведомлений в БД и шлюз для приема запросов от пользователей и соответственно выдачу уведомлений из БД. Этот же шлюз используется для сбора статистики и пишет всё в ту же БД.
Вот пример того как сервер отдает JSON для уведомлений (установлен лимит в 3 сообщения).
А вот так формирую JSON для отображения в расширении. Тут отдаём HTML снипет:
Формируем HTML снипет extention_m.php:
Осталось рассказать про статистику. Я много делать не стал. В свою базу добавляю по минимуму. С остальным хорошо справляется Google Analytics. Просто при публикации расширения я указал Google Analytics ID и могу получать всю информацию о просмотрах и переходах по ссылкам, которые содержатся в уведомлениях.
Вот таким способом мне удалось оптимизировать технологию веб-push уведомлений и сделать её более удобной (по крайней мере для себя). Учитывая широкие возможности браузерных расширений, в данное приложение можно добавить более богатый функционал.
В завершение, как доказательство возможности применения Notification API в реальных задачах, хочу сказать, что мной написано два действительно важных приложения, одно из которых может оповещать о температуре в серверной, а второе присылает уведомления, если на маршрутизатор ядра логинится кто-то из админов.
Уведомления в браузере, как отключить и настроить.
С развитием программного обеспечения появилась такая функция как уведомление от сайтов или служб.
Вначале такие уведомления появились в устройствах на Android системах, а теперь и браузеры под управлением windows показывают вам уведомления, на которые вы подписались на том или ином интернет ресурсе.
Это уведомление называются Push – уведомление.
Выглядят они вот так:
Когда вы заходите на сайт, вас спрашивают о желании получать новости от этого сайта, уведомления.
В последствии, если подпишитесь на новости, вам будут приходить уведомления о новых статьях, прямо на рабочий стол, и выглядят они так:
Некоторые машинально, по привычке или случайно, подписываются на все подряд, а потом не знают, как избавиться от ненужной информации.
В этой статье речь пойдет о том, как настроить уведомления от различных интернет ресурсов в вашем браузере.
Уведомления от различных интернет ресурсов приходят к вам только с вашего согласия. Некоторые говорят, что не давали на это согласия, не подписывались на эти объявления, но они приходят.
Дело в том, что достаточно один раз согласиться, даже случайно, вместо закрыть или отказаться, и в вашем браузере сохраняется эта информация.
Теперь уже спрашивать вас не будут, пока вы не отмените свое согласие на получение этих уведомлений.
Так как же отказаться от ненужных вам уведомлений?
В настройках, вашего браузера, можно настроить получение таких уведомлений. В некоторых браузерах их можно заблокировать совсем и они не будут вас даже спрашивать, а в некоторых можно только отписаться от не нужных вам.
Рассмотрим настройку таких уведомлений в самых популярных браузерах.
Яндекс браузер.
В этом браузере для настройки уведомлений зайдите в настройки, прокрутите страницу вниз до пункта дополнительно.
Нажмите на него и найдите пункт личные данные.
Выберите настройки содержимого.
В открывшемся меню найдите пункт Уведомления.
Тут вы сможете отключить уведомления совсем, поставив напротив нужного пункта галочку, или отказаться от некоторых, выбрав Управление исключениями.
Браузер Google chrome.
Зайдите в Настройки браузера, прокрутите страницу до пункта Дополнительные и нажмите на него.
Выберете Настройки контента в разделе «Конфиденциальность и безопасность».
Затем выберите пункт Уведомления.
Укажите нужный вариант:
Чтобы заблокировать все уведомления.
отключите параметр Спрашивать разрешение перед отправкой.
Чтобы заблокировать уведомления от определенного сайта.
Рядом с надписью «Блокировать» нажмите Добавить, введите адрес страницы и снова выберите Добавить.
Чтобы разрешить сайту присылать уведомления.
Рядом с надписью «Разрешить» нажмите Добавить, введите адрес страницы и снова выберите Добавить.
Браузер Mozilla Firefox.
Переходим в настройки, выбираем пункт Приватность и защита.
Находим раздел Разрешения,
Совсем отключить Push уведомления в этом браузере нет возможности, можно поставить галочку напротив пункта Не беспокоить, это поможет до следующего запуска вашего браузера.
Можно настроить от кого получать или не получать уведомления.
На против пункта уведомления выбираем параметры.
Откроется окно в котором вы сможете отключить уведомление от не нужного вам ресурса, или соответственно наоборот добавить какой то ресурс.
Уведомление в браузере Opera.
С левой стороны браузера нажмите кнопку настроек, в виде шестеренки.
В окне настрое слева выберите пункт Сайты.
В открывшемся окне правее, прокрутите до пункта Уведомления.
Здесь вы можете выбрать один из трех предлагаемых вариантов, а нажав на кнопку Управление исключениями вы можете запретить уведомления или разрешить с того или иного ресурса.
Push-уведомления: что это такое и как ими пользоваться
У вас одно непрочитанное сообщение, ваш заказ скучает без вас в пункте выдачи, ваш твит нравится человеку, ради лайка которого вы его писали — все эти радостные новости приносят push-уведомления.
Push-уведомления — это небольшие всплывающие окна, они сообщают вам о чём-то важном (или нет) и появляются на экране браузера, даже когда вы покинули сайт.
Это отличный маркетинговый инструмент для:
Немного статистики в пользу пуш-уведомлений:
Спасибо! Мы уже отправили всё на почту
Как работают push-уведомления?
Технология достаточно проста. Пользователь заходит на сайт, в углу экрана и видит небольшое окошко. Структура может варьироваться, но в общем виде выглядит так: заголовок, текст, картинка, ссылка.
Технический принцип работы пуш-уведомлений выглядит так:
1 — сервер приложения показывает страницу пользователю;
2 — клиент подключается к серверу сообщений, он проходит регистрацию и сервер присваивает ему ID;
3 — клиент отправляет этот ID на сервер приложения и он привязывает конкретного пользователя к конкретному устройству при помощи ID устройства.
4 — сервер приложения отправляет клиенту пуш через сервер сообщений при помощи ID.
Пользователю не нужно вводить личные данные вроде имени, электронного адреса или номера телефона, требуется просто нажать на кнопку на сайте. Часто он делает это автоматически, просто чтобы закрыть окно.
Процесс подписки на push-уведомления
Рассмотрим технологию подписки на push-уведомления со стороны пользователя. Сперва у него просят разрешение на отправку уведомлений с помощью всплывающего окошка в браузере.
Так выглядит стандартная форма подписки на push-уведомления в браузере Google Chrome 
Еще одна форма подписки на пуш-уведомления
Принцип работы пуш-уведомлений на некоторых сайтах подразумевает, что сайт просит подтвердить подписку на рассылку уведомлений дважды:
Если пользователь соглашается, его поблагодарят за подписку и начнут отправлять push-уведомления.
Как отписаться от push-уведомлений
От рассылки можно отписаться двумя способами.
Первый способ: кликните по push-уведомлению правой кнопкой мыши и в выпадающем меню выберите вариант “отключить” (в разных браузерах может называться по-разному).
Если вам просто надоели постоянные push-уведомления от разных сайтов, можно отключить их через настройки браузера. На сайтах с https-протоколом нужно нажать на иконку замочка слева от url, в выпадающем меню выбрать нужный вариант.
Чтобы отключить пуш-уведомления на сайте с http-протоколом, нужно покопаться в настройках браузера, обычно это не составляет большого труда.
Типы Web Push уведомлений
Пользователь получает браузерные push-уведомления от сайта, на который подписался. Обычно они выскакивают в правом нижнем углу экрана. Пуши поддерживаются всеми браузерами и даже показываются на мобильных устройствах через Chrome. Исключение — устройства на iOS, они не отображают браузерные пуши.
Мобильные пуши обычно выскакивают в верхней части экрана. Принцип работы одинаковый и они отличаются от десктопных только размером.
Рассмотрим подробнее, какими бывают уведомления.
Контентные пуш-уведомления
Контентные push-уведомления и рассказывают о важных событиях, о продукте или о других вещах, которые могут заинтересовать клиента и вернуть его в приложение или на сайт.
Такие уведомления могут сообщать о предстоящих акциях, специальных маркетинговых предложениях, распродажах:
Спортмастер сообщает подписчикам о закрытой распродаже на сайте маркетинговым пуш-уведомлением с кнопкой в браузере. Промокод — дополнительная мотивация перейти по ссылке. 
Мобильный пуш Lamoda подогревает интерес к распродаже за счет эффекта эксклюзивности предложения и скидки. Эмодзи в заголовке делают push-уведомление более заметным. 
Мобильное push-уведомление Рив Гош привлекает внимание большой скидкой и ограниченным временем акции 
Пример ситуативного маркетинга в пуш-уведомлениях: ресторан Petruccio напоминает о предстоящем празднике и предлагает поучаствовать в розыгрыше 
Таймер для интервального голодания Zero тоже предлагает приз но за отказ от еды мобильным уведомлением
Привлекать внимание пользователя можно не только маркетинговыми предложениями, но потенциально интересным контентом:
Два мобильных push-уведомления от Pinterest. Один отсылает к коллективному опыту, другой предлагает персональную подборку (отличная идея для А/Б теста!). 
С помощью мобильных пушей Soundcloud держит подписчиков в курсе, когда выходят новые эпизоды подкастов 
Facebook напоминает о дне рождения друга и просит сообщить, полезно это push-уведомление или нет, чтобы отправлять пользователю более релевантные пуши
Транзакционные пуш-уведомления
Транзакционные пуш-уведомления сообщают о подтверждении оплаты, статусе заявки, появлении товара на складе и прочих организационных моментах.
Браузерное пуш-уведомление держит в курсе насчет статуса заказа 
Так выглядит мобильное пуш-уведомление о списании денег
Триггерные пуш-уведомления
Сообщают пользователю о действиях и событиях, которые напрямую относятся к нему, и показываются в зависимости от жизненного цикла клиента. Например, приветствуют вернувшегося пользователя, благодарят за покупку, напоминают об отложенных товарах и новых сообщениях, предлагают вернуться в приложение:
Push.World благодарит за подписку и сразу же предлагает отписаться (зато в двух кнопках) 
Рив Гош не скрывает, что соскучился, и предлагает вернуться за персональной подборкой товаров мобильным уведомлением 
Мобильное пуш-уведомление Zero принесло радостную новость, что период интервального голодания закончился и снова можно есть
Пуш-уведомления могут сообщать о действиях других пользователей, чтобы мотивировать перейти в приложение и ответить:
Так выглядят мобильные уведомления о новых сообщениях в Telegram 
Мобильное уведомление Instagram сообщает о новых публикациях от аккаунтов, на которые пользователь подписан 
Мобильное уведомление Instagram сообщает о новых комментариях к посту 
Tinder радуется, что у вас новая пара 
Так выглядит мобильный пуш Twitter с реакцией на твит пользователя
Преимущества push-уведомлений
Большинство сайтов предлагают своим посетителям подписаться на уведомления. Этот канал коммуникации не был бы так популярен, если бы не приносил пользу маркетингу. Разберёмся, в чём она заключается.
Высокая конверсия. Об этом мы уже упоминали: технология проста, пользователю ничего не стоит кликнуть на кнопку “Подписаться”, не нужно оставлять дополнительных данных. Carrot quest собирает данные каждого посетителя в карточку пользователя. С помощью этих данных можно сегментировать аудиторию, настраивать, создавать и отправлять свои уведомления для каждого сегмента. При персональном предложении конверсия в подписку достигает 20%.
Проще дотянуться. Уведомления приходят пользователю, даже если он давно закрыл ваш сайт. Взаимодействие продолжается после завершения сессии.
Без лишних деталей. Не нужно вытягивать из посетителя контактные данные, и вам гораздо проще начать взаимодействие. Получить емейл или номер телефона можно позже, когда вы уже наладите контакт.
Быстрая доставка контента. Push-уведомление приходит пользователям в то же мгновение, как вы кликаете на “Отправить”. Вероятность ошибки отправки практически исключена, а ещё уведомления не попадут в спам.
Кому обязательно нужно настроить push-уведомления
Интернет-магазинам нужно настроить push-уведомления, чтобы возвращать пользователей на сайт или мобильное приложение и доводить до покупки, сообщать об акциях и распродажах.
SaaS-сервисам нужно настроить push-уведомления, чтобы сообщать об обновлениях, окончании тестового доступа и предлагать подключить новые функции.
Блогам нужно настроить push-уведомления, чтобы делиться новыми статьями.
Чем полезны push-уведомления для всех типов сайтов:
Push-уведомления vs email-рассылки
По иронии судьбы, привлекать пользователей вы можете огромным количеством инструментов, а возможности для дальнейшей коммуникации ограничены. Часть аудитории не любит получать sms и регулярно чистит ящик от емейл-рассылок — и с этими людьми вы можете общаться через push-уведомления.
Не отрицаем, что емейл-рассылки — полезный и важный маркетинговый инструмент, но у push-уведомлений есть несколько преимуществ:
Push-уведомления vs SMS
Рассмотрим, чем отличаются push-уведомления от SMS. Они похожи, но вот чем лучше уведомления:
Обзор web push сервисов
Мы сравнили несколько самых популярных сервисов, в которых можно сделать и настроить рассылки push-уведомлений. Ниже коротко о каждом из них.
SendPulse — простой, но достаточно дорогой сервис. Отлично подойдёт, если у вас небольшая база (до 2500 подписчиков сервис бесплатный). Сложно настроить интеграцию сервиса с Tilda, это можно сделать только через Zapier.
Push4Site — простой и недорогой, при этом достаточно мощный сервис. Поддерживает расширенную настройку событий, аналитику и многопоточную отправку. Есть версия на русском и английском языках.
Push.World — бесплатный сервис с понятным интерфейсом и ограниченным набором функций. Отличный вариант, если вы еще никогда не настраивали пуши и хотите проверить их эффективность для своего сайта.
PushAll — сложный, но бесплатный сервис. Нельзя отправлять пуши через сайт, необходимо создать канал и отправлять через него.
Pushem — простой и недорогой сервис. Предоставляет отличные возможности аналитики, но сами рассылки ограничены по функционалу. Неудобно вставлять картинки в уведомления.
Pushwoosh — достаточно сложный сервис, доступный только на английском языке. Поддерживает много функций, можно вставлять в сообщения динамический контент. Простая интеграция возможна только с сайтами на WordPress, в остальных случаях придётся помучиться.
Notisend — простой и бесплатный сервис. Функциональные возможности не очень широкие, но зато в нём легко разобраться.
Gravitec — красивый и простой сервис, есть русская и английская версии. Поддерживает много функций аналитики и таргетинга.
Для тех, кому нужно больше информации, мы подготовили таблицу-сравнение.
Хочу получить сравнение
Web Push сервисов