The new, big trend in the world of web design is using responsive design. Many of the major sites you visit have already made the leap (Mashable, Starbucks, Grey Goose and TIME magazine just to name a few).
Should you think about updating your site to using responsive design? Let’s weigh the pros and cons.
What is Responsive Web Design?
According to Stanford University, responsive web design can be defined as, “A website that responds to the device that accesses it and delivers the appropriate output for it uses responsive design. Rather than designing multiple sites for different-sized devices, this approach uses one site but specifies how it should appear on varied devices.”
In other words, you build a responsive web site in such a way that it can render nicely on any type of device: desktop, tablet, phone, e-reader and so on. Any sized device will load the site with the same look and feel.
What are the Pros of Responsive Web Design?
The most obvious pro to responsive web design is that you no longer need to hire a web developer and designer to create mobile specific websites or apps. You would simply hire a developer/designer one time to create a site that is responsive and use allow mobile and non-mobile traffic to access it in the same way. This is the same as hiring a firm for your logo development as well as your branding.
According to a case study on Mobile Commerce Daily, a site called ShopWiki “reports that mobile click-through rates increased by 24 percent in the United States after a responsive site was launched.”
Additionally, the general manager for ShopWiki is quoted as saying, “Responsive makes sense for us since such a significant percentage of our visits are from smartphones. Mobile responsive Web will format the content to smartphones so that users can better see and engage with the content. We also feature the content that is most important to a shopper when they are on the move.”
Another really big benefit of responsive web design comes in the form of SEO. Because you only have one site instead of your main website plus a mobile site or sites, you only have to do link building for one domain.
What are the Cons of Responsive Web Design?
Perhaps the biggest con to responsive web design is having to drop some design elements on the landing page design due to their inability to render well (or at all) on a mobile device. Some usability professionals might argue that this is actually a blessing in disguise since large images, flash and other non-mobile friendly elements often have a negative effect on websites even when they are viewed in almost ideal environments.
Another challenge of responsive web design comes in the form of deciding how to show navigation. On desktops and tablets with large screens like the iPad, you have a lot of screen real estate to work with whereas a mobile phone tends to have a much smaller screen.
The best way to handle this is likely to show full navigation on devices with larger screens and then using a single icon that loads navigation options over the top of content on mobile devices.
Examples of Websites Using Responsive Web Design
There are a variety of sites that use Responsible Web Design well already. Here’s a short list of a few that I really like:
Be sure to view each for yourself on different devices (laptop, tablet, phone) to experience responsive design for yourself! The screen size, browser window and the screen dimension are all important considerations when you are building flexible grids. Using responsive images – both for desktop and mobile version.