31 Oct 2015

Responsive Design Should Be a Baseline Requirement

For a while, there were two schools of thought on how to build a web site that works across a range of screen sizes and device types [1]. One is to build a separate mobile website, customarily hosted at m.<main site>.com. Another is to have a single responsive site that tries to present itself in the best possible manner for any screen size.

Both approaches have their pros and cons, and there are technical reasons why one may prefer one to the other. But, more importantly, there are a couple of UX reasons why responsive design works better.

First, with the introduction of split view and “slideover” on the iPad, one of the two apps has an iPhone-sized area to display itself in. Detecting the device as an iPad and therefore displaying a tablet- or PC-optimised app is wrong. The right thing to do would be to show the mobile version. Not only that, the viewport may keep changing as the user adjusts the split view, or makes the site full-screen. Responsive design is the only way to do this.

This also affects laptops. I had two windows side by side on my Macbook Pro, and I found that Wikipedia had a poor UI, with too much of the critical horizontal space taken up the sidebar, and the right pane with the table of contents. A tablet or mobile version of Wikipedia would have worked better for this size of window.

Twitter is no better:

Every single one of the tweets is clipped at the right edge of the window, so I can’t read any. I can’t post because the compose box is also clipped [2].

And this is on the 15-inch Macbook Pro. Things would be worse on smaller laptops, like 13 or 12 inches.

In summary, companies should think twice before building a separate mobile version of your site, since it doesn’t have a good user experience, either on the iPad or on the PC. Responsive design is the better solution. 

All web sites should be responsive. Otherwise, it won’t work well on tablets and laptops. Which means that it’s a second-rate web site. The bar has been raised. Responsive design should be the norm, the baseline, for all sites. It’s no longer optional.


[1] An argument can be made that the best way to cater to mobile users is to build a native app, and to skip the mobile web app. While a native app is indeed a better user experience for a majority of users, there are several reasons why someone would visit a web app: they don’t use the app often enough to install it, they may not be okay with the permissions it helps itself to, or the native app may be too limited. Or the native app may be just different without being better, in which case who needs it? Or users may be okay with installing the app; just not now, when they’re in a hurry and need to get something done immediately. Or their phones may have no space to install another app, which is a common situation on low-end phones in India and other developing countries. The point is that there are several reasons why someone might want to cater to mobile users using a web app in addition to or instead of a native app.

[2] The window does scroll horizontally when you’ve typed enough, which is a partial solution to this problem, but one that’s jarring and hacky.

No comments:

Post a Comment