Вы, несомненно, слышали о грядущей волне мобильного Интернета. Вы, наверное, слышали чаще всего о том, что мобильный доступ в Интернет быстро растет, и примерно половина всего веб-трафика сейчас проходит через телефоны или планшеты. А Февральский отчет 2018 из Исследовательского центра Пью Обратите внимание, что 95% всех американцев владеют мобильными телефонами, в то время как доля американцев со смартфонами составляет 77%.
Не нужно далеко смотреть, чтобы увидеть влияние мобильных устройств. Посмотрите на свое поведение и поведение своей семьи. В декабре 2016 г. comScore сообщил, что средний американец старше 17 лет тратит на свой телефон два часа 51 минуту в день. (Englais).
Statcounter.com отмечает, что глобальный веб-трафик поступает в основном с мобильных устройств не менее года (51,95% в феврале 2018).
Хотя вы можете подумать, что не можете позволить себе разработать собственное приложение для мобильных пользователей, которое будет хранить их на своих телефонах, для всех предприятий есть отличная альтернатива: прогрессивные веб-приложения. Возможно, вы слышали о прогрессивных веб-приложениях (PWA) и о том, как люди используют их для развития своего бизнеса. В этой статье вы узнаете немного больше о PWA и о том, почему вам следует больше думать об их использовании в 2018 году.
Некоторые определения
Прогрессивные веб-приложения (PWA) - это набор веб-стандартов, изначально разработанных Google для повышения производительности веб-сайтов на мобильных устройствах. Таким образом, веб-сайты больше похожи на специализированные мобильные приложения, которые вы можете найти в Apple App Store или Google Play.
другой определение Разработчики для индийской гостиничной сети Treebo: «PWA — это одностраничные приложения, в которые постепенно добавляются функции, обеспечивающие более захватывающий опыт. »
Немного сокращая это, PWA на мобильных устройствах позволяют вашим читателям и клиентам быстро загружать домашнюю страницу вашего сайта и использовать многие из тех же функций на мобильном устройстве, что и собственное приложение. Ваш сайт может существовать вне браузера, даже если устройство не подключено к Интернету.
Другие определения
Некоторые из ключевых технических частей PWA включают:
Услуги Рабочие являются ключевой технологией, связанной с PWA. Это позволяет PWA работать вне сети.
Файлы манифеста содержать значок и имя, которые связывают приложение на устройстве с Веб-сайт. Разработчик также может добавить сюда элементы дизайна, чтобы повысить качество обслуживания клиентов.
Push-уведомления общаться с вашими пользователями (с их разрешения), чтобы они вернулись.
Некоторые причины
Так почему ваш сайт должен включать PWA? Это довольно просто.
Лучшая производительность - даже на настольном компьютере!
Вы знаете, что у вас ограниченное время, чтобы выиграть посетитель впервые – шесть секунд загрузки, прежде чем потенциальный клиент уйдет и перейдет на следующий сайт в результатах поиска. Мобильные пользователи еще более нетерпеливы — половина ваших потенциальных пользователей уйдут, если сайт загружается более 3 секунд!
Хорошая новость: изменения, которые вы вносите в создание прогрессивного веб-приложения, ускорят ваш сайт!
Пример: индийская гостиничная компания Treebo сократила время зарядки мобильных устройств с шести до 1,5 секунд, создав PWA. Теперь сайт загружается на рабочий стол за секунду! Их техническая команда сообщила, что рейтинг сайта в поиске улучшился, а ежемесячный коэффициент конверсии вырос более чем вдвое!
Автономная емкость
Для этого PWA не обязательно должен быть в Интернете. Ваши пользователи могут получить доступ ко всему содержимому приложения со своего устройства или рабочего стола.
Фактически, одна из самых приятных особенностей PWA заключается в том, что ваш клиент может сохранить сайт на домашней странице своего устройства и использовать его позже для покупки вашего продукта или получения дополнительной информации. .
Например, CNET Tech Today предлагает ежедневный обзор новостей, связанных с технологиями, которые являются ежедневным хлебом для сайта. Если вы откроете сайт с помощью Google Chrome на устройстве Android и прокрутите вниз до нижней части экрана, вы увидите следующее:
пресс Добавить на домашний экран чтобы загрузить прогрессивное веб-приложение Tech Today на свое устройство. Коснитесь значка, чтобы загрузить 10 лучших текущих новостей. Проведите пальцем влево, чтобы прочитать каждую историю. Коснитесь логотипа CNET, чтобы открыть домашнюю страницу CNET в браузере.
Ремарка : В Firefox сайты с PWA имеют значок «Добавить на домашнюю страницу» (знак плюса в крошечной рамке) прямо в адресной строке. Если PWA уже установлен, логотип Android в адресной строке перенесет вас в PWA.
Одна вещь, в которой ваш сайт не нуждается: виджеты «Загрузите наше приложение» занимают место на вашей странице (обычно логотипы iTunes и Android отвлекают пользователей). Если Chrome замечает, что пользователь открывал ваш сайт PWA несколько раз в неделю, он предлагает вам добавить PWA. Обновления также автоматические.
Нет необходимости в сложных языках программирования
Возможно, вы рассматривали возможность создания нативного мобильного приложения для своего бизнеса, но обнаружили, что создание мобильного приложения отличается от создания веб-приложения. Веб-сайт. Если вы работаете с агентством веб-дизайна/разработки для поддержки вашего сайта, у них не обязательно будут навыки для создания приложений для основных поставщиков мобильных устройств.
Чтобы ваше программное обеспечение отображалось в Apple App Store, ваши разработчики должны зарегистрироваться в Apple Developer Network, использовать Apple Developer Tool (который работает только на Mac) и знать язык Apple одобрила программирование: Swift или Objective C.
Программирование для Android немного проще (одобрение разработчика не требуется), но подавляющее большинство приложений для Android написано на Java, который может быть трудным для изучения.
Чтобы приложение появилось в интернет-магазинах Apple или Android, завершенное приложение должно получить одобрение хранителей соответствующего магазина.
Напротив, прогрессивные веб-приложения создаются с использованием популярных веб-языков: HTML, CSS (каскадные таблицы стилей) и JavaScript. Короче говоря, даже начинающие веб-разработчики могут создавать высококачественные PWA.
В частности, вам не нужно много компьютерного образования, чтобы создать PWA для вашего сайта WordPress. Если вы уже изменили форматирование своего сайта с помощью дочерней темы, вы также можете создать файл PWA. Мы рассмотрим вопросы кодирования в другой статье.
Увеличить поддержку технологических гигантов
Стандарты становятся стандартами очень долго. Google впервые продвигал PWA в 2015 году.
Долгое время Chrome был единственным браузером, поддерживающим PWA, но это скоро изменится. За последние месяцы:
- Mozilla добавила поддержку PWA в Firefox 58
- Apple недавно объявила о поддержке веб-приложений в iOS
- Microsoft будет поддерживать PWA в следующей версии Windows 10, которая будет доступна в конце этого года (2018).
Пойдя дальше, чем другие поставщики операционных систем, Microsoft заявила, что «высококачественные» PWA скоро будут интегрированы в магазин приложений Windows 10 на мобильных и настольных компьютерах.
WordPress и PWA
WordPress еще не полностью поддерживает создание прогрессивных веб-приложений в базовом приложении. Команда Jetpack намерена добавить функциональность PWA в ближайший год. Этому способствует Javascript-настройка WordPress.
Jetpack: «Функции PWA постепенно появляются по мере их готовности», - говорит разработчик. Дэн Уолмсли в статье о блоге VIP WordPress . Разработчики могут добавлять файлы манифеста с помощью модуля манифеста Jetpack, начиная с версии 5.6.0, и они ввели прогрессивную загрузку изображений, которая ускоряет загрузку сайта, даже если на нем много изображений. страница. В этом году появится больше функций.
Некоторые плагины стремятся добавить функциональность PWA, но не получили широкого распространения.
- Инструмент оптимизации WordPress предоставляет рабочий инструмент и инструмент манифеста.
- Super Progressive Web Apps, среди прочего, генерирует манифест и кнопку «Добавить» на главный экран.
- WordPress Mobile Pack также добавляет функции PWA
Как вы собираетесь использовать PWA?
В этом руководстве вы узнали немного о прогрессивных веб-приложениях и о том, почему вам следует добавить их в Веб-сайт вашей компании:
- Растущая волна движения мобильных устройств
- Повышение производительности вашего веб-сайта - для мобильных устройств и компьютеров
- Доступность даже когда устройство не в сети
- Использует стандартные веб-функции: HTML, CSS и Javascript. Дешевле построить
- Расширенная поддержка браузеров и операционных систем
Может быть, теперь вы хотите узнать, как сделать PWA на WordPress? Или покажите своим разработчикам, как это сделать? Это будет предметом другого урока.
