Smythson turns to responsive web design for rendering on desktops, tablets and smartphones.

Every day more consumers purchase more smartphones and tablets, contributing to a world where mobile is becoming a major force in accessing the Internet. “The Year of Mobile” is long past—mobile commerce is mainstream, and retailers today have no choice but to address the growing percentage of shoppers coming to them via mobile devices.

The most common way to address mobile consumers is to build an m-commerce site, then perhaps a mobile app, and finally to optimize an existing e-commerce site for use on tablets or create a tablet app. U.K. luxury goods retailer Smythson, however, decided to try an up-and-coming technique—responsive web design. Now, with one site, it delivers a web site experience tailor-made for any device.

Smythson just launched its redesigned commerce site in conjunction with the company’s 125th anniversary and the re-launch of its flagship store.

“Our primary goal was to provide the very best user experience and to ensure that this was delivered consistently across all devices,” says CEO Andy Janowski. “We approach our digital experiences with a vision to the future, rather than the present day. In this vein, we embraced responsive web design rather than build a separate m-commerce site because responsive web design adapts to all devices from mobiles to tablets and desktops while delivering operational and cost efficiencies and presenting an opportunity to pioneer innovation in the e-commerce space.”

Responsive web design typically uses a grid scheme whereby elements of a page can be shifted around from left to right or top to bottom so that the size of content does not have to be diminished to be displayed on a device.  For example, a three-column page on a desktop screen could become a longer two-column page or a wider one-column page on a tablet screen, requiring a consumer only to swipe from top to bottom or left to right to see all of the page’s content. Or that three-column desktop page could become a longer one-column page on a smartphone screen, requiring a consumer to swipe top to bottom to see everything on the page. One way or another, the design scheme dynamically shifts elements within the grid to appropriate spaces on the newly aligned page.

advertisement

“Responsive web design is more than just coding, it is a process of designing and building a site taking into consideration the device the user may be viewing your site from, how fast an Internet connection they are accessing the site from, and what information is important to them,” Janowski says. “First we designed for users on mobile devices as they had the greatest restrictions in terms of screen space, input methods and Internet connectivity. As we moved to devices such as tablets and desktops, which have larger screen space and generally better Internet connections, we were able to adapt the layout to make use of the extra space available and provide styling enhancements.”

Compared to a site solely designed for a desktop computer, a responsive web design site requires more coding and development effort, Janowski says. “But you are providing a single site where the layout responds to the device the user is accessing the site from to provide a more usable experience for the consumer regardless of the device used,” he says.

Smythson worked with its platform provider Magento Inc. to build the responsive web design site.

Favorite

advertisement