Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

pwa-article #437

Merged
merged 4 commits into from
Oct 30, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 5 additions & 15 deletions content/blog/2023/when-to-choose-a-native-mobile-app.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,17 +27,16 @@ summary: |
---

{% import 'embed.macros.njk' as embed %}
{% import 'oddnews.macros.njk' as oddnews %}

If you haven't read part 1 yet, it has a great introduction to each option along
with a quick comparison chart: [When to Choose a Responsive Web
App](/2023/07/11/when-to-choose-a-responsive-web-app/)

<!-- **Read all three parts to compare app types:**
**Read all three parts to compare app types:**

1. [When to Choose a Responsive Web App](/2023/07/11/when-to-choose-a-responsive-web-app/)
2. [When to Choose a Native Mobile App](/2023/08/01/when-to-choose-a-native-mobile-app/)
3. [When to Choose a Progressive Web App](/2023/09/01/when-to-choose-a-progressive-web-app/) -->
2. When to Choose a Native Mobile App (this article)
3. [When to Choose a Progressive Web App](/2023/10/30/when-to-choose-a-progressive-web-app/)

## Native Mobile App -- Best for Advanced Capabilities

Expand Down Expand Up @@ -205,14 +204,5 @@ series.

---

Curious about progressive web apps? Sign up for OddNews to be notified when
**Part 3 -- When to Choose a Progressive Web App** hits the OddBlog.

{{ oddnews.oddnews_signup(
heading=false,
tag='oddblog',
class='oddnews-form-main'
) }}

<!-- Is a **progressive web app** right for your digital project? Read more about
[When to Choose a Progressive Web App](/2023/09/01/when-to-choose-a-progressive-web-app/). -->
Is a **progressive web app** right for your digital project? Read more about
[When to Choose a Progressive Web App](/2023/10/30/when-to-choose-a-progressive-web-app/).
28 changes: 23 additions & 5 deletions content/blog/2023/when-to-choose-a-progressive-web-app.md
Original file line number Diff line number Diff line change
@@ -1,10 +1,8 @@
---
eleventyExcludeFromCollections: true
permalink: false
title: When to Choose a Progressive Web App
sub: Part 3 -- Responsive Web App vs Native Mobile App vs Progressive Web App
author: sondra
date: 2023-09-01
date: 2023-10-30
tags:
- Article
- Business Development
Expand Down Expand Up @@ -43,8 +41,8 @@ comparison chart for quick reference).
**Read all three parts to compare app types:**

1. [When to Choose a Responsive Web App](/2023/07/11/when-to-choose-a-responsive-web-app/)
2. [When to Choose a Native Mobile App](/2023/08/01/when-to-choose-a-native-mobile-app/)
3. [When to Choose a Progressive Web App](/2023/09/01/when-to-choose-a-progressive-web-app/)
2. [When to Choose a Native Mobile App](/2023/08/29/when-to-choose-a-native-mobile-app/)
3. When to Choose a Progressive Web App (this article)

## Progressive Web App -- Best of Both Worlds

Expand Down Expand Up @@ -103,6 +101,11 @@ fewer specialized technologies and can be done incrementally. On the other hand,
packaging your PWA for inclusion in app stores takes additional time, and
requires going through the app store approval process.

{{ embed.img(
src='blog/2023/fast-bike.jpg',
alt='Blurry photo of a cyclist on a road bike'
) }}

### Discoverable Via Search Engines & App Stores
*Choose a progressive web app when the people you want to reach will look for
your app with a search engine and in an app store.*
Expand All @@ -117,6 +120,11 @@ index them and include them in search results. Various tools such as
[PWABuilder](https://www.pwabuilder.com/) essentially wrap up a PWA like a
native app for inclusion in Google, Apple, and Microsoft app stores.

{{ embed.img(
src='blog/2023/pwabuilder_logo.jpg',
alt='pwa builder logo'
) }}

### Broad Reach
*Choose a progressive web app when you want to reach a broad audience across
various devices.*
Expand All @@ -129,6 +137,11 @@ internet or download it onto their phone like a native mobile app and use it
offline. Like RWAs, PWAs take advantage of the web's high level of backward
compatibility, meaning people on older devices will retain some level of access.

{{ embed.img(
src='blog/2023/heart-chain.jpg',
alt='Paper cutouts of attached pink and red hearts'
) }}

### Specialized Capabilities
*Choose a progressive web app when you want to reach a broad range of people
while keeping costs down as much as possible, but need some specialized device
Expand All @@ -153,6 +166,11 @@ completely independent from the browser interface.
Check out and test all the PWA capabilities on [What PWA Can Do
Today](https://whatpwacando.today/).

{{ embed.img(
src='blog/2023/smartphone-app-homescreen.jpg',
alt='phone with lock on the screen'
) }}

{{ embed.figure(
data=[{
img: 'blog/2023/no.png',
Expand Down
12 changes: 5 additions & 7 deletions content/blog/2023/when-to-choose-a-responsive-web-app.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,6 @@ card: large
---

{% import 'embed.macros.njk' as embed %}
{% import 'oddnews.macros.njk' as oddnews %}

You have an idea for a custom digital product you'd like to build, and it's time
to decide how to build it. One of your friends swears you won't succeed unless
Expand All @@ -46,11 +45,11 @@ apps, native mobile apps, and progressive web apps -- and how to determine the
best option for your project. As you read, think about who your app will serve,
what their most pressing needs are, and how your app will meet those needs.

<!-- **Read all three parts to compare app types:**
**Read all three parts to compare app types:**

1. [When to Choose a Responsive Web App](/2023/07/11/when-to-choose-a-responsive-web-app/)
2. [When to Choose a Native Mobile App](/2023/08/01/when-to-choose-a-native-mobile-app/)
3. [When to Choose a Progressive Web App](/2023/09/01/when-to-choose-a-progressive-web-app/) -->
1. When to Choose a Responsive Web App (this article)
2. [When to Choose a Native Mobile App](/2023/08/29/when-to-choose-a-native-mobile-app/)
3. [When to Choose a Progressive Web App](/2023/10/30/when-to-choose-a-progressive-web-app/)

## What Are Responsive Web Apps, Native Mobile Apps, and Progressive Web Apps?

Expand Down Expand Up @@ -224,8 +223,7 @@ then an RWA won't work.
It is *possible* to access some advanced device features in the context of an
RWA, but then you would be moving into the [progressive web app][pwa] space.

<!-- [pwa]: /2023/09/01/when-to-choose-a-progressive-web-app/ -->
[pwa]: https://web.dev/progressive-web-apps/
[pwa]: /2023/10/30/when-to-choose-a-progressive-web-app/

### Performance Limitations
*Don't choose a responsive web app when you need advanced performance.*
Expand Down
Binary file added src/images/blog/2023/fast-bike.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/images/blog/2023/heart-chain.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/images/blog/2023/pwabuilder_logo.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.