Over a million developers have joined DZone.

Top E-commerce Web Design Trends for March

As designers and developers, we bring a wealth of expertise to client work, but it remains essential that we keep an open mind, and allow clients to expose us to new and better practices. Some of the web design trends I've observed this month at Growth Spark are strategies we place significant emphasis on. Read on to hear about these trends.

· Web Dev Zone

Start coding today to experience the powerful engine that drives data application’s development, brought to you in partnership with Qlik.

Image title

As designers and developers, we bring a wealth of expertise to client work, but it remains essential that we keep an open mind, and allow clients to expose us to new and better practices.

Some of the web design trends I've observed this month at Growth Spark are strategies we place significant emphasis on.

Hopefully, you'll find these ideas intriguing and consider exploring them within your own client work.

Building a Customer Hub

Image title

Your client's growth comes from creating a great experience for their customers, which can in turn lead them to referrals, increased conversion, and repeat purchases. This experience extends beyond just their website and spans the entire 'lifecycle' of your client's relationship with their customer. 

A lifecycle consists of all the touch-points customers have with a company; it's the buying journey of discovering a product, making a purchase, receiving the product, and beyond. The best way to create a great experience for customers across this lifecycle is to first better understand them. This can be achieved by building a profile of your client's customers by looking at all the data touch-points can provide.

Ideally, you have a single tool that is building this centralized profile, something we like to generally refer to as the Customer Hub.

By sourcing data from every touch-point, such as on-site behavior, purchase history, email marketing, support tickets, etc., you begin to form a holistic profile of your client's customer. As you begin to form these profiles, you can look at them in aggregate and start identifying interesting patterns and groups. These groups–based on factors such as purchase volume, location, and demographics–are often referred to as Segments. 

Once established, you can use these Segments to create more personalized marketing and a better customer experience. Suddenly, you can identify which products sell best to which Segments, and create specific offers and messages to appeal to those unique audiences. The result is a highly personalized customer experience driven entirely by the data you've captured in your Customer Hub. I highly recommend looking at Klaviyo, Lumiary, or Sauce as potential Customer Hubs that enable this sort of analysis.

In addition to an aggregate categorization of customers based on Segments, creating a Customer Hub allows for improved one-to-one customer support. Rather than your client handling customer support issues with only the context of a single order, using the enriched profiles created in a Customer Hub allows a more holistic understanding of the customers they're helping.

Your client will have a better sense of how long they've been a customer, their entire order history, how engaged they are with marketing, and whether or not they're even profitable (someone on their sixth support ticket might not be worth the trouble). 

Once extended into a physical retail environment, the power of a Customer Hub grows exponentially, as service representatives are able to both utilize and capture heaps of data on customers. Over time, as more data sources are pulled into a Customer Hub, your client's understanding will only continue to grow and improve their customer's experience.

Merchandising Over Cataloging

Image title

Roughly a year ago, I walked into the retail store of a client. We were kicking off the design of their new Shopify website and I figured it would make sense to spend an afternoon at one of their physical locations. What struck me almost immediately was the emphasis on themed displays, located at the entrance of the store. There were several tables set up with products all inspired by similar themes, whether movie-related, season-related, meme-related, etc. 

This client certainly was not the first to set up these sort of displays, in fact, it's an age-old retail technique known as merchandising. Companies such as Macy's became famous for their themed window displays, spawning an entire industry of agencies that specialized in creating highly-decorative displays. In thinking how we could apply elements of our client's in-store experience, we gave more thought to this concept of merchandising and its role in e-commerce. Specifically, we started with thinking through their site structure and navigation.

When discussing strategies for site navigation with our clients, the bulk of folks focus on a catalog approach to their structure. This entails attribute-driven navigation, which allows users to browse and filter products by basic attributes, such as gender, type, color, and size. Attribute-driven navigation is effective for users who want an experience focused on finding a specific product, but leaves something to be desired for customers interested in a discovery-driven experience. It doesn't provide a curated display table that might inspire a wandering customer to dig a little deeper. This is where we saw an opportunity to apply merchandising to the e-commerce world.

Using Shopify's Collection feature, it's easy to manually curate groups of products based on any sort of shared theme. Paired with unique imagery and content related to that collection's theme as a whole, we can create our own  online display table. The key is to use this additional imagery and content to build as much of a story around the theme as possible. Customers often purchase products for the story they tell, rather than for its attributes or features. Merchandising allows you to craft this story around products and provide a unique means for customers to discover products they might not have initially searched for.

Designing for Accessibility

Image title

The concept of optimization is often brought up during the process of designing and developing an e-commerce website. Search Engine Optimization, Load Speed Optimization, and Conversion Optimization are all commonly discussed strategies in such a project. 

One area of optimization that doesn't get discussed as much is Accessibility Optimization. According to the National Federation of the Blind, it's estimated that there are more than seven million people affected by blindness within the U.S. alone. This fairly significant population should also get a great website experience and has money to spend like anyone else visiting your site.

Recently, one of our clients requested we improve the accessibility of their website, and ever since we've been paying more attention to this often overlooked aspect of web design.

If you're open to introducing this practice into your design standards, there are tools and tactics readily available for anyone willing to spend the time improving the accessibility of their websites. The United States Access Board has put together detailed guidelines for ensuring accessibility. 

For those looking for a more abridged version, Tech Republic has put together a great article summarizing many of the key points within these standards. In addition, screen reader tools such as Apple VoiceOver and JAWS make the process of testing and optimizing for accessibility easier.

Frankly, many of the tactics suggested for Accessibility Optimization are good practices in general. Many relate directly to Search Engine Optimization, and as new devices and technologies emerge that might rely on accurate text reading, these practices could help the future proofing of your work. Some of these best-practices include adding alt tags and title tags to images, ensuring form fields are properly labeled and tab-ordered, and adding external links to embedded content. 

In general, taking a little extra time to make your website more accessible not only opens up your market to a demographic of seven million plus consumers, but also ensures you're building good technology.

Originally posted on the Shopify Partner Blog

Create data driven applications in Qlik’s free and easy to use coding environment, brought to you in partnership with Qlik.

web design,trends,trending

Published at DZone with permission of Ross Beyeler. See the original article here.

Opinions expressed by DZone contributors are their own.

The best of DZone straight to your inbox.

Please provide a valid email address.

Thanks for subscribing!

Awesome! Check your inbox to verify your email so you can start receiving the latest in tech news and resources.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}