Luxury Website Design: Instantly Recognisable Design at Selfridges

Whether they create bespoke jewellery, clothing or holiday experiences, luxury brands need a standout website to present their high-end products. Creating an online platform that evokes the same sense of opulence and quality as an in-store experience is essential for digital sales success. Our Luxury Website Design series reviews the online platforms of some of the biggest names in retail to bring luxury web design ideas to you.

When thinking about your site design, take a look at the brands you aspire to for some inspiration. So far, our series has uncovered the best and worst luxury web design ideas from brands including Gucci, Nike, Harrods and Mulberry. There are takeaways for every industry, audience and product. Go ahead and explore the articles to see what could work for your site. This week we look at Selfridges’ website for some fresh luxury web design ideas.

If something catches your eye and you want more information on how to incorporate it into your website, drop the KIJO team a message. We are a web design agency that specialises in building bespoke online platforms for unique brands in London and the UK. We can work with you to create the perfect website for your business.  

Luxury Website Design Ideas from Selfridges

• Multiple interactive features, including ‘Read and Shop’ pages for new launches. 
• An interactive and personalised app experience. 
• Unusual navigation features.
• Bold, clean and consistent visual design.
• A mobile website in line with app performance.
• Excellent retail integration linking in-store and online services. 

Selfridges: Bringing American Retail Theatrics to the UK

Selfridges’ charismatic founder, Harry Gordon Selfridge, came to London from Chicago in 1906. Within 3 years Mr Selfridge fulfilled his ambition to create his dream store, he opened the doors to his London store in 1909. For the past century, Selfridges’ stores have continued to deliver imaginative and creative shopping experiences.

Combining retail and theatrics, Selfridges is renowned for innovative window displays and unusual in-store events. Impressively, Selfridges is the only store to win the Best Department Store in the Word accolade four times! With such impressive credentials, we took a detailed look at their website to see if it befits their international reputation.

Multiple Interactive Features: Special Features Rating 4.5/5

Launching New Lines with ‘Read and Shop’ Feature Pages

Selfridges accompany the release of a new seasonal collection, product launch or in-store addition, with an in-depth ‘Read and Shop’ online feature page. The pages include quotes, photography, links to products and videos to create the perfect visual cocktail that continually sparks the reader’s attention. Each page also includes detailed explanations highlighting the expertise and complexity involved in the creation of the collection. These features are an opportunity for customers to learn more about products and the inspiration behind them and are a chance for creators to reinforce why their products are worth the investment.  

Similar to Harrods’ Stories, ‘Read and Shop’ pages help to position Selfridges in various niche markets, from the clothing rental revolution to exclusive celebrity-endorsed product launches. Long-form pieces work wonders for search engine rankings, especially for targeted searches of specific topics. While the Selfridges site as a whole may not rank highly for Kim Kardashian’s new shapewear line, the dedicated ‘Read and Shop’ page will. The pages include lots of links, both internal and external, images, and plenty of text to increase keyword density. This is a great way to drive traffic to your website with targeted SEO, a content marketing agency can help you incorporate this into your marketing strategy. 

Detailed content, such as these long reads, display the brands as an authority on all things fashion, boosting their reputation. It raises Selfridges profile, cements their opinion as trusted and valued and extends their site beyond just eCommerce. 

A Faultless Interactive and Personalised App

The Selfridges App similarly positions the ‘Read and Shop’ features front and centre. There is an interactive carousel, linking to all the latest feature pages, that is both easy to use and visually appealing.

The ‘New in for you’ section is a luxury feature that immediately creates a personalised experience. It presents users with a stack of product images to either swipe left and discard or swipe right to save. The Tinder-style user experience is personal, interactive and familiar for younger users. It immediately engages the user and simultaneously gathers valuable customer data on style preferences. Every item that you swipe right is saved to your Wishlist. This feature could be implemented by many brands as a way to quickly expose users to lots of options and gain instant feedback. 

