Three Ways to Prepare Your Site for Mobile
It has become a standard request from clients: "My site needs to work on mobile." Over the past year or two, we've seen amazing growth rates in the mobile market––between 200% and 300% accessing our clients' websites. So, it's understandable that folks want their site to work when someone visits from their smartphone or tablet. This article explains three approaches to prepping your site for the coming wave of mobile browsers.
Option 1: Standards Compliance
The browsers installed on most of the mobile devices these days are pretty good. They've been built to be "backwards compatible" in a sense. What this means for you is that, if you've had a site built that adheres to web standards, your site is probably not broken on these mobile browsers. We call this approach "mobile friendly" because the site is fully functional. It will require a viewer to zoom in and move around a lot. This can be frustrating for viewers, especially if they don't know right where their desired content is. Additionally, it sometimes makes it difficult to provide a clear path through your site given the fact that only small parts of your site are readable at any given time.
Option 2: Responsive Design
There has been a lot of buzz lately about responsive web design, and rightly so. It allows for a website to adapt to meet the size of the display on which it's being viewed. The beauty of this solution is that it's handled purely in the presentation layer of the site, so there's only one version of your site. There is no need to maintain multiple code lines. This is also one of the downsides––everything you show in a typical desktop version of your site will also be shown in the mobile versions. This can be tricky if you find that people visit your site on a mobile device only for very specific reasons. This technique is not overly difficult to implement, especially if you plan on it from the beginning of your site design, and the benefits of having a site tailored to the viewer's context are fairly obvious.
Option 3: Mobile Specific Site
This is the traditional technique and the one which most people consider first. It is also the most specific way to address the issue, as it is building a completely unique version of your site for a very specific segment of your visitors. This method requires some kind of code to determine when a user is visiting from a device you want to target. It also means you'll have multiple versions of your site out there to manage and maintain. However, there are some fairly elegant solutions which allow you to maintain your content in one place and keep both sites in sync.
In general, we believe that every site should at least fall into Option 1: Standards Compliance. If this doesn't meet the need of your organization, the next option to consider should be Option 2: Responsive Design. The simplicity with which this can be maintained makes it a great option for most sites. For the case where you find unique situations in which your site is being visited with a mobile device, it may be worthwhile to consider Option 3: Mobile Specific Site.
As a word of closing, the most important thing to think about in all of this is not the browser, but the viewer. We've found that much of the conversation about mobile design and development removes the viewer from the equation. The truth is, you have a website to communicate some message. Trying to focus on the most effective ways to communicate that message to your viewers might be helpful in making these kinds of decisions.