Responsive design > mobile sites

There are individuals and companies who still believe it would be in their best interest to maintain a 'desktop' version of their website, and a completely or mostly-separate 'mobile' version of their site, and this belief (especially in the corporate arena) was strengthened by a recent (2012) report by the Nielsen Norman Group, Mobile Site vs. Full Site, which recommended a separate mobile site with stripped-down features and different design. The idea of having a mobile-optimized design is good—but not with the cost of making it a stripped-down version of your 'full' site, as Nielsen seems to recommend.

Mobile PNC Website

There are many problems with having separate versions of the website, especially as we near a point where many sites are accessed more on mobile devices (tablets, smartphones), and less on traditional desktop computers:

  • Mobile is not Mobile: Many tablets and very-large-screened smartphones are grouped in with other 'mobile' devices, and served an embarrassingly-broken design if you redirect them to a mobile version of your site. Additionally, if you assume that mobile users are out and about and are always in a hurry, so don't care that they're not getting your full site, you're wrong—most smartphone and tablet users spend more time browsing the web on their 'mobile' devices while at home than on their old PCs.
  • Mobile users want everything: The biggest gripe smartphone and tablet users have (and the reason they'll leave your site in an instant) is that your site doesn't let them do what they wanted to do, and know they could've done on your desktop site. They don't only want to search your company's locations and read your blog—they want to do everything they can do on their desktops. Don't just hide half (or more!) of your site's content from half your user base—there's no excuse.
  • You will be penalized: Unless your mobile site is a 1:1 content match for your desktop site, Google is going to start penalizing you in search results. It's easier to maintain a responsive design than to ensure that you have two entire websites running with the exact same content and URL structure*.
  • 'Mobile' is the future: Almost every site that has a separate 'mobile' version treats that version as the outcast. Redesigns are done to the desktop version of the site, and much later to the mobile version—if ever. If you're ignoring the entire smartphone/tablet market in your design, you're ignoring an ever-increasing audience, and your site will be irrelevant in a few years. Especially if your site is a retail site, you lose if you don't consider your mobile device users as first-class citizens.

It's time to consider mobile-first design: focus on what the user wants, not on what marketing thinks looks pretty on their old desktop PCs. Focus on the content, and the simplicity of your site's user experience, not on how many JS widgets and massive navigation structures you can fit on one page.

Scale up your design so it flows differently for desktop browsers. And realize that there aren't only a few screen resolutions. Not only are there iPhones, iPads, and 1080p desktop displays—there are thousands of resolutions in-between.

*This may be debatable, but the fact is, if you have a content-first design approach and optimize for mobile platforms first (every developer should have a couple mobile devices to test with), the maintenance cost of a responsive design will be much lower (especially when it comes time for major redesigns) than two separate sites.

Comments

The irony of this site not being designed mobile-first is not lost on me; I just haven't had time for a redesign since 2008. Someday...

Luckily I migrated this post to a responsive site :D

Just add drupal responsive bartik as your theme...and there you have nice responsive theme. I have it on my 40 sites...