The homepage is often a key webpage for direct and organic search channels for players in the retail fashion industry. In addition to being a crucial step in the browsing process for users, it’s also an opportunity for businesses to introduce and showcase their brand identity through editorials and fashion trends.

However, according to the data we collected in Q1 of 2019, fashion retail homepage bounce rates were as high as 40% across all devices. Users also still spend an average session time of 7min on desktop and 3min 41s on mobile. (Remember, Contentsquare measures bounce rate as having only seen the single page and leaving the site). 

It can be difficult to know what kinds of design iterations will help prevent users from exiting without having viewed at least a few product pages. It’s also impossible to create the perfect homepage, but we have some great tips to follow if you’re looking to improve the design of your fashion eCommerce homepage. 

Don’t place text on cluttered areas of images

Although images and photography are crucial for communicating brand identity and editorial content, make sure you choose images that are text-friendly. Place text over emptier areas of the image, change the image, or place text on an overlay. Always use white text unless brand guidelines say otherwise. Users tend to skip over text that is too long, too small, or just difficult to read. Keep in mind: any information must be easy to digest at a fast pace, especially for mobile users.

Don’t make the hero image the full length of the page

If you’re showcasing your Fall/Winter looks, consider using a static banner —a prominent, single banner on the page that does not have rotating content, one that allows other content to be seen above the fold. We often find the exposure rate — how far down the page visitors scroll — drops drastically below the fold line. 

A hero image that spans the full length of the page could mislead users into thinking there is no other content. Because the average length of mobile pages is around 3,400px, we need to encourage users as much as possible to scroll past the fold line.

Don’t automate carousels

If you’re showcasing new collections or promoting sitewide discounts, avoid automatically rotating slides within the carousel. Instead, use static carousels that do not include more than three slides to allow users an opportunity to digest both the image and information in each slide. Users should be able to use arrows to easily move from one slide to another. 

Although there is a big debate in the design world over whether carousels are effective, we see much less exposure and engagement on the second and third slides. Automating carousels can rob users of control over the experience and as a result, they are more likely to ignore it if the slide moves too quickly for them to read.

Don’t hide primary CTAs or category links below the fold

Instead, make sure they are clearly above the fold line; try placing them on an uncluttered area of the image. You want to encourage users to immediately begin browsing, whether it leads them to a category page or list page for product catalogs that are currently being prioritized. 

Try placing a horizontal category slider at the top of the page and evaluate whether that improves your users’ browsing process. 

Showcase editorial content that is space-conscious and easy to interact with

Make sure that any editorial images on the homepage lead the users to specific categories, seasonal collections, or product pages. Giving them a purpose beyond aesthetics encourages users to explore beyond just the homepage and can help increase session time.

Here is a great example from Ralph Lauren:

The above image on the left showcases the bag as both aesthetic and functional, enticing users with beautiful photography, while leading them to the product page. The text is succinct, easy-to-read, and placed on an uncluttered area of the image. 

The carousel placed on the right provides even more options for the user to view additional products for the upcoming season. Both the image and carousel do not extend past the screen, making it easy to view. Part of the content of the next section is viewable, avoiding the false bottom and encouraging users to scroll further.

Making design iterations to your site never ends. As user behaviors continue to evolve faster than ever, it’s important to continuously evaluate and reassess the performance of individual elements on your pages. It’s important to make design changes based on the needs of your user base, not the general users of the industry. 

Don’t forget to regularly check on other players in your industry for inspiration, as there is much to learn from the digital experiences and websites you enjoy. But remember, just because a competitor does it, doesn’t mean they are improving the experience of their users. So be inspired, yes, but consult your own customer data before implementing changes.

Hero Image Via: Rawpixel.com, Adobe Stock

Helping brands forge an exceptional user experience (UX) for their customers is at the heart of our mission and product, and it’s impossible to discuss UX without also mentioning user interface (UI).

The main arm behind the production of memorable digital customer experiences, save for web development and programming, UX/UI is a sector in its own right, and deserves a hefty amount of credit.  

