Responsive design drives the future of mobile

Chances are, you’re reading this blog on your mobile device. That means you’re in good company.

Today information is mobile, and we have to design with that in mind. According to Google, almost half of all mobile users say they feel frustrated and annoyed when they visit a site that’s not mobile-friendly. And the mobile open-rate on emails is up 138% in the last 18 months.

Which brings us to the pivotal questions. How can you design effective email and landing page communications with so many different devices? And what will drive the future of mobile design?

The answers can be found in two words: responsive design.

In technical terms, responsive design determines the type of device your user has, and then adjusts your website or email to deliver the appropriate user experience. That’s a game changer, and the key takeaway here is that responsive design delivers your message on your target’s terms and ensures a great experience on every screen. Which means you build a responsive-design email or landing page once and it will work seamlessly across all devices.

Clearly, mobile has evolved the way we think about designing for user interaction. And while the basic principles of good design remain the same, we must consider a whole new approach to the best practices for A mobile audience. To get a clearer picture of the mobile paradigm shift, let’s examine some proven best practices for mobile-optimized emails and landing pages.

15 mobile design best practices to ensure optimal user experience and response:

1. Design grids are fluid and conform to a single cascading column for the mobile experience.
2. Use buttons as touch targets large enough to tap comfortably and no smaller than 44 pixels x 44 pixels. In addition, buttons should also have extra “padding” with at least 10-pixel margins around their exterior to ensure a touch-friendly experience.
3. Forms and other elements should be large enough to interact with—without fear of accidentally tapping or swiping an adjacent element.
4. Create images that complement the content, but use them sparingly to aid performance.
5. Utilize white space to enhance readability and increase usability.
6. Write compelling headlines that are concise and, if possible, contained to two lines. This will keep primary content from being pushed down.
7. Utilize standard call-to-action text links throughout content to increase response.
8. Use icons. Icons are a great general design practice, but they can also be used as links to primary content or visual helpers to create a more user-friendly interface.
9. Use a default size for fonts of at least 14 pixels because readability is key.
10. Utilize basic design standards like color and rules to help divide important content into legible segments that allow for a quick read and easy response.
11. Use accordion design functionality to break up heavy content and help with self-selection.
12. Multiple call-to-action buttons and links should be strategically placed throughout the content to allow the user to respond easily.
13. Personalization is a key component that leads to a more relevant customer experience and helps build a stronger customer relationship.
14. Maintain a seamless experience from mobile-optimized emails to landing pages. This integration ensures the user knows immediately they are in the right place to learn more or complete a transaction.
15. Make sure all relevant information is displayed with response in mind. You want to provide your target with the impetus they need to take action and increase transactions.

The impact of good design functionality is even more important in mobile since mobile devices can present a much smaller area to display creative compared to traditional desktop computers. It is essential to balance design with the realities of what can be executed well on mobile devices. Therefore, smart developers are just as integral as strong designers to the success of any mobile execution.

Above all, remember that mobile is read on the go, a click can now be a tap and performance is key.

*Google mobile ads blog; Tuesday, September 25, 2012