What is responsive web design, and do I still need to ask?

Responsive design stopped being a feature you pay extra for a long time ago. The more useful question now is not whether your site technically adapts to a phone, but whether it is any good on one.

Here is the short version. Responsive web design means building one website that rearranges itself to suit whatever it is being viewed on, rather than building separate sites for phones and computers. You have one set of pages, one address, and one thing to keep up to date, and the layout adapts.

And no, you should not really have to ask for it any more. Fifteen years ago it was a line on a quote. Today it is simply what building a website means, in the same way a new car comes with seatbelts. If someone is offering it as a paid extra, that tells you something about them.

The question worth asking has moved on, and we will get to it below.

What it actually means

A responsive site knows how much room it has and arranges itself accordingly.

On a wide screen it might place three things side by side, put the menu across the top, and give a photograph plenty of space. Squeeze the same page onto a tablet and those three things become two. On a phone they stack into a single column, the menu folds behind a button, and the text stays a comfortable size instead of shrinking away to nothing.

The same website shown on a desktop monitor, a tablet and a phone, with its content reflowing from three columns to two to one

It is the same page in each case. The same words, the same photographs, the same address. Nothing is hidden away in a stripped-back “mobile version”, which was the common approach before responsive design settled the argument, and which left people staring at a cut-down site wondering where the rest of it went.

Why it stopped being optional

Two things happened.

The first is simply where people are. For most of the businesses we look after, more than half of all visitors arrive on a phone, and for some it is closer to three quarters. If your site is awkward on a phone, it is awkward for the majority of the people who see it.

The second is that Google now judges your site by its phone version. Mobile-first indexing means the mobile version of your pages is the one Google predominantly reads and ranks, not the desktop one. A site that is a struggle on a phone is not just annoying a lot of visitors, it is showing Google its worst side.

The question worth asking instead

Here is the part most articles on this subject leave out.

A site can be perfectly responsive and still be poor on a phone.

“Responsive” only really promises that the layout will not break. It says nothing about whether the result is pleasant, fast, or usable. We regularly look at sites that pass every technical check and are still a chore to use one-handed on a train: text set too small, buttons too close together to tap accurately, a phone number that is not tappable, a pop-up that cannot be dismissed with a thumb, or a page that takes eight seconds to appear on a normal mobile connection.

All of those sites are responsive. None of them are good.

So the useful question is not “is my site responsive”, because the answer is almost certainly yes. It is “is my site actually good to use on a phone”, and that is something you can judge yourself.

How to tell, in five minutes

Do not test this on your office wifi with a big monitor. Pick up your own phone, leave the building, and try the following.

Do the main thing. Whatever you most want a visitor to do, ring you, ask for a quote, book something, buy something, do it yourself on your phone, one-handed. If you find yourself pinching to zoom, tapping twice because you missed, or hunting for the phone number, so is everybody else.

Watch it load on mobile data. Turn the wifi off. A site that appears instantly in the office can crawl on a patchy connection, and that is the connection a lot of your visitors are on.

Read a paragraph without adjusting anything. If you have to zoom in to read the body text, it is too small.

Try the menu with your thumb. Can you reach it, does it open, and can you get out of it again?

Fill in a form. Does the keyboard show numbers when it asks for a phone number? Does the page jump around as you type? Is the submit button reachable, or hidden behind something?

If any of those made you wince, that is worth fixing, and it is usually a far better use of budget than chasing rankings. A visitor who cannot easily contact you has cost you more than a middling position in search results ever will.

What good looks like

Good on a phone is mostly unremarkable, which is rather the point. Text you can read without thinking about it. Buttons your thumb hits first time. The thing you came for near the top rather than below three screens of scrolling. A page that appears quickly on an ordinary connection. Contact details you can tap to ring rather than copy out.

None of that is exotic. It comes from designing for the phone first and letting the layout grow into a bigger screen, rather than designing a handsome desktop page and squeezing it down afterwards.

That difference in approach is usually visible within seconds of picking up a site, and it is the difference between a site that technically works on a phone and one that was built with the phone in mind.

If yours is falling short

If the five-minute test turned up more than you expected, it does not always mean starting again. Sometimes it is a handful of fixes: type sizes, tap targets, image weight, a menu that needs rethinking. Sometimes the underlying site is old enough that it is holding everything else back, and it is honestly better to rebuild than to keep patching.

We would rather tell you which of those it is than sell you the bigger one. If you would like a second opinion on how your site behaves in someone’s hand, get in touch and we will take a proper look. You can also read more about how we approach web design, and about the basics worth getting right before you invest in SEO, which is the same argument applied to search.