5 Reasons Why Responsive Web Design Isn’t Worth It

5 Reasons Why Responsive Web Design Isn’t Worth It
This article is from Tom Ewer's Managewp blog, expressing his different views on the currently popular responsive design.
The shift to mobile design is a bigger revolution than the PC revolution - Kevin Lynch, CTO, Adobe
By 2014, more people will use mobile devices instead of PCs to access the Internet, so creating accessible mobile terminals has become one of the most important issues for Web developers. Therefore, responsive design came into being, but from my personal point of view, it is not worth pursuing. Why?
Responsive design is not a one-size-fits-all approach. I myself was a fan of responsive design in the past, and I found that many web applications could not be displayed well on mobile screens. Google Maps is a good example. Websites that contain a lot of pictures are also suitable for responsive design, but text-based web pages and blogs are not. I even think that implementing responsive design for such websites is just a waste of time.
5 Reasons Why Responsive Web Design Isn't Worth It 123WORDPRESS.COM
1. “Responsive design” does not meet user expectations The first rule of Usability 101 is “meet user expectations”. Taking blogs as an example, the widely accepted design approach is: from top to bottom, with content and pictures on each side and sidebars provided. This has been used in millions of blogs because it meets user expectations.
But if you visit a responsively designed mobile website, the sidebar will generally disappear, or jump to the very top or very bottom, which is not where you expect it to be. Taking Cats Who Code as an example, the following is the desktop display, with the top navigation, sidebar (including recent posts), small advertising bar and search box. Here is the iPhone interface:
You can see that the navigation and sidebar disappeared. When I continued to drag down, I finally found the sidebar. You may think this is just an isolated case, but the fact is that this is a typical responsive design. What we want to see is a mobile interface display without sacrificing desktop elements, which is obviously not the case.
2. It costs more money and takes longer. Generally speaking, responsive design costs more money than non-responsive design. If someone were to argue that responsive design is cheaper than building an extra mobile layout, I’d agree, but you know what’s cheaper than responsive design? Nothing!
Also, think about how much time it took you, what return on investment did you get from responsive design, and what did you gain?
3. Non-responsive design performance is not bad. Take a look at my own blog display effect on Mac:
Watch it on my iPhone:
It reads great on the iPhone's 4-inch screen. If the text is too small, double-click to enlarge it. It is not difficult to shrink it back when you have finished reading it. And the funny thing is that today’s mobile interfaces are designed to be non-responsive, and most phones perform just fine with that. If you really want to find some surprises, look at the desktop versions of those websites, the design is also poor.
4. Not good for loading time. We know that mobile devices operate based on the Internet sub-broadband connection speed, so web pages must ensure the least load to reduce loading time. Many responsive designs do not really reduce loading time because many designers simply hide those elements, which is of no benefit to optimizing loading. Non-responsive designs can choose "lazy loading", which is a technique that chooses to load the most intensive elements first and then the others.
5. Responsive design is actually a compromise. It can be said that responsive design is a subjective decision made by designers. They believe that the desktop display interface is no longer suitable for the mobile interface, and then they feel that corresponding changes must be made. If users see an even more uncomfortable interface, they will ask, why do we have to use such a different and not very good display method? This violates the second rule of usability 101: "Don't let users feel that they have no control over the situation."
So my point is: this is just a compromise, a subjective decision made by the designer, and users don’t feel much discomfort, especially when responsive design costs money and time.
Finally, I wrote this article for two reasons: I think responsive design is unnecessary in many cases; and there is a distinct lack of debate on responsive design on the Internet. I don't deny the theory of responsive design itself, but the fact is that in many cases I've seen it's really not necessary. Many people are used to thinking that it is natural when others advocate it, but you'd better look at it from a developer's perspective and ask yourself, is this really what you need?
PS: What is responsive design? The design and development of the page should respond and adjust accordingly based on user behavior and device environment (system platform, screen size, screen orientation, etc.). The specific practice consists of many aspects, including flexible grid and layout, pictures, and the use of CSS media queries. Whether the user is using a laptop or iPad, the page should be able to automatically switch resolution, image size, and related script functions to adapt to different devices.
Via managewp

<<:  Example code of how CSS matches multiple classes

>>:  MySQL foreign key (FOREIGN KEY) usage case detailed explanation

Recommend

Tutorial on installing PHP on centos via yum

First, let me introduce how to install PHP on Cen...

A detailed introduction to HTML page loading and parsing process

The order in which the browser loads and renders H...

4 ways to implement routing transition effects in Vue

Vue router transitions are a quick and easy way t...

Solve the problem of MySQL using not in to include null values

Notice! ! ! select * from user where uid not in (...

MySQL infobright installation steps

Table of contents 1. Use the "rpm -ivh insta...

Summary of the 10 most frequently asked questions in Linux interviews

Preface If you are going to interview for a Linux...

Vue implements a simple magnifying glass effect

This article example shares the specific code of ...

Docker installs mysql and solves the Chinese garbled problem

Table of contents 1. Pull the mysql image 2. Chec...

Detailed process of creating a VR panoramic project using React and Threejs

Recently, I'm learning to use React with Thre...

XHTML 1.0 Reference

Arrange by functionNN : Indicates which earlier ve...

CSS syntax for table borders

<br /> CSS syntax for table borders The spec...

Three implementation methods of Mysql copy table and grant analysis

How to quickly copy a table First, create a table...

A brief discussion on the alternative method of $refs in vue2 in vue3 combined API

If you have experience in vue2 project developmen...

Two ways to open and close the mysql service

Method 1: Use cmd command First, open our DOS win...

Problem record of using vue+echarts chart

Preface echarts is my most commonly used charting...