{{ searchResult.published_at | date:'d MMMM yyyy' }}

Loading ...
Loading ...

Enter a search term such as “mobile analytics” or browse our content using the filters above.


That’s not only a poor Scrabble score but we also couldn’t find any results matching “”.
Check your spelling or try broadening your search.


Sorry about this, there is a problem with our search at the moment.
Please try again later.

Carter’s has the only website out of 100 major US multichannel retailers to feature responsive design.

The Search Agency’s mobile experience scorecard published this week, highlights 100 ecommerce sites and rates them according to their mobile readiness.

Although over ninety companies operate effective dedicated mobiles sites, Carter’s was the only company to achieve full marks in the site format category because it operates an entirely responsive website.

Responsive web design means that the same website can be deployed for multiple screen sizes, and is the best way for ecommerce sites to increase conversion on mobile devices.

Before reading the The Search Agency's report I didn’t know much about the retailer Carter’s; it’s a USA based manufacturer of children’s clothes, however as this is posited as a leading example of responsive design, there must be some valuable lessons to learn from it.


Here’s how the Carter’s website looks on a full screen desktop.

The bright banner image captures attention immediately (overlarge banners are one of the key ways to design a persuasive website) and drives consumers through to the current sale offer.

Although the only clickable links within the banner are the relatively small ‘shop now’ and ‘find a store’ buttons, when you hover over the ‘shop now’ button it brings up handy links to the relative size of clothes you’re looking for. This makes for a timesaving and efficient button.

There’s a smaller banner under the main one that links to a different offer, again with size and gender options, then just above the fold, Carter’s manages to squeeze in clear social button links, email sign-up and a store locator.

All of this, along with tabs across the top split by child’s age and gender (or neutral), a search field and shipping details, makes for a brilliant example of homepage UX.

On a mobile, the homepage shrinks down to this:

The banner offer remains, but in a much simpler, fully clickable form.

The most immediate call-to-action is the ‘find a store’ button. This is great to drive customers to your offline business. There’s also a search field at the top of the screen.

Tab options that were previously along the top on the desktop, are now found at the bottom of the screen, however as there are two options above the fold, it’s obvious there’ll be more to scroll through.

Scrolling to the bottom of the homepage reveals social buttons, email sign-up, store opening hours and a click-to-call phone number.

Product listings

Here’s the desktop version of Carter's product listing:

There's excellent use of space here, only four products per line, which allows for much larger images. There’s also a full complement of clickable options on the left navigation menu.

Here’s the mobile version:

There are large buttons immediately presented to filter products by style and size, and there are product images above the fold.

It’s great to see such large clear images on a mobile, but there could be a much better use of space here.

Almost a third of the screen is blank, Carter’s could comfortably fit four items per screen with a slightly better layout. Using lots of white space is an effective way to draw the eye to products, however this is too much.


The search field remains at the top of every page on the mobile site. 

A drop down menu appears when you begin input, which allows for quick and easy access and saves on fiddly typing.

You’re then taken through to a product page that intuitively presents you with options to define by gender, size and style, as well as presenting you with 12 full screens of the most popular items within your search criteria.

Shopping basket

On the desktop, when you add an item to your shopping basket, the basket appears as a pop-up window.

The item placed in the basket is clearly indicated. There are further options for ‘you may also like’, a ‘continue shopping’ option, and very importantly the shipping and handling charge is clearly shown. Many shopping baskets are abandoned when shipping fees are hidden as a nasty surprise at the end.

On a mobile, the pop-up window feature remains.

Although it looks slightly unwieldly, as the window doesn’t quite fit on the screen, the window is optimised to present the 'checkout' and 'continue shopping' options first, the only tappable buttons you really need at this point. 

The rest of the window is just for your own reference.


The desktop checkout is great; well designed, clearly spaced with large, bright call-to-action buttons.

There’s a ‘guest checkout’ that bypasses sign in. You just have to enter your address and billing information in collapsible menus. Shipping method options and pricing are also clearly listed.

The checkout is a fluid and efficient experience, all done within the same screen. The chance to save your information for further shopping is presented after the sale has been confirmed.

On a mobile, checkout is just as convenient.

Guest checkout is a particularly important feature, as a customer is much more likely to opt for this on a mobile device.

Input fields are large and easy to navigate, and much like the desktop version, it's all done within the same screen, saving on lengthy loading times that can scupper many a mobile transaction.

I particularly like the easy way you can change countries and denominations.

In conclusion

This is an excellent responsive site from Carter's, with simple functionality and bold call to action buttons. My only complaint is the product listings page on mobile, this seems like an oversight in design, and wouldn't take much effort to alter.

In spite of this, Carter’s is one of those rare sites that provides subtly different experiences on desktop and mobile; carrying over the best functions of one to the other and creating a perfectly optimised experience.

For further advice and guidance, check out this recent post: So you have a mobile site. What happens next? and download our Mobile Commerce Compendium.

Christopher Ratcliff

Published 15 November, 2013 by Christopher Ratcliff

Christopher Ratcliff is the editor of Methods Unsound. He was the Deputy Editor of Econsultancy. You can follow him on Twitter or connect via Google+ and LinkedIn

686 more posts from this author

Comments (6)

Save or Cancel


Nice post, but I wouldn't call Carter's new site Responsive. It's really 'Adaptive'. For the desktop view, there's only one size. If you change your browser width, you see only one size page, then if finally 'snaps' to the mobile size. In fact, a truly Adaptive site would have different breakpoints (typically at least 3), this site only has 2. A Responsive website would scale and adjust from large to small, slowly updating things like navigation appropriately. You should never see a horizontal scroll bar.

almost 3 years ago

Vivek Singh

Vivek Singh, Internet Marketing Consultant at Self Employed

Great post!

Isn't responsive or adaptive (as Esten mentioned) the de facto now.

And did you say it's "the only website out of 100 major US multichannel retailers to feature responsive design." That's a crying shame, isn't it!


almost 3 years ago

Chris Michael

Chris Michael, Digital Transformation Consultant and CTO at CJEM

This site is well structured, but visually not that great.

almost 3 years ago


Matt Isaacs, Senior Ecommerce Manager at Perricone MD

This isn't a fully responsive website, which by definition uses only one template that responds to the screen dimensions.

Personally though, I find this adaptive method is far better for ecommerce as I've yet to see a truly effective responsive ecommerce template. Most seem to make a mess of the smaller screen sizes or any 'middle' dimensions.

The main problem with I find with responsive sites is that they all seem to run off the same grid stylesheet, using the same font in the same size, which makes everything look identical.

For the moment I'm happy to stick with working with adaptive, rather than full responsive. Gives you much much more control of the UX and style.

almost 3 years ago



Good article but no mention about how slow this site is on mobile. I was connecting on WiFi and the homepage took over 10 seconds to load!

The question is "will consumers be patient enough to wait for the device to load the code?"

almost 3 years ago


Joel Siddall

Interesting article and great analysis. This article goes to show just how important catering for mobile users is. I do find it hard to believe that Carter's website is the only responsive site in the list.

almost 3 years ago

Save or Cancel

Enjoying this article?

Get more just like this, delivered to your inbox.

Keep up to date with the latest analysis, inspiration and learning from the Econsultancy blog with our free Daily Pulse newsletter. Each weekday, you ll receive a hand-picked digest of the latest and greatest articles, as well as snippets of new market data, best practice guides and trends research.