Responsive Design
Responsive Design is a technique where a website’s layout and elements automatically shrink, stack, and expand to fit the space they’re in, all through the HTML/CSS. Once the upfront effort of defining breakpoints and handling navigation is complete, responsive design is very low-maintenance. Responsive Design works best for sites whose contents are relatively simple and consistent. Tabular data, dynamic infographics, data visualization, and complex user interfaces can be problematic, however, and if your site has lots of rich media or special features, it can be difficult translate them to small screens with responsive design alone.
Responsive Design offers a great way to give a relatively customized user experience while maintaining the same back-end code base. It offers an experience that’s specifically formatted for, and can be slightly customized for, mobile devices, while making long-term maintenace easy, since there’s only one back-end to maintain.
Mobile Websites
When Responsive doesn’t cut it, a completely different version of a web page can be served to mobile devices. For example, you may have a very graphic-heavy, media rich page that works well on a desktop, but takes forever to load on a phone or just isn’t readable on a small screen. By creating a mobile-specific site, you can deliver a more streamlined version that loads faster and is easier to digest for someone on the go.
Mobile-specific sites are a great way to create a fully customized experience to mobile audiences, because you can modify features and functionlity along with your HTML/CSS to deliver exactly what you want. The main downside is cost—both in initial development, and ongoing maintenance of a separate back-end.
Hybrid Apps
Development tools like PhoneGap and Titanium allow programmers to package up web content and treat it like an app. Why would you want to do such a thing? Well, the most common reason is that apps are available offline, allowing your audience to browse content even when they have no internet connection. If some of your content is exclusive and you want to charge for it, or even if you just want the marketing benefit of having a presence in the iTunes store, a hybrid app may be a good choice.
On the downside, a hybrid app won’t operate as efficiently as a native one, and in many ways will still feel like a browser experience when the user may be expecting something that feels more like their mobile device’s native controls. Since it’s effectively a website masquerading as an app, you won’t be able to make direct use of the hardware, like the camera. So if you feel you absolutely need a dedicated mobile app, a hybrid approach offers you some of the benefits, with lower costs.
Native Apps
Where hybrid apps have a wrapper sandwiched between the content and operating system, native apps run directly on the OS. This makes them faster and more efficient, and generally creates a more seamless experience for the user. Native apps offer the greatest potential for device interactivity, such as interfacing directly with GPS and SMS functions, as well as pre-installed apps like the address book, calendar, music player, and so on.From a mobile perspective, in many ways, the holy grail. Everything you’d like a mobile experience to be for your audience, leveraging all the built-in technologies devices have to offer. From a cost perspective, potentially the least efficient approach if your interactive strategy also includes a separate site.
Still not sure what the right parth for you is? Every situation is different, and there are plenty of other factors and nuances to work through. I’ve created the decision tree below to help you think through the basics. Of course, at some point, it makes sense to speak with an experienced design & development partner to help you weigh the pros and cons of each approach.
