10 Facts About Responsive Web Design

Responsive design is a hot topic these days, and for good reason. With most companies seeing mobile traffic coming to their sites exploding, a lot of people are scrambling to make their sites accessible.

One thing we like to tell clients is that responsive design is almost like a media format change. Like when VHS went to DVD, the people who want to stay competitive are going to have to update. And, since a good share of the web is going to need to be rebuilt, there are a lot of opinions, and general nonsense out there. Our hope is that we can help you cut through all of this, and understand what responsive design can (and can’t) do for you.

1. Responsive Design is Not A Cure-All

One of the most important things to keep in mind about responsive design is that it is a quality of a site, not how the site itself is built, that matters. Sure, responsive design is important, but it will not make a bad site good (or vice versa). It is true that responsive design allows a great site to be seen and enjoyed by more people in the manner in which it was designed. And, because of this, the user experience on mobile devices is typically better (if not much better) because of responsive design, but the site itself is not fundamentally made much better, or much worse, because of it. To put it in simpler terms, responsive design is the sauce, not the steak.

2. A Responsive Site is Different from a Mobile Site

Mobile sites were one of the first efforts to better cater experiences to mobile users. Most of the time, site owners would design a special version of their site for mobile users, usually with a sub-set of the site content (as to not overwhelm the smaller screens). The problem with doing mobile sites, for most site owners, is two-fold. First, it can be difficult to have to maintain two separate versions of the same site. From keeping content, offers, images, etc. in sync, to simply knowing what was on the mobile site (and what wasn’t, and why) does create a maintenance burden. Secondly, many site visitors do not want to have a watered-down mobile experience and many actually opt for the full site on their mobile device, which creates doubt as to the overall effectiveness of the mobile site. By using responsive design, on the other hand, both of these issues are mitigated. Site owners are happy to not have to maintain two separate sites, and site visitors are treated to a site’s “real” experience.

3. Not All Sites Need to be Designed ‘Mobile First’

There is a big trend among designers about thinking “mobile first”. Since mobile device use of the Internet is exploding, it can be easy to get carried away trying to cater to mobile users. The truth of the matter is that your focus should be on what your users and customers need. Look at your web analytics. Is the overall mobile use of your site less than 10%? If so, then mobile users (clearly) are the vast minority. It is not that they should be ignored, after all, by ignoring a good % of your users you are just offering them to your competition who isn’t ignoring them, but like everything else, it is good to keep things in perspective.

Thinking mobile first is actually more of a design problem than a website problem. That is, when making a website responsive, it is important to consider how the site will break-down on smaller screen sizes. Usually, this is done by creating grid-based “blocks” of content, prioritizing them, then re-stacking them on smaller screens based on priority. For some sites, especially that are more focused on consumer goods, services, and entertainment, taking the mobile experience into account early AND throughout the design process can be critical. However, for your project, your job is to figure out how important the mobile experience is to your overall site’s audience and plan accordingly.

4. Most Sites Can be Converted to be Responsive

For the most part, most sites can be converted to be responsive. Typically, the only show-stoppers are sites that simply cannot be broken down into multiple horizontal chunks. An example of this type of site is one heavy in data tables (or other large, continuous elements). Sites heavy in high-definition video sometimes fall into this category too.

However, these problems are almost always solvable. And, since (often) responsive conversion projects take between 60%-80% of the time and effort of developing a new site from scratch, it can make a lot of sense to spend some time re-designing the site to work better across all screen sizes. Responsive conversion projects typically end up being a bit like a home remodeling projects. Sometimes, many of the existing elements can be re-used and just shifted around a bit. Other times, a little bit of new construction is needed for the project reach its full potential.

5. The Best Responsive Sites Keep an Eye on Responsive Issues Throughout Design and Development

Ideally, you will want to be thinking about responsive design before, during, and after your project. Although, for most projects, it should not the the main thing you think about, doing adequate planning almost always saves heartache down the road. The main thing to keep in mind is to think about how you want your site’s content to react to smaller (and larger) screen sizes. Even if it just in the form of wireframes, knowing how your site will still create a great experience on small AND large screens is key. We will say, though, that the longer you delay thinking about (and planing for) responsive design in a project, the more likely you are to have budget overruns, re-work, and generally a much more complicated (and expensive) project.

