Poor implementations of responsive web design often occur from poor planning or a false understanding about what the buzzword actually delivers.
The classic term, 'responsive web design', does not include much more than adapting to different display sizes from desktop to mobile devices. That only scratches the surface if your website is more complex than a blog. It is also key that online shops perform well.
The start page should load in less than three seconds otherwise 49% of all potential buyers will leave. Therefore, the weight of what is initially loaded needs to be optimised. A mobile browser will load all content of a classic responsive website, and then decide what will be displayed.
More sophisticated responsive design projects use RESS (Responsive Design with server side components) to detect “what is possible” on the client side and therefore only offer the content the requesting device can handle. Payloads for mobile devices can drop from 2 MB to 300 KB by using RESS.
Improving performance is not just about recognising devices by Apple, Samsung or other manufacturers, but the myriad of possible combinations of hardware, operating systems, browsers and web standards. A specific set of these features is called the delivery context. Using the right software and database on an RESS server will enable it to identify the best possible content for any delivery context in question.
Prepare for constant changes
It sounds like common sense, but we still meet clients who did not fully realise that today a web project is never done. New smartphones, tablets and their respective operating systems’ updates, various display sizes, new web standards like HTML5 and new browser standards mean constantly having to adjust websites to stay up to date.
As a consequence, intervals between updates or full website re-launches can increase to a weekly chore, instead of something that used to be done maybe every other year. Therefore maintenance costs play a much larger role now than previously.
Dealing with diversity
Companies often solely look at the initial cost of a web project, but rarely keep in mind how many different teams are making contributions. It is all about conversion rates for the sales department, but the IT team is concerned about security risks, while the designers’ priority is visualisation.
The result is a fragmented front and back end, which means that the ability to adapt to new devices and new internet standards is often compromised. Especially if the company decides for the solution that comes with the lowest initial cost: Classic Responsive Design.
The downside with this is all changes need to be done manually. Additionally, the amount of maintenance to manually keep a fragmented front and back end future proof will by far exceed initial costs in the long run.
On the other side enhanced responsive design technology like web transcoders and API mashup layers can convert fragmented content to any new technology. This means that again the answer is enhanced responsive design with RESS even if the initial costs are higher (see table below).
Return on investment
Considering the return on investment for web projects, I recommend to not only keep operational costs at bay, but to expect even more maintenance cost that derive from the expectation gap that web users as well as website owners experience. The expectation gap consists of trying to implement new technologies that then fails to deliver what they promised.
For example, in 2013 many web developers prepared for Windows Phone 8 and Mobile IE 10, which then did not reach a relevant market share. Have a good look at your target group expectations and define extra costs that will fall into the expectation gap.
Calculating a one-web project
If you decided to re-launch your online and mobile web presence to update to a one web or omni-channel solution, the first question is:
What do I lose if I change nothing?
Never change a running system unless you are sure you lose conversion, brand awareness or customer loyalty. However, remember if your website needs more than three seconds to load, you do lose.
So if the decision is made, I recommend calculating costs for your responsive design re-launch in this pattern:
Cost = Initial cost + web project’s lifetime *(operational cost + expectation gap)
This equation of costs then should be run against a profit projection:
- What do I earn per month if my conversion raises one percent?
- What do I earn per month if my traffic raises one percent?
If you follow the performance first approach and employ all necessary RESS or enhanced responsive design technologies, you can expect to increase your conversion by 10-20%.
While this is fairly straightforward for online shops, brand websites have different KPIs. The main question here is how many bad user experiences can your brand handle before it loses customer loyalty?
My conclusion is that you should either do nothing at all or go for a future-proof RESS solution to keep your maintenance costs low, even if the initial costs are higher than with classic responsive web design.