Responsive web design: that is having one site for desktop and one for mobile, right?

ARTICLE

Responsive web design: that is having one site for desktop and one for mobile, right?

by

A number of years ago, the world of web design encountered a revolutionary change. Both the way websites were developed, and the way visitors got to experience them have changed forever. Websites designed using the responsive web design approach, rendered content in a way that automatically adapted to a user’s device and screen resolution. The result: an optimized user experience that lead to higher conversions and customer satisfaction.

At times, however, we still get requests to design two website versions: one for desktop and tablet, and one for mobile use. Using a 2-design approach leads to a poor user experience, however. And your metrics will suffer accordingly.

A case for being responsive

Do you have any idea how many different screen sizes and resolutions are currently available? We did a quick round of research and were astonished:

24.093 different Android devices

The number of different screen resolutions, even within each kind of device is enormous! There are hundreds of screen resolutions for mobile phones only. We came across a ​report by OpenSignal​ that stated there were no less than 24.093 different Android devices in 2015.

Most popular screen resolutions

Providing website visitors with an optimized version of your website has all kinds of practical and psychological benefits. But what screen sizes and resolutions are most popular? These links show some data about the screen resolutions most used in ​The Netherlands ​and in ​Europe​ as of May 2018.

Compared to Europe, more people in The Netherlands use screens with higher resolutions. 12.86% of users view websites on a screen with a 1920x1080px resolution and 12.61% uses 1366x760px. These top 2 screen resolutions are available in desktop screens and mobile devices, though. And that is another factor that complicates matters. Because a website that renders beautifully on a 1920x1080px desktop screen will still need to render entirely different on a 1920×1080 smartphone screen to offer an equally pleasant user experience. 11.82% of users view sites on mobile phones with a relatively high resolution (360×640 px). #5, the classic 1024×768 screen resolution is also available for both desktop screens and mobile devices. And, having said all that, have you noted the whopping near 30% included in “other”? That 30% includes, among others, the growing number of tiny smartwatch screens.

It therefore is essential to look beyond screen resolution. Knowing screen resolution data is helpful, but only as part of a bigger picture.

Does desktop still rule?

With these numbers in mind, we were wondering about that, too. And actually, it does. The same GlobalStats website as referred to above, provided us with the data we needed: Both in The Netherlands, and in Europe, the number of desktops in use still outweighs the number of mobile devices.

“most used” = “ converts best” ?

That is another factor to consider. Smartinsights.com claims that, while ​mobile internet usage keeps growing fast​, most people still prefer to use their desktops to review items in more detail and to make purchases.

Do you still think a 2-design approach is the right way to go?

Responsive web design, how did we even get there?

Development at the speed of light

Time flies by so fast! The speed at which web design has developed, however, can only be compared to the speed of light. Websites created some 10 years ago are barely comparable to websites released in 2018. They look, feel and function completely different. Ten years ago, technical limitations hugely restricted our design options. Not anymore. And your business benefits in many ways.

Design: from optimized per pixel to optimized for user experience

Design evolved from static websites to the use of animations that help users accomplish their goals more easily. From pixel perfect designs to fluid/adaptable designs that adapt to any device and screen size. From fitting all​ ​important information above the page fold (and somehow most information was considered important!) to longer, scrollable pages so that your users can easily find what they are looking for. From busy layouts to peaceful, towards even minimalistic designs so your users won’t get confused and click away to try your competitors site instead.

Nowadays we build playful interfaces to provide a pleasant user experience and help users accomplish their goals quickly and easily. We pay a lot of attention to UX and it really makes a difference.

Functionality: from online brochures to self-service portals and video chat

Websites used to be like online business cards and brochures. Most business owners merely published business and product information, as well as a contact form.

Nowadays customers can buy and receive almost every product and service online.

Also, website users have gotten used to self-service options such as making changes in their account settings and paying bills. They appreciate having customer service agents available to help them out using chat or even video chat functionality. That does place higher demands on a website’s performance, however. Imagine a user that opens video chat to get help. Unfortunately the video chat gets disconnected several times. Each time, your visitor gets connected to a different agent and needs to start all over again. If a website visit does not result in a positive experience, visitors will simply abandon a shopping cart. As a result, your conversion rates will suffer as much as your visitor did.

Most of the users won’t return to a site after a disappointing experience.

With all technology available today, visitors simply expect a website design to adapt to a users’ device and screen size. And they expect to get access to all functionality, no matter the device used.

Personalization

Personalization, in a web development context, refers to how content adapts to users, previous interactions and to location. Additionally, personalization refers to how content adapts to the device used!​ ​Personalization is known to increase conversion. We deeply believe that personalization needs to be an integral part of the design process.

Optimizing user experience boosts conversions

All these fairly recent developments have improved user experience greatly. Visitors who can accomplish their goals across devices quickly and effortlessly, convert better, show higher customer satisfaction and are more engaged. Everyone benefits.

The reputation of your business greatly depends on how your users perceive their use of your website.

Are you ready for the future?

According to ​research performed by Business Insider, the world will host more than 24 billion internet connected devices by 2020. That is more than 4 devices, and probably the same number of screen sizes per person!

Who knows what the preferred screen resolution in Europe will be 2 years from now? A TV-screen? Or a maybe a phablet? (check ​how fast phablet use has been growing over the past few years​)

May we recommend that you check your current website on as devices as possible? And make sure they adapt well to any of these? The better your website adapts to devices used today, the more likely it will be to adapt to the devices of the future (think glasses, watches, TV, phablets, Multi-touch desktop etc…).

An optimized experience for every single user

At Level Level, we are passionate about responsive design. By designing for a wide variety of layouts, we ensure an optimized experience for every single user. As a result, both your reputation and your conversions will soar.

In short

Limiting your website visitors to a choice between a website optimized for phones and one for desktops and tablets will lead to a poor user experience for A LOT of users. This will in turn affect your website metrics, including conversions and even the reputation of your business.

The real question is: does your website benefit from the full potential of responsive design?

What’s next?

We will soon publish more articles about this subject. In the next article: discover all about Level Level’s 6-layout approach to responsiveness and find out which elements need to change when adapting to screen resolutions. Stay tuned.

Tell us about your plans and ambitions!

We are up for any challenge!