Shimon Sandler

Mobile First and Progressive Web Design – Impact on SEO and Publishers

Mobile First and Progressive Web DesignWeb App Design Insights: Mobile First, Progressive and Everything Between
You know that you want to publish engaging web content, but you’re struggling to decide between mobile-first and progressive design strategies. Although you could just wing it and see what emerges as you create code and other assets, your choices will have huge impacts on how users ultimately receive your software and how easily you can maintain it. Use the following insights to select a development philosophy that points you towards application success.

What Kind of Content Should You Create?

Every app is unique, but the distinctions run deeper than aesthetic appearances. Two apps with identical core functionalities will most likely be wildly different in terms of the experiences that users get from them. Many of these variations come down to whether you create a mobile-first website or a progressive web app.

Defining Mobile First

Mobile-first is a design consideration where developers place a heavy precedence on tailoring experiences to mobile platforms. This is also known as progressive enhancement. Basically, you perfect your website at the smallest possible screen size before moving on to bigger devices. This strategy makes it possible to create a responsive design that retains its functionality across distinct platforms.[1]

Suppose that a given company wants to build a website that users can engage with via their smartphones or their laptops. In a mobile-first workflow, it would design the UI, visual assets, functional features and other components for the smartphone version before reworking them to target its computer users.

Mobile-first design does more than simply address screen size variations, however.[2] It also accounts for factors like:

  • Mobile devices’ reduced processing power and limited battery life
  • Mobile users’ tendency to have wandering focus
  • Lighting variations that impact page visibility
  • Reduced or limited Internet connections

Where did the mobile-first craze come from? Most sources agree that the first widespread usage of the term occurred around the early 2010s after a designer named Luke Wroblewski popularized it in a book on the subject.[3] While the definition has undergone various changes and philosophical shifts since then, its focus still remains on delivering essential components uniformly regardless of device.[4]

The Progressive Alternative

Progressive web apps are made to overcome many of the same challenges that mobile-first design sought to solve. They focus on delivering uniform experiences via the liberal use of web technologies.[5]

Progressive web apps blur the lines between different forms of mobile development. After being proposed by Google around 2015, the idea of capitalizing on the ease and accessibility of web development techniques and APIs instead of trying to develop tough-to-crack native apps quickly caught on.

According to Google, progressive web apps are designed for engaging, quick reliability.[6] These apps can be used in any browser, but behind the scenes, they’re engineered to have the seamless, immersive feel of native software. In short, they combine some of the best characteristics of mobile-first apps with the reduced complication of web apps.

What actually makes these apps “progressive?” In addition to easing maintenance through the use of web APIs and loading instantly regardless of network conditions, they’re made to feature continuous enhancements.[7] As users become accustomed to the software, it progressively grows more powerful by:

  • Prompting people to install it on their home screens via push notifications
  • Saving progress and app states in the form of shareable browser links
  • Incorporating new web features as they become available to devices and browser clients

How Do These Strategies Impact SEO?

Progressive web apps are easy to discover and engage with. Users don’t have to go through an app store, install your software and then open it up. Instead, they can click directly on a link and start using the software right away. Considering one Google product manager’s claim that each preliminary step involved in using an app leads to a 20 percent drop in users, it makes sense to minimize the time between initial discovery and actual utilization.[8] Additionally, all of your content can become findable and indexed.

Thanks to technologies like HTML5 and Canonical URL tags, progressive web app content is also more open to search engines. In addition to being easier to find, this makes it possible to direct how search engines crawl your content and funnel users by specifying preferred page versions.

What Should Online Publishers Consider?

As an online publisher, delivering value is one of the most important aspects of engagement. While this idea motivated the earliest instances of mobile-first design, devoting your attention to websites doesn’t always cut it in terms of providing a uniform experience, especially if people have to switch between your site and your app.

Of course, not everyone needs a mobile-first site or progressive web app. While these forms of content are useful for those who offer functional software, they may not be necessary if your page simply hosts static content.

For publishers who create or share video, on the other hand, the problems associated with deploying and maintaining native apps can manifest in huge ways. Although Android and iOS native libraries facilitate media playback and capture, using existing web frameworks makes it much easier to leverage the capabilities of a given platform without having to deal with lower-level code. Sticking to widely accepted web standards also reduces the likelihood that you might have to reformat or update your video content when Google or Apple decide to change the way their mobile operating systems deal with media. In short, progressive web apps might make it easier to maintain a uniform, consistent content publishing system.

Progressive web apps are closer to attaining the device-agnostic ideals that mobile-first sites originally set out to achieve because they foster a universal user experience. While the original tenets of mobile-first design remain relevant, applying them to progressive web app development may offer increased advantages. When you can guarantee that your app or site content looks and feels exactly the same no matter what lens it’s viewed through, you’ll deliver a truly satisfying experience that underscores your branding more effectively.

Sources:

[1] https://www.uxpin.com/studio/blog/a-hands-on-guide-to-mobile-first-design/
[2] https://varvy.com/mobile/mobile-first.html
[3] http://www.lukew.com/resources/mobile_first.asp
[4] http://moboom.com/blog-post/what-is-mobile-first-design-and-why-should-i-care/e14c121f-f539-aa88-23a1-5217e7b71283
[5] https://www.smashingmagazine.com/2016/08/a-beginners-guide-to-progressive-web-apps/
[6] https://developers.google.com/web/progressive-web-apps/
[7] https://developers.google.com/web/fundamentals/getting-started/codelabs/your-first-pwapp/
[8] http://blog.gaborcselle.com/2012/10/every-step-costs-you-20-of-users.html
Image credit: http://thenextweb.com/insider/2015/10/21/top-myths-mobile-startups-tell-themselves-about-user-acquisition/

Be Sociable, Share!

Speak Your Mind

*

*