Asking “How much does a responsive web design cost” and expecting a cut-and-dry, prescriptive answer just ain’t happening. Brian Hoff (@behoff) handily explains why in his article What Does a Website Cost?
Imagine asking a Real Estate company, “How much does a house cost?” Well it depends. First off, what are the essentials you need? Three bedrooms because you have two kids? Central air conditioning because you live down south? Now that we have the essentials, what are some of the less essential, yet nice features? Basement? Extra storage? Large backyard? Three car garage? What if you could have it your way? How about a pool? Sounds nice right?
The fact is that responsive web design costs more…than doing nothing. Sure, you could continue building sites the old fashioned way and ignore the multitude of web-enabled devicesaccessing the web now and in the future. But this is 2012. At the very least a web experience should have at least some mobile consideration, and at the very most a site should be full-on mobile optimized.
I’ve seen a project that didn’t take mobile into consideration at its inception, and about 80% through the design process the client asked “How will this work on an iPad?” And everybody freaked out. Schedules got rearranged. Budgets increased. And ultimately a desktop-only design was shoehorned onto mobile devices.
The moral of the story is that right out of the gate it’s much better to account for today’s plethora of devices, and also acknowledge the unpredictability of the future.
responsive site or dedicated experience?
While this topic has almost been beaten to death by now, there are some budget-related considerations when determining how to approach a mobile web project. Is responsive web design cheaper than building a dedicated mobile site? In my experience there hasn’t been a significant difference between the two. But then again, I can’t say my experience with both approaches is really apples-to-apples.
But while a dedicated mobile site budget might be comprable to a responsive budget initially, a separate site incurs several ongoing costs that responsive solutions don’t. First, the fact that multiple versions of the same site exist means that some maintenance redundancy. I’ve worked on sites where we handled the mobile site and another agency handled the desktop site. The amount of coordination, planning and communication required just to update both sites can get expensive.
Secondly, device databases which route users to the appropriate experience need updated (which in my experience never happens). Ongoing device maintenance becomes a challenge, especially sorting out the gray area of small tablets/large phones like the Galaxy Note. What site do they get: the mobile or desktop site? This is just one more thing to worry about.
I’m not saying that going down the responsive road is all peaches and cream, but the idea is that once the foundation is set, the ongoing maintenance costs decrease over time, while dedicated sites have several additional reoccurring costs.
budget considerations for responsive web design projects
So how can you effectively budget for a responsive design project? Here’s a few considerations:
- Discovery & Client/Team Education—build in time to get everyone up to speed. Make sure everyone understands what responsive design is, and more importantly why it’s important. Take time to get a lay of the land, see what trends are emerging, and then discuss how you’d like to proceed.
- Build in time for process change—This is possibly the most significant budgetary consideration. Many people are used to a waterfall-esque process (and project planners absolutely love gantt charts), but responsive design quickly demonstrates how cut-and-dry linear processes don’t hack it in this multi-screen world. Close collaboration is absolutely essential for a successful responsive project, so make sure to build in time for collaboration, innovation and iteration. Iteration is especially important, considering the fact that the more technical folks have to guide the less technical folks through the process. “How will this navigation work?” “How will this reflow on larger screens?” etc. Give the entire team time to sort through undeniably tricky design problems.
- More Testing/QA Time—Remember when you had to account for just a handful of desktop browsers? That isn’t the world we’re living in anymore, so make sure to build in much more testing and QA time into your responsive budget. “What devices do we support?” That’s tricky as there are lots of factors to consider deciding what to optimize for, but this is important: there is a difference between “support” and “optimization”. Many contracts require specifying specific browser/platform versions, and it’s unfeasible to optimize for every device on the planet. But while budgets are limited, it’s important for the team to come up with inclusive, forward-thinking solutions instead of putting blinders on and only paying attention to today’s landscape.
- Purchasing Devices—It’s essential to test your project on real devices, and that means investing in some test devices. Device investments in may vary from project to project, but hopefully you can get a representative smattering of devices on a budget.
- Understand channel strategy— Project planners are typically used to chunking things out into “streams”, and I’ve seen several project plans that launch a desktop version, then subsequently mobile and eventually tablet versions. That’s not really how responsive design works. The team need to address all channels up front as one “stream” influences the rest of the design. This is important even if you are making a dedicated mobile site that utilizes responsive techniques.
These are just some considerations for planning a responsive project. There are plenty more. Feel free to share yours.