I started this post on a plane flying back from speaking at Digital Summit Phoenix. My talk centered on website performance, and, naturally, mobile websites were a big part of that discussion.

Where’s the App for That?

One conversation from that conference really stands out for me. In my talk I referenced mobile solutions and alternatives. I spoke about the need for responsive websites and other mobile solutions like AMP and PWA (more below). One of the attendees came up to me afterward and mentioned something interesting.

He is an app developer. He told me that more companies were looking at web based mobile solutions to replace what was typically a native app experience. I wasn’t surprised at his statement as much as I was that he was making it. This is from a guy whose company makes money building native apps.

To me, it’s a sign that the mobile landscape is changing quicker than most might realize. So, I decided to do a breakdown of what the mobile landscape is looking like these days. There is no silver bullet solution. But, armed with the following information, you’ll be better equipped to make the right mobile solutions choices.

Let’s dive in…

Mobile Apps vs. Mobile Websites

What is a mobile app? Mobile apps are programs that reside on your phone and have access to the phone’s native functionality. Apps are available for download in either the Android or Apple apps stores (or whatever catchy name they have these days).

Mobile apps are popular because they are easy to access and work with limited or no access to the Internet. That said, developing a custom mobile app can get pretty pricey. And keeping it up to date and in compliance with all of the app store rules and regs can take even more money and time.

Conversely, a mobile website is much cheaper to maintain and keep up to date. Mobile websites can use a CMS like WordPress or Drupal to easily log in to update content, etc. They can also include plugins.

If you have a WordPress website for your mobile audience, there are tons of plugins available for some of bells and whistles an app usually comes with…

• Calendar
• Surveys and rating systems
• Reminders
• Maps
• Social sharing

And there’s so much more. Updating add-ons for an app isn’t always as smooth as updating plugins is on a website due to the app store review process. But, the desired user experience should ultimately drive your mobile choices.

So, let’s look at some common web options for mobile users so you can decide which works for you…

Mobile Website Options

Now, I’m not saying that all you need to do is make your website responsive and you have a perfect app alternative. If you’re replacing an app with a website solution, you still need to create an experience that rivals the app experience.

There are platforms that allow you to quickly build a native app or construct one from your existing website. And sometimes, this is a viable option. But, you still run into the same issues:

• An app needs to be downloaded through the app stores
• Updating these is not always as easy as updating a website
• These solutions make it more difficult to design something custom

The question to ask is “does your mobile solution depend on access OS level features such as contacts, microphone, or camera?” If not, you have other options…

I mentioned responsive. What is responsive design? Responsive design simply means that your website is setup to offer a modified UI (user interface) based on the device being used, whether a large desktop monitor or a mobile phone.

Responsive websites:

• It’s one website for all devices
• They are not a cure all and require strategic planning
• The layout and assets scale based on device and viewing specs
• You need to pay attention to menus and usability in terms of needs and goals
• And think about your content and images, what does the user see versus what they need

With a responsive website, you’ll need to consider the user experience at each breakpoint. A breakpoint is a setting in the code that tells the browser to serve up a certain version of your site based the display size available.

A desktop breakpoint would serve up a large scale layout and all content. A mobile breakpoint might serve a limited menu, compact layout, and smaller or limited images.

Remember, this is all one website. You do not have to maintain a desktop experience in addition to a mobile experience. Those are contained within the code of one website.

Accelerated Mobile Pages – AMP

Another option for your mobile presence is to use accelerated mobile pages or AMP. Twitter and Google teamed up to develop this option as an alternative to responsive sites. The reason? SPEED!

The pages load super fast. Why? There ain’t much there. These are stripped down to only the content and little else and are primarily intended for publishers of written content.

Accelerated Mobile Page Breakdown

• Stripped to essential elements
• Minimal branding and design
• Loads quickly
• Limited engagement/conversion opportunities
• Complicated to setup

