HTML5 Zone is brought to you in partnership with:

John Sonmez is a Pluralsight author of over 25 courses spanning a wide range of topics from mobile development to IoC containers. He is a frequent guest on podcasts such as DotNetRocks and Hanselminutes. John has created applications for iOS, Android and Windows Phone 7 using native tools, HTML5, and just about every cross platform solution available today. He has a passion for Agile development and is engaged in a personal crusade to make the complex simple. John is a DZone MVB and is not an employee of DZone and has posted 86 posts at DZone. You can read more from them at their website. View Full User Profile

Why Responsive Design is a Waste of Time

10.24.2013
| 7867 views |
  • submit to reddit

(Update: My view is starting to change from when I first wrote this article.  Thanks to numerous people who have pointed out many things I overlooked and have helped me to understand what responsive design really is and what goals it is trying to achieve, I am getting a better understanding of why it may indeed not be a waste of time.  There are still some valid points that I brought up in this article, but I don’t stand by my original blanket statement that it is a waste of time.  It especially seems like responsive design may be worth the “trouble” for ecommerce sites where you are more much likely to make the sale if someone can easily purchase and browse your products from a mobile device.  Thanks everyone who has been giving me great advice and resources for better understanding responsive design and for mostly doing it in a “nice” way.)

Responsive design seems like a good idea.

At first glance, it makes sense. Why wouldn’t you want your same website to scale down to a mobile device and display differently?

And, sure, if there were no cost involved, if you could just flip on a switch and make your web application responsive, I’d definitely say do it… Why not?responsive design thumb Why Responsive Design Is a Waste Of Time

For example, there are many WordPress themes now that offer responsive design baked right in. If you are using one of those themes, you might as well take advantage of the hard work someone else has put into making the design responsive.

But, if you are creating a new website or you are considering converting your existing website to a responsive design, I’d suggest you think twice before making the plunge.

The Extra Work of Responsive Design

The biggest problem with responsive design is the extra work involved.  Sure, there are frameworks and tools to make responsive design easier, but no matter how good those frameworks and tools get, to make a site adapt from the desktop to a mobile device, it is still going to require significant work.

If you have a really simple site with just a few pages or pages that pretty much all use the same layout, but just differ in content (like a blog for example,) then the work might not be that much, so go ahead, make it responsive.

But, if you have a website of any considerable size, you’ll probably find that responsive design is going to add a non-trivial amount of extra work to your project.

It actually turns out the adding responsive design to a web site can add more work than creating a separate desktop and mobile site, because you are creating a user interface that morphs or adapts to the mobile form factor–which, by the way, is ever-changing.

The Problem With One-Size-Fits-All

Consider this. Which is more difficult to create: a car that turns into a motorcycle, or a car and a motorcycle?

Here is another one.  Which is more difficult to create: a multi-function printer, or a printer and a scanner?

When you try to make a product that can do multiple things, the complexity of creating that product increases exponentially. It is almost always easier to create two separate products that do two different functions or have different form factors, than it is to create an all-in-one product that is able to do many things.

Besides the increased difficulty, trying to create products that do more than one thing usually results in them not doing either function that great.

Isn’t it better in most cases to have two products that both do what they are supposed to do and do it well, than a single product that does two things at a mediocre level?one size fits all thumb Why Responsive Design Is a Waste Of Time

I’m not saying you can’t design a great responsive website that serves desktop clients and mobile clients wonderfully and makes their eyes light up with joy every time they see your beautiful site.  I’m just saying you won’t.

Let’s face it, unless you have a huge budget and time and have access to really good designers and JavaScript and CSS skills needed to pull it off, you’ll probably end up with something that works on both mobile and desktop and is reactive, but morphs from a pretty crappy desktop site to a pretty crappy mobile site.

I don’t know about you, but I’d rather just create a separate set of HTML, CSS and JavaScript for mobile version of the site and make both the desktop and mobile version look great than to have a mediocre compromise on both platforms that took twice as long to create.

I’d also rather not be handcuffed to my original design because changing anything will incur the cost of making changes to the reactive layout as well, that scales down to mobile.

The Reuse Fallacy

What are you really trying to do by creating a reactive design, instead of just creating a desktop version and mobile version of the site? Reuse some HTML and CSS?

When you think about it, it doesn’t make much sense. I’m all for code reuse, but responsive design is like putting ifdefs all over your code base. Are you really saving much time and effort by reusing your front end code for both platforms?

It seems to me, that if you have to have your site display differently on a mobile device you are better off just forgetting about trying to reuse the HTML markup and CSS, and instead focus on reusing the backend code for both the mobile and desktop versions of your site; that is where you’ll actually get the biggest bang for your buck.

Again, I don’t know about you, but I’d much rather maintain two front end codebases that are simple than one monstrous complicated front end codebase.

It is Good Enough Already?

Most desktop websites actually look fine on a mobile device without any reactive design. To me it makes much more sense, in most cases, to focus on just creating a desktop design that looks good on mobile or even a mobile design the looks good on the desktop as well.

Sure, responsive design is pretty cool, but do you really need it?

It is the Browser’s Responsibility Anyway

Aside from the practical reasons I’ve talked about so far, there is another major reason why responsive design might just be a waste of time anyway: this should all be the browser’s responsibility, not the web developer’s.

What I mean by this is that, just like HTML5 brought us changes to HTML that required the browser vendor to start supporting many of the things that web designers were doing manually, like playing video and drawing with JavaScript, it is very likely that eventually the responsiveness of responsive design will be relegated to where it actually belongs anyway: the browser and the markup itself.

This is even already starting to take place. Consider the special input types in HTML5, like the number input type. On a mobile device it brings up the numerical keyboard in mobile browsers.

I predict as more and more websites are viewed from mobile devices, the types of things that web designers are doing to make desktop sites responsive right now will be incorporated directly into the HTML markup and the browser itself.  So, creating a responsive design manually might end up being a big waste of time.

I’ll leave you with one final point, then I’ll get off my responsive design soapbox.

We are in a Time of Constant Flux Right Now

Things are changing rapidly. Mobile devices are getting bigger screens and higher resolutions and becoming much more powerful. While two years ago it was a pain to visit a desktop site from a mobile browser, it is much less painful now. With my new Galaxy S4, I hardly feel the difference at all, and I even find myself specifically requesting the desktop version of a mobile site from time to time.

The trend says that mobile browsing will eventually take over desktop browsing as the main source of visitors to websites.  If this becomes reality—which I see no reason to doubt—responsive design won’t make much sense at all. In that case, it will make much more sense to build websites optimized for mobile and not really worry so much about desktop.

If you are going to do responsive design, at least get a good book on the subject. There are many subpar books floating around, because responsive design is so hot right now.

What do you think?  Am I off my rocker?  If you have a convincing argument as to why responsive design is worth the effort or why it isn’t as much extra effort as I have painted it to be, I’d love to hear it.  Let me know in the comments below.

 

Published at DZone with permission of John Sonmez, author and DZone MVB. (source)

(Note: Opinions expressed in this article and its replies are the opinions of their respective authors and not those of DZone, Inc.)