What is responsive design? Mobile shopping and the future of ecommerce

Definition: Responsive design is a type of web design that ensures webpages are displayed with proper dimensions across a wide variety of devices, including smartphones, tablets, laptops, and desktops. As shoppers interact with brands across multiple devices, it's increasingly vital to ensure the experience is consistent with every touch point.

How Does Responsive Design Work?

A responsive website identifies the type of device being used to access it, then configures the site to match that display as closely as possible. This is usually done by creating a sort of 'grid' format, where content is put into boxes that can be easily rearranged into the most effective configuration for any given display.

The biggest issue in responsive design is orientation: desktop machines tend to have wide displays because that matches how the human eye works, but smartphones have vertical displays that drastically reduce the amount of information that can be effectively displayed.

Adaptive Design vs. Responsive Design

Adaptive design is a simpler version of responsive design, focused around having multiple specific, fixed-width layouts. For example, if a normal desktop has a 16:9 ratio, a site with adaptive design might also have 4:9 and 8:9 ratios to accommodate 'skinnier' devices. Unfortunately, small variations in devices can make adaptive design choppy and incomplete.

Responsive design, in contrast, always adjusts itself to fit the device it's being displayed on. This makes it more difficult for a site to have a 'wide' theme (as many websites were originally designed with), but it does mean that the website will look good on any device. Since the average American uses two or three different devices to access the internet — which will only increase over time — responsive design helps give a consistent experience to users.

Providing a frictionless shopping experience

Making it easy for shoppers to interact with your products on any device doesn't just increase the likelihood of one-off conversion — it can positively impact retention rates. All templates in the new Bigcommerce theme marketplace are fully responsive to give customers an unmitigated shopping experience.