247 Blinds offer a comprehensive range of blinds to the UK market, allowing consumers to customise the size and look to create a bespoke order that fits their requirements.
247 Blinds approached us to discuss expanding their site to include some European countries. While analysing their statistics we noticed that many users visit their current website using tablets or mobile phones. This sparked a discussion for making the new website responsive.
Responsive website design allows a website to adapt to different screen sizes and devices providing an optimal viewing experience. It takes into account not only screen size but also device and user input (whether that is using a mouse, keyboard or touch) to alter elements and functionality to provide the best browsing experience possible. This method of website design was first mentioned in 2010 by Ethan Marcotte but has only recently been considered the industry standard thanks to improved browser support for technologies that allow responsive web design to be possible.
The current bespoke web design has been very successful for 247 Blinds so we didn’t want to change the desktop experience if possible.
This was not our first responsive website, but was our first using an existing fixed width design to create a responsive experience. For brand new responsive websites we like to use a mobile first approach. The premise of mobile first is to build the website for a mobile device first, then layer styles and functionality on top of that for larger screens. This allows for a very lean website on smaller screen devices where bandwidth and internet speed can be more restrictive than on a desktop computer.
Unfortunately a mobile first approach wasn’t suitable for this project because we already had a very successful experience for desktop. We had to rethink our processes to cater for this. We decided to first take an audit of the website to consider all the important elements that made 247 Blinds so successful on the desktop. This allowed us to adapt the code to ensure that only the necessary scripts were running on different screen sizes and devices, provide a fast browsing experience. Our designers and frontend developers then worked closely with the team at 247 Blinds to produce responsive wireframes that allowed us to test the user experience across many devices with different screen resolutions and input methods (mouse, keyboard or touch).
Once we were all happy with the experience, ensuring it was both fast and user friendly we moved onto porting the styles across from the current website to create a unified experience that was on-brand.
247 Blinds launched their Magento e-commerce website for the French audience, Stores 247, with hopes of rolling the new responsive design across other sites in the future.
Visit www.stores247.fr on your smart phone, tablet and computer to see for yourself.