6. Responsive Design is a Design and Development Issue

Responsive websites get their behavior from the front-end HTML/CSS (and sometimes JavaScript) code that runs in the web browser. However, the code is only the means of putting the site’s design on the screen, it is not the design itself. As such, for high-quality responsive experiences, what shows on the screen is tightly-choreographed ahead of time, as part of the design process. Like most things, it is hard to create a great user experience on accident. Instead, most great experiences are well-thought out ahead of time and well-executed.

7. Responsive Websites Do Cost More, But Not Drastically So

Every website project is different. There is no real “industry price” for any of these things, but adding responsive design to a project typically adds about 20% to the project. Sometimes a little more, sometimes a little less, but the average is about 20%. One of the main reasons why responsive design adds this much to a project isn’t actually the design and development itself (after all, if we are designing and developing the site anyway, why the increase?), it is actually in the testing. By offering you a responsive site, we will now need to test the site across a multitude of different devices, at wildly different sizes. Although responsive sites do add to the design and development workload some, often, the lion’s share of extra work comes in the testing of a project, making sure everything works on every device it is supposed to.

8. Not Everyone Needs a Responsive Site

The simplest way to tell whether or not you need a responsive site is to look at your site analytics. Tools like Google Analytics (and others) make this pretty easy. For most site operators (even those in industries who would not expect it), they are seeing trends showing mobile traffic increasing an average of 100% per year. As an example, with our own site, we saw mobile usage go from about 1% of our total traffic to almost 10% of our total traffic in about 18 months. This is a bit above the trend-line that we are seeing elsewhere, but not much. In fact, it is not uncommon for our clients to have seen an order of magnitude jump in mobile traffic in just a year’s time. Like anything else, the key is in figuring out how going responsive could help you, and by how much. If you are hardly seeing any mobile traffic, a trend you expect to stay the same, then converting an existing site may be a waste. However, for any new project, with the way these trends are going, not building-in responsiveness from the start could end up shooting you in the foot.

9. Responsive Sites are Not Typically Harder to Maintain

For most of the responsive sites we build, the back-end is typically WordPress. That is, when the site operators want to update any of the sites content, or manage its functionality, they use WordPress to do it. And, it does not matter whether a site is responsive or not, WordPress works the same (in fact, the admin interface of WordPress has been responsive for some time). Although making code-level changes to your site can be a little more challenging with a responsive site, doing normal maintenance of the site is just as easy as with a non-responsive site.

10. Responsive Design Can Make Your Site More Effective

By taking the time to offer your mobile users a higher-quality experience, many sites almost cannot help but be more effective by being responsive. Users, almost universally will not only appreciate those sites that better cater to them, but will also spend more time on them, are more likely to recommend them, and are more likely to return. Like anything else, people will use the things that are best designed towards their needs, and with (rapidly) growing mobile use of the Internet, responsive design can be a way to offer a better, more tailored experience to your website users.

11. (Bonus) Don’t Let Responsive Design Distract from Your Overall Project

Let us be clear. Although it sounds like mobile use of the Internet is taking over everything, and any site that is not responsive by tomorrow will be out of business by next Tuesday, that is simply not the case. Responsive design is our specialty and even we are not this hyperbolic about things. Responsive design is a tool, a way a website is constructed and displayed. What really matters, with any site, is its quality of experience, content, and functionality. Can responsive design improve your site, allowing it to better serve more and more people? Sure, of course it can. But, the key with all successful website projects we have been a part of is keeping a tight focus on building the best website for the intended audience, and no more. Sure, responsive design is a great tool to use as part of this process, but it should not overshadow all of the other important pieces that make the website. Focusing more on the complete experience, on how the website operates as a whole, is far more important to your project than the specifics of how it is built.

Want to Learn More?

We would love to talk to you about your project and chat about how responsive design might make sense for what you are doing. Simply contact us and we will get back to you the same business day, promise.