Responsive web design delivers a website that dynamically adapts to any device format or size. There are, however, important limitations to consider before getting too excited about this new evolution in web development.

Dealing with mobiles and tablets for brand pages is a challenge in design and technical performance. It is important to consider not only the presentation layer in creating something usable and engaging, but also to consider the performance. A slow-loading page on mobile sees a very high abandonment rate and frustrated users.

Responsive web design (commonly referred to as RWD) has started to emerge as a compelling alternative to a duplicate or parallel site development or an alternative to traditional mobile site adaptation tools.

RWD means that sites on tablets can be ‘reformatted’ depending on orientation, with navigation switching between dropdown menus or a list of buttons, for example. This ability to create an adaptive presentation layer in a single development framework is extremely tempting.

Unfortunately, RWD has shortcomings more appropriately addressed in parallel developments: compression, speed and optimisation. Going mobile is not just about the presentation layer. Consideration needs to be given to the challenges in bandwidth on mobile and the time taken on slow processor mobiles to load a complex multimedia page best suited for desktop broadband. Even though the fluid design will give a great interface, if the page is still one or two megabytes in size, many consumers won’t wait for the 20- to 30-second load times.

In 2012, RWD went mainstream. More and more landing pages and brand sites explored the power of RWD. But it is important to understand its limitations.

RWD is not the magic pill for mobile branding and marketing sites. Have a look at sites like www.ableton.com and slowly reduce the size of your browser and you’ll start to see how RWD can alter the presentation layer. Some other good examples are css-tricks.com, currys.co.uk, and even microsoft.com.

Here lie the real challenges. The main image on the Microsoft site, for example, is 180 kilobytes in size. As you resize the browser window, the menu moves to a dropdown format and the content layout adjusts to suit the dimensions. It’s a readable and engaging site on all device formats with responsive web design doing a sterling task. But once I get to a mobile device size, the main image is still 180 kilobytes in size, but just scaled to suit the device. A lot of mobiles don’t do this kind of rendering of images very well, so the resolution often looks poor. Some things are simply hidden in CSS (cascading style sheets), but they are still delivered to the device. The potential for significant performance issues is high.

Large, busy sites can certainly leverage RWD to present better on smaller windows, but in general the performance will not improve. Moving images to backgrounds will enable loading of smaller images on smaller devices, but this approach isn’t always possible and limits presentation manipulation.

Despite the uptake of responsive web design, the performance issues are critical to consider. Mobile users are far more easily interrupted by text messages, calls and other external events and far less patient when waiting for pages to load.

The better RWD sites actually focus on reducing the overall page load size of the base desktop site, so that on other devices this lack of any optimisation has a reduced impact.

The biggest advantage of RWD is obviously a single code base for multiple devices of all form factors. When a new device emerges, the base CSS simply needs updating with new (if needed) definitions or styling rules for that device width. Maintaining a website across all these mediums is made far easier and ensures a certain level of interface and content consistency.

The decision to use full-adaptation tools requires some analysis of the customer, what’s being delivered and obviously the issue of performance. Many RWD sites have failed to properly consider their purpose for existing and failed to properly understand their audience.

With many sites, the additional time and cost of using RWD delivers a great visual experience, but ignores the customer and would have been better delivered as a single desktop site.

Mobile is no longer an afterthought or even a secondary project from the desktop website. For many online retail sites, in fact, mobile access is higher than that of the desktop. In some cases, while access may be balanced, the successful conversion through the payment process is higher on mobile. Many recent web projects I’ve been asked to review have actually started with a mobile-focused design and then adapted in reverse to the desktop. It’s an interesting change in approach, but logical when you analyse where the target audience is coming from and where higher conversion rates exist.

Delivering a brand experience across different mediums isn’t just about the layout or the performance. The device differences deliver different functionality and, as such, a pure RWD is unable to take advantage of each platform’s strengths. For example, rich video and other multimedia objects can work well on a desktop with lots of real estate to offer a compelling and immersive experience. On mobile, a simple reformatting ignores the device constraints, whereas a proper mobilisation could replace such objects with a different style of slideshow.

Consider also things like store locators. On mobile devices with accurate GPS (global positioning system) tracking sites can offer more detailed driving instructions and navigation options. On a desktop, such driving instructions wouldn’t make sense. On mobile, you also want to leverage click- to-call capabilities and exportable contact information for automatic contact record creation.

RWD has its place and delivers exceptional results for certain types of pages and/or websites. It’s important to appreciate where its strengths and weaknesses are and to not ignorantly adopt. The extensive benefits of a proper mobilisation project simply cannot be achieved with pure RWD. But, by the same token, the rapid flexibility and relative cost savings of RWD are hard to beat if the content and objective of the site are suitable.

So before risking a decreased level of consumer engagement on mobile by using responsive web design, consider the site objectives, how a consumer will interact with and use mobile versus desktop, any varied functionality available on only one of the mediums, the performance challenges and, overall, if the core design should actually start with mobile and migrate back to desktop. RWD will continue to achieve impressive adoption, but don’t use anything for the sake of it, and to the detriment of good results.