You've no doubt heard of the coming wave of the mobile web. The most common thing you've probably heard is that mobile web access is increasing rapidly, and about half of all web traffic is now through phone or tablet. A February 2018 report from the Pew Research Center note that 95% of all Americans own a cell phone, while the share of Americans with smartphones is 77%.
You don't have to look far to see the impact of mobile. Look at your own behavior and that of your family. In December 2016, comScore reported that the average American over 17 spends two hours and 51 minutes a day on their phone (Englais).
Statcounter.com notes that global Web traffic comes mainly from mobile devices for at least a year (51,95% in February 2018).
While you may think that you can't afford to develop a native app for your mobile users to store on their phones, there is a terrific alternative available to all businesses: Progressive Web Applications. Maybe you've heard of Progressive Web Applications (PWAs) and how people use them to grow their businesses. In this article, you will learn a little more about PWAs and why you should think more about their use in 2018.
Some definitions
Progressive Web Applications (PWAs) are a collection of web standards originally developed by Google to improve website performance on mobile devices. Therefore, websites function more like dedicated mobile apps that you can find in the Apple App Store or Google Play.
Another definition developers for Indian hotel chain Treebo: “PWAs are single-page applications that are incrementally enhanced with features that provide a more immersive native experience. »
Cutting that down a bit, PWAs on mobile devices allow your readers and customers to quickly load your site's homepage and use many of the same features on the mobile device that a native app would use. Your site may exist outside of the browser, even when the device is not connected to the Internet.
Other definitions
Some of the key technical parts of a PWA include:
Services Workers are the key technology associated with PWAs. These allow PWAs to operate outside the network.
Manifest files contain the icon and name that links the app on the device to the Website. The developer can also add design elements here to enhance your customer experience.
Push notifications communicate with your users (with their permission), so they come back.
Some reasons
So why should your site include a PWA? It's pretty straightforward.
Better performance - even on the desktop!
You know you have a limited time to win a visitor for the first time – six seconds of loading before a potential customer leaves and visits the next site on the search results. Mobile users are even more impatient – half of your potential users will leave if a site takes more than 3 seconds to load!
Good news: the changes you make to create a progressive web application will speed up your site!
Example: Indian hotel company Treebo reduced their mobile charging time from six seconds to 1,5 seconds by creating their PWA. The site now loads on the desktop in a second! Their tech team reported that the site's search rankings have improved and the monthly conversion rate has more than doubled!
Offline capacity
PWA do not need to be on the Internet to do so. Your users can access all of the app's content from their device or desktop.
In fact, one of the nicest things about a PWA is that your customer can save the site to their device's home page and use it later to purchase your product, or get more information. .
For example, CNET Tech Today offers a daily summary of the technology-related news that is the daily bread of the site. If you open the site with Google Chrome on an Android device and scroll down to the bottom of the screen, you'll see this:
Press Add to Home Screen to download the Tech Today progressive web app to your device. Tap the icon to load the top 10 current stories. Swipe left to read each story. Tap the CNET logo to open the CNET home page in your browser.
Please note: : On Firefox, sites with PWA have an “Add to home page” icon (a plus sign in a tiny box) directly on the address bar. If the PWA is already installed, the Android logo on the address bar will take you to the PWA.
One thing your site doesn't need: "Download our app" widgets take up space on your page (usually with the iTunes and Android logos distracting users). If Chrome notices that a user has opened your PWA site several times a week, it prompts you to add your PWA. Updates are also automatic.
No need for complex programming languages
You may have considered building a native mobile app for your business, but found that building a mobile app is a different animal than building a Website. If you're working with a web design/development agency to maintain your site, they won't necessarily have the skills to build an app for mainstream mobile vendors.
For your software to show up in the Apple App Store, your developers must register with the Apple Developer Network, use the Apple Developer Tool (which works only on Mac), and know a language of Apple approved programming: Swift or Objective C.
Programming for Android is a bit easier (no developer approval is required), but the vast majority of Android apps are written in Java, which can be a difficult language to learn.
In order for the app to appear in Apple or Android online stores, the completed app must obtain approval from the custodians of the respective store.
In contrast, progressive web apps are built using popular web languages: HTML, CSS (Cascading Style Sheets), and JavaScript. In short, even beginner web developers can build high quality PWAs.
Specifically, you don't need a lot of computer education to do a PWA for your WordPress site. If you've already changed the formatting of your site using a child theme, you can also create a PWA file. We'll cover coding issues in another article.
Increase the support of technology giants
Standards take a long time to become standards. Google first promoted PWAs in 2015.
For a long time, Chrome was the only browser to support PWAs, but that is about to change. In recent months:
- Mozilla has added PWA support in Firefox 58
- Apple recently announced support for Web applications in iOS
- Microsoft will support PWA in the next version of Windows 10, which will be available later this year (2018).
Going further than other operating system vendors, Microsoft has said that "high quality" PWAs will soon be integrated into the Windows 10 app store on mobiles and desktops.
WordPress and PWAs
WordPress does not yet fully support building progressive web apps in the base app. The Jetpack team is committed to adding PWA functionality in the coming year. This is aided by the Javascript-ification of WordPress.
Jetpack "Gradually Introduces PWA Features As Soon As They Are Ready," Developer Says Dan Walmsley in an article on the WordPress VIP blog . Developers can add manifest files using Jetpack's manifest module since version 5.6.0, and they have introduced progressive image loading, which makes site loading faster even when there are a lot of images on it. the page. More features will be coming this year.
A few plugins seek to add PWA functionality, but have not been heavily adopted.
- The WordPress Optimization tool provides a working and manifest tool.
- Super Progressive Web Apps generates a manifest and an Add button to the home screen, among other features.
- The WordPress Mobile Pack also adds PWA features
How are you going to use the PWA?
In this tutorial you learned a little about Progressive Web Apps and why should you add one on the Website of your company:
- The growing wave of mobile device traffic
- Better performance for your website - mobile and desktop
- Availability even when the device is offline
- Uses standard web features: HTML, CSS and Javascript. Cheaper to build
- Increased support for browsers and operating systems
Maybe now you want to know how to do a PWA on WordPress? Or show your developers how to do it? This will be the subject of another tutorial.
