Responsive Design

Responsive Web DesignThe era of mobile digital technology has crossed a new threshold in both business and personal use. As technology and design continue to evolve, the shift to mobile is happening at great speed. For the first time since 2001, PC sales are projected to be lower than they were in the previous year, while tablets are expected to exceed 100 million this year – industry analysts predict that more than 800 million tablets will be sold by 2015. Their sales numbers may top notebooks next year, according to some industry experts. Smartphones also continue to be popular. According to Nielsen, as of February 2012, almost half of U.S. mobile subscribers own smartphones, an increase of 38 percent over February 2011.

As the demand for tablets rise, so does the demand to consume mobile content. According to a report by analyst Mary Meeker, “the worldwide number of smartphone and tablet users should overtake the worldwide number of PC users next year. That means around the world, more people’s experience of ‘computing’ and internet technology will come from mobile devices than via traditional desktop or notebook PCs. If forecasts bear out, this shift will not only continue, but accelerate.”

Based on data from Morgan Stanley and a few assumptions about device lifetime, Meeker estimates roughly 2.9 billion people around the world will be using smartphones and tablets by 2015.

The changing landscape of web browsers means that users’ expectations are also changing. People expect to be able to browse the web on their phones just as easily as they browse the web on a desktop computer. In response, the web design world has created responsive web design (RWD), a design approach aimed at building websites that provide an optimal viewing experience across a wide variety of screen sizes. This approach focuses on easy reading and navigation with a minimal amount of resizing, panning and scrolling.

Responsive websites offer customers a consistent look and feel across their various devices – from desktops to mobile phones. For publishers, RWD offers a way to reach readers across multiple devices. For users, it ensures a great experience on any screen.
Responsive sites can detect the type of device and screen size then present content laid out specifically for that device’s screen dimensions. How? In simple terms, a responsive web design uses “media queries” to figure out what resolution of device it’s being served on. Flexible images and fluid grids then size correctly to fit the screen. If you’re viewing an article on a responsive desktop browser, for example, try making the browser window smaller. You will see that the images and content column will shrink, and then the sidebar will disappear.

Mobile responsive design is said to be the future of the web. As web designers continue to design for a greater number of devices, input modes and browsers than ever before, incorporating responsive web design will require a more abstract way of thinking about design.

From the business side, one of the greatest benefits offered by responsive website design is the versatility and ease it provides, not to mention the cost saving. Designing one site that works across the technology spectrum is advantageous because you want to deliver to your audience the content they want within the context they’re viewing it, without forcing them to adapt themselves. This provides every business an online strategy that can reach and retain a broader market of consumers without having the added expense of creating separate websites and apps.

As Ethan Marcotte, creator of responsive web design and the author of Responsive Web Design, said, “Now more than ever, we’re designing work meant to be viewed along a gradient of different experiences. Responsive web design offers us a way forward, finally allowing us to ‘design for the ebb and flow of things.’”