Google and others have stated time and time again that speed is super important and will factor into a website’s rankings. With AMP, you have a lightning fast alternative to your standard responsive website.

Since you’re really only loading content and maybe an image or two, the pages load quickly. Are Accelerated Mobile Pages an alternative to apps? In a very narrow case they might be.

These are really only for content accessed via the web. And they are only an app alternative (in rare cases) but not an app replacement. Functionality is extremely limited and so is styling. The only advantage here is speed.

Progressive Web Apps – PWA

When looking at alternatives for apps, PWAs are your best option. PWAs are a modified website designed to work more natively with a mobile device.

PWAs use a “service worker” which is client-side JavaScript that pre-caches key resources so that the PWA loads quickly every time, regardless of the network speed.

These are relatively new and not yet fully available for Apple devices, although there are workarounds. All signs point to iOS availability in the near future.

The problem is the service workers. They are what makes these PWAs feel like native apps. I predict we’ll see a major spike in PWA usage once these service workers are universally accepted (hurry up Apple!).

Twitter on Android is a great example of a Progressive Web App. If you have an android device, visit https://mobile.twitter.com. You can see that it feels a lot like a native app.

Now if you go to that page on your desktop you’ll see a UI that works for the desktop resolution too. Try that with a native app. You can’t.

Progressive Web Apps Breakdown

• Built in HTML5 within existing website framework
• They are a modified website to work natively through the use of “service workers”
• PWAs can send push notices and can be stored on your phone with an icon
• You can use a PWA with limited and even no internet connection, seriously
• Fingerprint, bluetooth, and other hardware features not yet available
• Service workers not yet supported on iOS but will be soon

Why Go with a Progressive Web App or PWA?

If you’re still not certain whether PWAs are for you. Here’s a quick list of when to go with a PWA…

1. They are considerably less expensive to develop versus a custom native app
2. You expect your audience will be looking for you in search engines and not in the app store
3. Some of your audience are desktop users
4. You plan on only building a native Android app and not an iOS app

Cost is really the main reason to develop PWAs versus native apps. According to freecodecamp.org “it costs around ten times [more] to develop an app rather than creating a website for the same. The cost can get much higher if you plan to develop and maintain separate code bases for different platforms like Android, iOS and the web.”

Google’s Breakdown of PWAs

As referenced in Wikipedia, Google Developers outlined the following characteristics for PWAs:

• Progressive – Work for every user, regardless of browser choice because they’re built with progressive enhancement as a core tenet.
• Responsive – Fit any form factor: desktop, mobile, tablet, or forms yet to emerge.
• Connectivity independent – Service workers allow work offline, or on low quality networks.
• App-like – Feel like an app to the user with app-style interactions and navigation.
• Fresh – Always up-to-date thanks to the service worker update process.
• Safe – Served via HTTPS to prevent snooping and ensure content hasn’t been tampered with.
• Discoverable – Are identifiable as “applications” thanks to W3C manifests^[6] and service worker registration scope allowing search engines to find them. (this is huge and a big plus over native apps)
• Re-engageable – Make re-engagement easy through features like push notifications.
• Installable – Allow users to “keep” apps they find most useful on their home screen without the hassle of an app store.
• Linkable – Easily shared via a URL and do not require complex installation. (again, not as easy with a native app)

PWA Examples

PWAs are viable alternatives to native apps and often easier/cheaper to create and maintain. Here are a couple of screenshots of examples from PWA.rocks (no, really, it’s a real site)…

In the first example, you can see the prompt to add this to your homescreen. The toolbar on the second example is loaded with app-like features. There are more examples at PWA.rocks. Go check them out.

Of course, there are still reasons to build a native app as referenced above. But, I would argue that this list is shrinking. Think about it this way, the average mobile user accesses only 3 native apps regularly. And this usually includes a browser. All the rest of those apps are gathering dust and taking up space on your phone.

So, mobile apps? We have choices folks!