The concept of Responsive Design is being kicked around pretty much everywhere lately, but it’s a lot more than just a buzzword; it’s quickly becoming as common as CSS for website design and development.

And this is no surprise: with more than 6 billion mobile subscribers worldwide, and almost half of them now using smartphones, mobile has become the best way to reach out to more of your users. Keeping a brand’s digital experience consistent, while welcoming more visitors from all of these avenues, presents an overwhelming complexity of multiple sites, duplicate content and many other problems. Responsive Design helps clear that all up.

Before we get into the why of Responsive Design, it might help to nail down the what.

Responsive Design is the practice of creating adaptive designs that deliver content seamlessly, and in real time, to visitors based on CSS media queries that tell the site the dimensions of the device they’re using to access it. It helps your site maintain your message consistently on a tablet, e-book device, smartphone, laptop or desktop.

A great example in Bridgeline Digital’s responsive experience came about in the opportunity to create multiple sites in iAPPS with this practice for a nationally known athletic club, from the ground up. Read on to get the whole story.

Responsive Design & iAPPS

In this case, the goal was more than just website redesign: it was an entirely new site that would be user-friendly as well as engaging for the quickly growing Bring-Your-Own-Device (BYOD) demographic. After all, visitors were online, active and increasingly mobile. Initially, discussions involved developing multiple sites – one for laptop and desktop users, and more for mobile devices. In the midst of planning, the Bridgeline design team suggested looking into responsive design. With responsive, all of these goals could be met completely with a single site – and at significantly less cost than originally planned.

With the flexible capabilities of iAPPS, and with help from Bridgeline’s development and design teams, the project team was able to create a web experience that was flexible for all devices, remarkably engaging and – we would soon see – very effective.

How it works

Using media query functionality in CSS3 (a fancy way of saying that when a visitor enters a website the CSS asks which sort of device is accessing it, and actually measures its physical characteristics), a responsive site adjusts the amount, layout and size of content accordingly, to make it appealing and easily engaging on any of them.

In action on a desktop or laptop, maximize the browser window to see the design at full status. Dragging the bottom corner up to different sizes will cause the site change dynamically to fit different screen sizes. Responsive is so… well, responsive … that any responsive site will first open at the appropriate size, based on the device visitors are using to access it, or the size of their browser window.

Why Should You Care?

More than 44% of those almost 3 billion smartphone users we discussed earlier access the Internet from that phone, and that number is projected to increase by as much as 18 times before 2016. With numbers like these, responsive design stops being a cool new toy or the latest hip trend, and becomes a clear necessity. But there are a few more reasons to consider this new approach:

1. It saves money. Setting up responsive design costs more money upfront, but a long term plan for mobile to build separate, device-specific sites will require more investment down the road (in labor, for one, as you’ll have to have a team of content editors posting to all sites, rather than just the one).
2. It helps prevent duplicate content issues. Using a mobile and a desktop version of the same site presents multiple site issues, the most significant – and problematic – of which is  duplicate content (psst… this is the one that gets your site penalized – heavily – in search engines!).
3. Honest! It really saves you money. And it’s worth mentioning again.  Two separate sites require two complete, separate content strategies (and not to mention the maintenance for each site).  That’s a lot of extra planning, writing, strategy – phew!
4. People are already landing on your site with all kinds of mobile devices. Pull some analytics and see how many mobile users have visited your site over the last six months, and then compare that number to last year. The increase you see is largely due to new, mobile device traffic.  Expect that number to do nothing but grow.
   Take those same numbers from the last six months and compare it to your overall traffic. The percentage of those that come from mobile is also going to increase significantly over the next 16 – 24 months. (Hint: Keep these numbers handy!  Having them available is essential when trying to make a decision on making your site mobile-friendly, and convincing the C-suite for buy-in!)
5. You’ll make more money. Visitors are much more likely to stay on a site and complete a call to action if the site is easy to navigate. And navigation on the smaller, more specialized “third screens” that your visitors are taking on every day ultimately convert  that visitor into a customer, or send them on to an easier to navigate alternative. A dynamic, easy and engaging experience is also likely to make them an advocate for your brand.

And, the final kicker that should get you and your C-suite really looking at responsive design: Google has recently announced that responsive design is their primary recommended configuration for smartphone-optimized websites, though the search giant doesn’t stop there.  As it has with the recent Panda and Penguin updates, Google seems to be continuing to put emphasis on the user experience – and rewarding sites that follow suit. Google says that these updates affected between 3% and 12% of queries – which is a little more than just pocket change.

With iAPPS flexability and Bridgeline’s responsive design experience and SEO capabilities, getting your sites optimized for search engines – regardless of the user’s device – is getting easier. And now it’s getting much harder to keep putting off making the leap.