Responsive Website Design and Development Best Practices Webinar Recap

If you missed our recent webinar in partnership with Acquia on Best Practices for Creating Responsive Websites, no need to worry. We've summarized the key takeaways below and you can view the recording at the end of this post.

The promise of a responsive design is a single website that works beautifully on desktops, tables and phones, but the complexity of large-scale, content-rich sites packed with vital information can create challenges in communicating key messages effectively. Despite the challenges, a responsive design has proven itself a better alternative than a separate mobile website for addressing the explosion of web traffic from mobile devices due in large part to its allowing for content to be managed for every screen size through one code base.

Designing for multiple devices has become a hot topic as mobile traffic has grown significantly year over year. Analytics for a client website showed an increase in mobile traffic from 8% in 2012 to 18% in 2013. In fact, the number of mobile visits to this client’s website exceeded the number of visitors using popular desktop browsers which means ignoring mobile is like ignoring a major desktop browser.

While marketers recognize the importance of a responsive design, they may be less sure of what it takes to build this type of site. Understanding how media queries, breakpoints and grids factor into the design is key. In addition, there are three considerations that should be top of mind – Research, Usability/User Experience Design and Content, and Brand.

Research

Conducting research will help you understand your audience and the different use cases for various devices. For instance, a desktop or tablet user will likely be interacting with your website in a different manner than a mobile user. Recognizing these differences will inform your site design and highlight an information architecture that will accommodate all of your visitors.

Usability/User Experience Design and Content

Optimizing the user experience with a responsive design for a complex website requires more than a cookie-cutter solution that doesn’t allow total control. You’ll want to think ask about how your site is presented across devices and ask yourself some questions.

• Is your navigation easy to use and does it allow users to find what they are looking for?

• Do your calls-to-action stand out on your site’s various sizes?

• Do your copy, photography, and video tell your audience who you are effectively?

• Are you incorporating interactive experiences to keep your audience on your site on any device?

Brand

Ultimately, your website is a reflection of your brand so ensuring clear communication across various screen sizes of who you are and what defines you is an important part of a responsive design. Having a well-defined messaging platform and visual strategy from the outset will help you make decisions about how your site layout shifts and which information should feature most prominently as screen real estate decreases.

Responsive design is fast becoming the standard website implementation in response to mobile. As you make your way through the design process, rely on your research, consider the user experience from every angle, think about your content, and most importantly test before and after you launch to site that helps you successfully reach your business goals.