Design & User Experience
As frontend developers, we are responsible for the end-user experience. We implement designs, create animations and set up validation rules for forms. We have numerous responsibilities.
Great talk/article from Chris Coyier: ooooops I guess we’re* full-stack developers now
Responsive Web Design
Pay attention to detail. Do a mobile first design. And always think about edge-cases. Making a perfect responsive web app takes time and a lot of testing. Don’t underestimate real device testing. It’s the one which can provide you with the most valuable feedback.
Typically, apps are supposed to be optimized for mobile phones, tablets and desktop. Today, there are too many different devices with different screen sizes. Ideally, you should cover the most typical devices, like iPhones or Samsung/Android.
Online cross-browser testing tools
Progressive Web Apps
Progressive web apps are just like a normal web, but with superpowers.
Progressive web apps are designed to work on any browser that is compliant with web standards. As with other cross-platform solutions, the goal is to help developers build cross-platform apps more easily than they would with native apps. According to Google Developers, the characteristics of a PWA are:
Progressive — Works for every user, regardless of browser choice, and uses progressive enhancement principles.
Responsive — Fits on any device: desktop, mobile, tablet or whatever comes out next.
Performant — Scrolling is smooth. Quick response time. Rapid caching. Running on 60ps.
Network independent — Service workers allow offline usage or usage on low-quality network connections.
App-like — Feels like an app to the user, with app-style interactions and navigation.
Fresh — Always up to date due to the service worker update process.
Safe — Served via HTTPS to prevent security issues.
Discoverable — Identifiable as an “application” by manifest.json and service worker registration, and discoverable by search engines.
Re-engageable — Ability to use push notifications to maintain engagement with the user.
Installable — Provides home screen icons, without the use of an App Store.
Linkable — Can easily be shared via a URL and does not require complex installation.
Business Value
Research by AppInstitute (September 25, 2017) provided some key statistics and benefits of PWAs. According to the research, progressive web apps result in the following:
68% increase of mobile traffic
15x improvement of load and installation speed
25x reduced usage of device storage
52% average conversion increase
78% average session increase
137% engagement increase
42.86% lower bounce rate when compared to that of mobile websites
133.67% increase in page views
As of today, we can assume those numbers are even higher. Put simply, PWAs are less expensive but, at the same time, more profitable.
The Business Perspective — Progressive Web Apps says that the types of businesses best suited for PWAs are:
E-Commerce businesses
News & media organizations
Bloggers & influencers
Social Media businesses
Review websites
Any business that focuses on text, image and video content as its primary offering
Articles
How Progressive Web Apps (PWA) can help to scale your business by YSBM group with amazing business/industry examples
Must know: 10 benefits of PWA that will boost your business by Aleksandra Kwiecień
5 key benefits of Progressive Web Apps by Danny Kijkov
3 Limitations of Progressive Web Apps by Danny Kijkov
Why Progressive Web Apps Are The Future of Mobile Web By Jason Rzutkiewicz & Jeremy Lockhorn
Last updated