Connecting with consumers, by design

With more design options than ever, e-retailers must zero inon how their customers want to shop, IRWD speakers advise.

Don Davis

One by one, speakers at last month's Internet Retailer Web Design & Usability Conference showed off newly redesigned e-commerce sites.

They looked nothing like each other.

Nor should they.

At a time when the Internet pervades everyday life in so many ways—letting consumers check prices while in stores, seek friends' advice on social networks at all times, access videos on how to assemble that complicated gadget—each retailer has an almost infinite array of choices to make about which elements to include in an e-commerce site.

How should a retailer choose among those options? By understanding its customers, what they're trying to accomplish and how the retailer can best meet their needs. Design accordingly—then rigorously test to see if it's working.

IRWD speakers—there were 53 of them in 34 sessions over three days—offered plenty of examples of creative designs. And they also explained how they're using testing tools—some of them no more expensive than picking up a lunch check—to make sure their designs are meeting their goals.

A human face

Providing a prime example was keynote speaker Bernard Luthi, chief operating officer and chief marketing officer at Rakuten.com Shopping, the new name of Buy.com, which Japanese e-commerce giant Rakuten acquired in 2010.

Buy.com was a deal-centric site, with its home page jammed with products and promotions. The new site, at Rakuten.com, greets visitors with the picture of a merchant who sells on the site, which is now primarily a marketplace platform that other merchants sell from.

Putting a human face on the merchants who sell on Rakuten.com is how the site—like Rakuten's worldwide e-commerce sites—will differentiate itself, Luthi explained.

"This is how people used to shop," Luthi said. "They used to know the shop owner. They might know if he had kids. That's something we're trying to bring back."

Rakuten.com lets each merchant add its own personality to its product pages and the site seeks to maintain consistency with a common top banner and navigation. That seemed like a good idea, but Luthi emphasized that he and his small team—a big team can water down creativity in the search for consensus, he said—tested at every turn. And they didn't spend a lot of money.

One technique was to bring in groups of 10 consumers, show them newly designed pages for 5 seconds or 10 seconds, then ask them questions. "That provided the initial impression the consumer had, and that initial impression typically lasted throughout the shopping process," Luthi said. "We asked them do they like the site, when they landed on it were they happy, would it make them come back?"

In some cases, the price for conducting the test was the cost of lunch for the consumers who participated. "It was incredibly inexpensive," Luthi said. "And the information we gleaned from doing that as a team was invaluable."

The social shopper

A very different challenge faced apparel retailer Express Inc. last year as it redesigned its e-commerce site at the same time it moved to new e-commerce technology from ATG, now part of Oracle Inc.

The Express shopper is typically in her mid- to late-20's, fashion-conscious, highly social and almost-always connected to friends via her smartphone, Jason LaRose, senior vice president of e-commerce, explained. With that shopper in mind, social sharing is integral to the new site design. Each product page not only allots plenty of space for customer reviews, but also provides icons that allow easy sharing of each review to five social networks.

The typical Express customer's lifestyle dictates the retailer's marketing cadence, as well. Express now sends its marketing e-mails—three to five per week to customers who ask to receive them—at 7 a.m., figuring that the first thing an Express shopper does in the morning is check her phone for messages from friends. "They roll out of bed and look at the darned thing, before they brush their hair or brush their teeth," he says. The strategy is paying off: LaRose said Express' e-mail open rate was 23% higher in 2012 than the year before, though he did not disclose the actual rate.

Responsive design

The fact that young consumers are constantly moving back and forth between mobile phones, tablets and computers also led Express to choose a relatively new approach to building web sites called responsive design. A responsive site adapts to the screen the visitor is using. For example, it allows a retailer to show a horizontal array of three product images on the larger screen of a PC, then stack those images vertically for the narrow display of a smartphone.

Responsive design is an alternative to creating separate sites for computers, tablets and smartphones, and many retailers choose this approach to avoid the work of continually updating two or three e-commerce sites. But that wasn't Express' motivation, LaRose said.

Instead, he said, the retailer wanted to make it easy for consumers to move from one device to another, and find what they want.

"Our customers so seamlessly move back and forth between device types and we don't want to reteach them how to interact with us when they move from one device to another," he said. "We want our customer to know if that's the way you post a review on a desktop, that's also how you do it on a tablet or mobile."

Another speaker also addressed the advantages of responsive design—and its limitations.

Raul Justiniano, web designer for the Original Penguin e-commerce site of fashion brand Perry Ellis, explained that designing the site responsively significantly reduces the amount of time it takes to add new products and weekly promotions. "Having one site to update cuts my workload by more than half," Justiniano said, compared to maintaining separate sites for various types of devices.

It does take more work to design the site initially, because the designer has to think about which elements will display on screens of various sizes, and where they will be placed. There is also an important limitation, especially for a fashion brand like Original Penguin that relies heavily on eye-catching images of models showing off its apparel. He's found that just scaling down an image to fit a smartphone screen often alters the focus of the photo and makes it less exciting. Instead, he must create new images for mobile screens, for example, cropping a photo with four models to show only three, but keeping the center of attention on the most important garment and model.

Justiniano also highlighted another key advantage of responsive design: there is only a single URL for search engines to index. That means all credit for traffic, inbound links, Facebook Likes, reviews and other activity that boosts a site's standing on Google and Bing goes to that single URL, rather than having some of that credit going to a separate mobile web site's address.


Original Penguin was one of many examples cited throughout the conference of how smart design helps with search engine optimization, or SEO, the art and science of moving an e-commerce site up on search engine results pages. This has become such an important consideration for web site designers that IRWD organizers this year for the first time offered a full SEO Day in advance of the main conference.