The product pages are clean, crisp and beautifully designed. There’s a sense of space even on a smaller screen with only 2 product images per row. Product name and price appear underneath in the brand’s signature font and a simple heart icon lets you quickly add anything to your wish list. A yellow banner highlights products that are exclusive to Selfridges, just launched, personalisable, new season or limited release. This adds visual interest to the screen and makes it easy for the user to recognise the most premium products.

App and Social Integration

Selfridges’ web designer seamlessly incorporate the brand’s Instagram highlights on the app’s home screen. Integrating the two platforms makes for a smoother user experience as you can quickly transition between the two. It also highlights Selfridges’ striking images that set them apart from high-street brands. Cross-platform integration is a great way to boost your social media following and make further use of the quality content you’ve produced. 

Unusual Features and Expert Opinions: User Experience Rating 4/5

A feature we haven’t seen before are images in the navigation bar linking to the latest stories and launches. It’s a refreshing addition to the standard navigation panel which crucially doesn’t impede site speed or functionality. For a user unsure where to look first, it offers an easy starting point. Another small but significant detail is the text under the editorial images, which includes links to the products pictured. Again, an unusual feature that allows visitors to navigate from campaign shoot to checkout in seconds.

Upon opening the homepage, users are immediately greeted with a pop-up invitation to sign up to Selfridges’ email newsletter. This allows them to target every visitor, but it is invasive for the user and a generic approach that doesn’t match their luxury image.

One limitation is the clunky filters. After each selection, they re-load, only for more filter options to appear as you work through the options. This makes looking for something specific quite labour-intensive, leading us to ask whether or not Selfridges offers too many filters.

Bold, Clean and Consistent: Visual Design Rating 4/5

Designers use Selfridges’ iconic yellow and black brand colours to great effect across the site. On the homepage, splashes of yellow inject vibrancy into every page, drawing attention to new product lines and essential information. Calls to action are always in a yellow text box with bold black text, as are banners advertising bestsellers, exclusive and personalisable products. It’s visually striking, on-brand and consistent for the user.

When looking for luxury web design ideas, pay attention to logos, fonts and colour. The choices you make regarding these elements can shape your whole brand design.

Product pages include detailed item and delivery information and multiple high-quality images, but they never feel crowded. The design uses white space wisely, clearly displaying the important information whilst steering users onto further products they may like.

By keeping it simple, the Selfridges website offers the perfect canvas for new campaigns and unique products.

Mobile Website In Line With App Performance: Mobile Optimisation Rating 4/5

Converting from browser to mobile view is seamless. The designers have perfectly configured everything for the smaller screen so you don’t miss out on any content. Product pages are the same as those seen on the app and usability is equally smooth. This is commendable as mobile website functionality is usually stilted and slow compared to app performance.

Linking Instore and Online Services: Retail Integration Rating 4.5/5

The Selfridges website strikes the ideal balance between celebrating their in-store experiences and providing online alternatives for those that can’t make it to a store. The reveal of the second phase of the Accessories Hall at the Oxford Street store is accompanied by an online article crammed full of product links and a chance to shop the complete edit on-site. Each store location has a dedicated page, making it easy for local shoppers to know what’s on where. If a service is unavailable, an online alternative is always presented.

Store updates and Services pages keep customers in the loop on what’s available instore and online, with links to virtual appointments and personal shoppers. These services are booked online using a fully branded, multi-step form. This is a highly effective, bespoke feature that reduces complex forms to simple, guided processes. Customers feel comfortable all the way through and are only presented with information relevant to them. It’s surprising how much of a difference form design can make to the user experience, we have worked with several companies to redesign their customer journey. 

Web Design Begins with Branding

Every element of Selfridges’ online identity, from the website to the app and even the Instagram feed, has been developed to make the boldest use of brand colours. The iconic white, black and yellow lend themselves perfectly to a simple yet striking visual design.

The website layout is clean and consistent. The crisp lines and sense of space are a brilliant example of less is more. Ample white space creates a calmer shopping experience. It’s also reminiscent of the spacious white interior of their stores, in contrast to a crowded high-street shopping experience.

If you’re looking for further luxury web design ideas, tips and inspiration, remember to check back for further instalments in our Luxury Website Design series.

Posted on by Kirk Thompson