Yesterday I wrote a post showing how companies’ mobile-optimized websites are generally better than their desktop websites when viewed from a desktop browser. It’s a somewhat dramatic conclusion to make given that companies usually have a comparatively rag-tag team focused on mobile-optimized design (all the mobile efforts typically get aimed towards App design instead of mobile-optimized design) in comparison to the richer and more established desktop design efforts. Why would the output of an afterthought team be better for a desktop than the hard-earned, constantly-A-B-tested, decade-long-work-of-love from the desktop web design team? I think there’s a few reasons:
- Constraints are good. When you’re designing for less screen real-estate, you are forced to make tough choices. For example, you can’t decorate the right rail of a webpage with 20 junk-drawer menu links on mobile because there isn’t enough screen real estate for a right rail at all. When you’re forced to for 25% of the space, you are forced to decide what *really* matters.
- The mobile mindset is get in and get out. It’s not assumed that a mobile web session is going to be the start of a 30-minute rabbit hole of discovery. Instead, people landing on a mobile-optimized site are likely coming from Google and just need what’s on the permalink being called. A good mobile-optimized site serves this relevant information and very little else.
- Less ads. You can’t put 15 different banners interlaced in a poorly executed game of tetris above the fold when you’re designing for mobile because no one will ever trust your domain when they’re browsing from a mobile phone again. Less screen real estate corresponds to less intrusive ads.
- Whitespace. When you take a mobile-optimized site and you view it on a desktop, the various elements of the page scale up proportionally, including the whitespace. Whitespace is an absolutely essential design tool; the more of it you use, the more you can focus your user’s attention on what matters. If you want a button to grab your user’s attention, surrounding it with ample whitespace is your best tool. So, not only are their less competing design elements on the page in a mobile-optimized site, but the ones that did make the cut get a healthy dose of whitespace to amplify them when rendered on a desktop.
That’s my hit list. Add what I missed in the comments.