How to Build a Multi-Platform Website
Q: Can I build a single website that works on a computer, a tablet and a smartphone?
A: For the most part, yes. And with your customers increasingly viewing your website from a number of mobile devices (iOS, Android) and on various browsers (Google Chrome, Internet Explorer, Mozilla Firefox), it's an important goal to achieve. In geek-speak, this goal is possible through "responsive web design," meaning web design for multiple devices.
Jonathan Smiley, partner and design lead at Silicon Valley product design firm Zurb, says responsive web design cuts down on development time and can open up your content to a broader array of users. We asked him for the lowdown.
Do business owners really need to care about responsive web design?
It's here now, it's not going away, and it's much easier for you to convert your web presence now, while the number of devices is relatively small, than get into it in a few years. Mobile devices are absolutely the future, and everyone needs to be ready for it.
How does responsive design compare, cost-wise, to traditional web design?
If you count your cost in time, responsive design is a little more expensive. If you count your cost in customers, it's much, much cheaper. Responsive design lets you automatically approach customers from all kinds of places, on all kinds of devices. If you target, say, the desktop user only, you'll be targeting less than 50 percent of potential customers by the middle of next year. You spend a little more upfront in order to make a lot more later.
How much more effort is involved with responsive design?
It will always take just a little more thought and a little more time to think about how a design will function across multiple formats and devices. However, using responsive web design to build one multipurpose site is much faster than building sites specific to a number of different devices.
What are some design challenges?
It's difficult to create a single website design that works for every device out there. There'll be a degree of tweaking and iterations to work through before you create a great experience. For example, the landscape-size photo you use on the website might need to be swapped out with a square image that's suitable for a smartphone. Or you'll want to replace the word "download" on a button with "learn more," because mobile users won't usually click on a download. Another: putting your website's main subject categories (Home, Contact, etc.) across the top of your site works when viewed on a computer's web browser, but not on a smartphone screen, where a vertical list is easier to read.
So while responsive design is faster than developing numerous different sites, it's still not going to be plug-and-play. This is why it takes longer to do than a single website.