This is not to undermine the other disciplines that contribute to experience development, such as marketing, merchandising, analytics, etc.

Nonetheless, we’d like to spotlight the UX/UI discipline — and what better way is there to delve into this topic than with the first-hand insights of a UX/UI designer? So I sat down with Fanny Pourcenoux, our very own head of UI design.

And Fanny did not disappoint. I was able to derive heaps of insight into the practice of UX/UI. Aspiring designers ought to take note.

What are some of your go-to UX/UI elements/tricks?

It’s very important to keep in mind that every website is unique, and has a dedicated audience, experience, product range, brand story… Here at Contentsquare we work with international brands in many verticals: retail, luxury, banking, automotive… The goals and challenges are always different and you can’t apply the same UX/UI best practices for all your customers. Based on the global client knowledge we’ve acquired over the past 7 years and our daily handling of our data, my team is able to quickly find and suggest unique & personalized recommendations from Contentsquare insights.

Fanny gives a presentation to the team in Paris.

What are some of the biggest changes you’ve noticed in website design in the past 5 to10 years?

Mobile first is the biggest, of course, from a global perspective, but there are also two other big must-haves.

The first one concerns fast & easy navigation. Visitors are more and more demanding when it comes to having a fluid and intuitive navigation. Today this is perhaps the most important goal for an e-commerce website: to facilitate access to menu/search and cross-category/products navigation.

The second is about immersive experiences. In the same way that brick-and-mortar shops are doing their best to make you live/feel an in-store experience, e-commerce websites are striving to offer an immersive & secure digital experience. Since you are only 1 click away from their competitors, brands have to show you quickly their most popular products, and leverage images and video to show to wear/use them. All this in an environment where your personal & payment data is completely safe (think visible and meaningful reassurance elements). Customer reviews are also a very important decision factor in the buyer journey.

What are the main trends you’re noticing now?

There are you classic trends such as visual signifiers that encourage scrolling, sticky nav or CTAs on mobile, cross-navigation links and blocks…

There are more and more bots, too: to guide you, to assist you with purchases, to answer to your questions… Shorter checkout and forms are also popular. Everyone knows it’s often the most painful part of the purchase journey, and we’ve seen a lot of improvement in form length, social and guest login options, interactive and playful checkout experiences…

What are some of your biggest pet peeves in UX?

Filters! A lot of choices, but a small area to display them. How do you make the best choices to ensure they are easy to use. Cross-selling too —what content to showcase, how does it fit in with the overall goal of the page, where to position it, etc… Each case is different and represents a unique challenge.

How has data transformed the job of a UX/UI designer?

Before using data, UX/UI jobs were only based on UX laws, UI trends and user feedback.

Now it’s so much more powerful!! You can directly access the behavior of thousands of visitors on your website and analyze their behavior patterns in seconds. You can stop relying on intuition to optimize, and instead identify actual pain points to improve and solve. We also have benchmark data for every vertical to be able to compare behavioral data with averages before prioritizing actions.

What advice do you have for aspiring UX/UI designers?  

To be passionate about digital. Spend a lot of time every day browsing international sites and apps to prospect/ buy items and services (from a dress to a plane ticket, to booking an appointment with your doctor or hairdresser). Read articles about the latest tech innovations and trends, cultural preferences when it comes to digital, take part in events with other UX and UI designers so you can share knowledge and learn from your peers.

And don’t be afraid to be wrong. You can have good intuition but “without data, it’s just another opinion.” Identifying the best optimization opportunities based on data has to be your daily motivation.

Mastering the UX/UI to Deliver Desirable Digital Experiences

Ease of use, an intuitive navigation and indicators of safe payments are key UX/UI tricks that will elevate your user experience. While some UX/UI best practices are everlasting, or at least seem to be, many emerging and existing ones should be taken with a grain of salt. This is to say that trends change, along with user expectations. But most importantly, the way your own site visitors navigate and interact with your site can change — sometimes suddenly and abnormally. Luckily, you can make timely UX/UI changes with a secure AI-based alerts system in place.