Speakers during the SEO Day explained that Google Inc. last year made more than 500 changes to the algorithm it uses to rank web sites in response to a search query, many of them designed to ensure that searchers reach a site with credible and original content.

For retailers, that means it's a mistake to use manufacturers' product descriptions, content that many other e-retailers may also use and that search engines may give little credence to, said Seth Dotterer, vice president of marketing and product at Conductor Inc., which specializes in SEO. "If you are just pulling in content from a fire hose that everyone else is drinking from, that doesn't work," he said.

On the other hand, retailers may own valuable content that they don't think to post to a site that sells to consumers. For example, HSN Inc., which sells online and via TV shopping shows, found posting press releases about the company's financial results—documents that Google deems authoritative—benefited search results for HSN.com overall. But be sure to get approval to use that kind of material from everyone involved, including the legal team, finance and public relations, Hugo Guzman, HSN's senior manager of online marketing, advised. "A lot of folks are tempted to run with content, but you need to get buy-in or you are going to run into trouble," Guzman said.

When to break the rules

Checking with top management before posting a financial press release is good advice for all e-retailers, and IRWD speakers provided many other examples of principles that apply to almost all e-commerce sites. For example, make it easy for site visitors to find what they want by providing a large, prominent search box, suggested Bill Albert, executive director of the Design and Usability Center at Bentley University, in a session on identifying and overcoming top usability challenges.

He also advised against using terms that consumers might not understand. A retailer's buyers may think of a pair of petite skinny jeans as "ankle length slim fit denim," but shoppers likely won't search that way. "Avoid jargon and overly stylized terms," Albert said.

How shoppers search depends on who they are, said Albert's co-presenter, Ryan Hennig, vice president of marketing for Miles Kimball, which has brands that cater to older consumers. Those shoppers might call a "bra" an "undergarment," and so the retailer makes sure its search program is built to understand such terms, Hennig said.

That's an example of tailoring design to a specific consumer segment, and sometimes doing that leads an e-retailer to break with convention.

Few retail sites, for example, use brown as the background color on its product pages, but Seventh Generation, a web retailer of natural products, tested brown and found it converted better than a white background. One reason: many of its products come in white containers and don't pop out on a white page. Making that change, along with several others in a recent site redesign, including a clearer Add to Cart button, has boosted its site conversion rate from under 4% to 18%, said Reid Greenberg, director of e-commerce at Seventh Generation.

Test and test again

Greenberg discovered the power of brown by testing, and IRWD speakers reiterated throughout the conference the importance of testing all elements of site design. And they pointed to inexpensive testing tools that can yield big results.

Adrian Salamunovic, co-founder of web-only retailer CanvasPop.com, listed several tools he uses. They include UserVoice.com to get feedback from customers and to track complaints, with pricing starting at $20 per month per agent; UserTesting.com, which recruits consumers to review a site and provides videos of their sessions and written answers to retailer's questions, for $39 per tester; and Baymard.com, which for $150 will check 63 elements on a retailer's checkout pages, such as the correct formatting of fields for collecting credit card and ZIP code information.

Retailer Crate & Barrel, a store and web retailer of contemporary home furnishings, uses Optimizely, a tool designed to let retailers test web page elements without rewriting the underlying code. Optimizely starts at $19 per month for a site with 2,000 monthly visitors and goes up in price based on traffic.

The tool has made it easier for Crate & Barrel to continually test its site, and the results often surprise, said Joan King, the retailer's e-commerce director, during a full-day workshop on site design that preceded the main IRWD conference. For example, the retailer thought adding product ratings to category pages would boost conversion; instead, it reduced it 10% in a test. The idea was shelved.

Another test removed the top navigation bar from the checkout page—eliminating the temptation for the shopper to resume shopping before completing the purchase while also bringing the total price up above the fold—produced only a modest lift on the well-established CrateandBarrel.com site. But the same test on the retailer's sister site CB2.com resulted in a 15% lift in conversion and 10% in average revenue per visit, King said. "Once there was less on the page they started down the checkout funnel more often," she said.

King spoke with Optimizely's founder, Dan Siroker, who developed the tool after finding he needed an easy way to test Barack Obama's 2008 presidential campaign web site as head of analytics. Testing produced big results for the Obama campaign, he said. For example, combining two elements of the home page that tested the best—the central image and the call to action—boosted sign-ups for e-mail messages from 8.3% to 11.6%, resulting in 2.9 million new e-mail addresses and an additional $57 million in contributions.

Testing in that case may have altered the course of a presidential election—and history. Applied to an e-commerce site at a time of rapidly evolving shopper behavior, testing can mean the difference between a retailer identifying how its customers want to shop online and falling behind competitors that do.



Record attendance at IRWD 2013

The sixth annual edition of the Internet Retailer Web Design & Usability Conference drew record attendance of 966, up 5.3% from 917 in 2012.

There was also a record number of companies displaying their products and services in the Exhibit Hall—55 versus 51 in 2012.

Next year's IRWD will take place Feb. 10-12, 2014, at the Peabody Orlando hotel. That event will be held alongside the Internet Retailer Mobile Marketing & Commerce Forum, allowing participants to attend sessions from both conferences and visit a common Exhibit Hall.


Adrian Salamunovic, Baymard.com, Bentley University, Bernard Luthi, Bill Albert, CanvasPop.com, Conductor, Crate & Barrel, Dan Siroker, express inc., HSN, Hugo Guzman, IRWD 2013, Jason LaRose, Joan King, Miles Kimball, Optimizely, OriginalPenguin, Rakuten Shopping, Raul Justiniano, Reid Greenberg, responsive design, responsive web design, Ryan Hennig, SEO, Seth Dotterer, Seventh Generation, UserTesting.com, UserVoice.com, web site design, Web Site Usability