Responsive web design is a new website design approach that allows web experiences to be tailored to all sorts of devices. That means that the same website will automatically rearrange its elements to better fit the screen of a mobile phone, a tablet, a laptop or desktop computer. We’ve previously written about why responsive design is important for your mobile experience.
Websites using only responsive web design sometimes face the challenge of longer load times; because information for all types of devices (e.g., desktop, phone, tablet) is included in the downloaded information, it can actually take longer to load than just a regular desktop site would on its own.
The Evolution of Responsive Web Design
There is a better solution to the performance challenge – server side components have been used to detect the client device and optimize the data to be specific to that device. This technology is known as RESS (Responsive Design + Server Side Components) or adaptive design. It enables websites to deliver the best possible user experience to the widest possible audience by leveraging server-side capabilities.
The experience can be adapted based on detecting a device’s screen size, resolution, or type. In addition to different layouts and navigation, since the server is doing the processing, the actual content delivered to each type of device could be completely different. For example, instead of sending a high-resolution image to a phone that would be better-suited for a desktop website, the server could send a smaller, lower-resolution image. The content delivered for a smartphone could be different than that delivered for a desktop website. This greatly improves the performance and end-user experience.
Combining Responsive Web Design with Adaptive Web Design
Responsive design combined with adaptive design is the ideal solution because it combines the strengths of responsive design (a greatly customized experience), and adaptive design (faster download and performance). For mobile users, the ability to quickly browse, shop and buy is absolutely critical. As Amazon discovered some time ago, every 100 milliseconds of website latency cost them 1% in sales. Unfortunately the homepages of the top 500 retail websites on average take 7.72 seconds to load, an increase of 13.7% since the spring of 2012. As major retailers start to realize the advantage of responsive and adaptive web design, they will improve their performance and drive higher sales.
The Story of Skinny Ties – A Responsive Web Site
In 1997, Skinny Ties was one of the first traditional retailers that took advantage of the internet. As the web evolved, Skinny Ties built a standard e-commerce site and, like most retail sites, noticed that mobile traffic was increasing. In 2012, Skinny Ties took the bold decision to implement a responsive web design to maximize the site’s appeal for mobile users. Skinny Ties measured performance of the same periods before and after implementing a responsive web design and discovered that their number of transactions grew 57%, units sold increased 78%, and average order value rose 21%. Here are a few more details:
- eCommerce sales through desktop and laptop computers increased 77%
- Sales via smartphones and tablets was up 211%
- Android revenue jumped 187%
- iPad sales were up 224%
- iPhone revenue was up 473%
Clearly, improving the user experience and visual appeal of the site paid off very well.
Many other websites are having similar successful experiences. Other noteworthy responsive design websites include Indochino, Tommy Hilfiger, Time Magazine and the Boston Globe.
The Next Step – Responsive, Adaptive and Multi-channel
Big brands have clearly started to use responsive design to improve their website experience. The next step will be for them to apply adaptive design and server capabilities to significantly improve performance and deliver a more customized user experience based on the user’s device. In addition, websites that had separate desktop and mobile experiences will need to streamline their websites to cater to the increasing number of users that are engaging via a multi-channel world.
Closing Thoughts
The architecture of a successful eCommerce website is changing with the increasing variety of mobile devices that visitors are using to access the internet. Smartphones and tablets are the current set of devices, but expect gaming consoles, Smart TVs, set-top boxes and connected cars to add to the challenges of mobile. Traditional eCommerce systems will continue to manage the core components including the product catalog, offers, pricing and checkout. However, they will cede the presentation layer to newer technology platforms that can provide responsive and adaptive capabilities to optimize the user experience for mobile. In achieving this new architecture, those eCommerce systems that have open architectures, clean APIs and clear documentation will rapidly overtake their competition.
Connect with Mark on LinkedIn.
