Responsive Web Design: More than Just Visual Calisthenics

By Cory York | | Tagged eCommerce Resources

In one of our recent blog posts, we talked about how 2013 was the “Year of the Mobile”, how 2014 will see even more growth in mobile commerce, and how important it is to put mobile at the centre of your ecommerce strategy. The sources cited in that blog post show that the number of mobile users and shoppers is going through the roof.  Indians especially are shopping madly using their mobiles, and those that aren’t, want to, while those that are already buying want to buy even more often. So what does this mean for you? The first step towards having a mobile strategy is to build a responsive website.

Responsive web design is fluidity.

The heart of your business is your website, and the first thing to do is to ensure that your website works well across screen sizes – from smartphone to tablet to laptop or desktop. This is what is meant by having a website with “responsive design”. An important part of responsive design is the visual adaptation, or “flow”, of elements to different screen sizes and formats. The illustration below shows how mere resizing of the screen is not the best solution, but that each block of the layout needs to be handled differently.

Example of Responsive DesignSo if you already have website, try viewing it on different devices – a laptop, a tablet, and a phone. With the handhelds, turn the device around so you can see the site in landscape as well as portrait formats. Is the text readable in all the devices? On smaller screen devices, is the visual area dominating the screen? If the answer is no to any of these questions, your web site is not responsive.

Responsive web design is usability.

Mobile web design has several demands that are unique to handheld devices. The user’s attention span is shorter and hence he wants to get things done fast. Page downloads have to be fast, and importantly, navigation has to be easy. Drop-down menus don’t work well with finger taps. Adjacent links get tapped by mistake if they are too close. And checkouts have to be done in as few steps as possible. That is why handheld devices need site designs that are customized for them. Shoppers today often start a search on one device and complete the transaction on another. It could be either way – large screen to small or vice versa. A responsive website would allow a visitor to move seamlessly between devices, retaining his search history, saved carts, and preferences, and having continuity in look and feel as well as navigation structure.

Responsive web design is engineering.

The big swing towards mobile has created a new wave of website builders and designers who either create new responsive websites or take an existing one and make it responsive. That can be quite a challenge, and a smarter option is to build a new website on an ecommerce platform that is engineered to deliver responsive themes. The newer platforms are slightly ahead of the curve in seeing the mobile trend coming, and have excellent themes that are brilliant on mobile as well as desktop. Once you have adopted responsive design, you can create a marketing strategy that enables you to grab your share of the mcommerce pie. The question is whether or not you will advance with technology or choose to be left behind in this mobile revolution.